Creating a Single Page Theme correctly

I created a single page WordPress theme to learn the process of creating a theme, and it all works great and all, but it’s done in a very hack-ish way where if I wanted to distribute this, I’d have people wondering how the hell it works.

In short, you create pages like you would any other theme, and then you add them to your main menu. My code then reads the menu contents and loads the page content in the order the pages are on the menu. (See code below)

Obviously this is not how it should be done. What I’d like to know is how am I supposed to do this? I’ve yet to find a good guide for single page themes and how they’re supposed to work. Any help would be greatly appreciated.

And now my entire index.php file:

<?php
/**
* @author Spedwards
* Date: 2020-01-20
*/
get_header();

$menu_slug = ‘header-menu’;
$locations = get_nav_menu_locations();
if (isset($locations[$menu_slug])) {
$menu = get_term($locations[$menu_slug]);
$menu_items = wp_get_nav_menu_items($menu->term_id);
if ($menu_items) {
foreach ($menu_items as $item) {
$page = get_page_by_title($item->title);
?>
<section class=”section-page” id=”<?= $page->post_title ?>”>
<div class=”container”>
<h2 class=”page-section-heading text-center text-uppercase mb-0″><?= $page->post_title ?></h2>
<div class=”divider”>
<div class=”divider-line”></div>
<div class=”divider-icon”>
<div class=”fas fa-crown”></div>
</div>
<div class=”divider-line”></div>
</div>
<?= $page->post_content ?>
</div>
</section>
<?php
}
}
}

get_footer();

Live example

Read more here:: Creating a Single Page Theme correctly

Leave a Reply

Your email address will not be published. Required fields are marked *