loop - How to load all pages into one page with their templates

admin2025-06-05  1

I am learning how to work with Wordpress, and im trying to build my own website in it.

Since my website is a onepages, i would like to be able to load all my pages ( they then count as sections ) to get loaded on the frontpage, with there templates.

i now have a index.php that loops through the pages but doesnt load the page templates and i just cant get it to work, here is my index.php :

<?php get_header(); ?>
    <!-- START CONTENT -->

        <?php
            $args = array(
                'sort_order' => 'ASC',
                'sort_column' => 'menu_order', //post_title
                'hierarchical' => 1,
                'exclude' => '',
                'child_of' => 0,
                'parent' => -1,
                'exclude_tree' => '',
                'number' => '',
                'offset' => 0,
                'post_type' => 'page',
                'post_status' => 'publish'
            );
            $pages = get_pages($args);

            //start loop
            foreach ($pages as $page_data) {
                 $content = apply_filters('the_content', $page_data->post_content);
                 $title = $page_data->post_title;
                 $slug = $page_data->post_name;
                 ?>

                 <div class='<?php echo "$slug" ?>'>

                 <?php
                     echo "$content";
                 ?>

                 </div>
         <?php } ?>

     <!-- END CONTENT -->
<?php get_footer(); ?>

I really hope you guys can help me out!

I am learning how to work with Wordpress, and im trying to build my own website in it.

Since my website is a onepages, i would like to be able to load all my pages ( they then count as sections ) to get loaded on the frontpage, with there templates.

i now have a index.php that loops through the pages but doesnt load the page templates and i just cant get it to work, here is my index.php :

<?php get_header(); ?>
    <!-- START CONTENT -->

        <?php
            $args = array(
                'sort_order' => 'ASC',
                'sort_column' => 'menu_order', //post_title
                'hierarchical' => 1,
                'exclude' => '',
                'child_of' => 0,
                'parent' => -1,
                'exclude_tree' => '',
                'number' => '',
                'offset' => 0,
                'post_type' => 'page',
                'post_status' => 'publish'
            );
            $pages = get_pages($args);

            //start loop
            foreach ($pages as $page_data) {
                 $content = apply_filters('the_content', $page_data->post_content);
                 $title = $page_data->post_title;
                 $slug = $page_data->post_name;
                 ?>

                 <div class='<?php echo "$slug" ?>'>

                 <?php
                     echo "$content";
                 ?>

                 </div>
         <?php } ?>

     <!-- END CONTENT -->
<?php get_footer(); ?>

I really hope you guys can help me out!

Share Improve this question asked Oct 7, 2015 at 10:09 Dennis HeitingaDennis Heitinga 131 silver badge3 bronze badges 2
  • While it is possible to pull all of your pages (and loop thru their content) to a single page, using dozens of templates on a single page isn't going to happen. I suppose a single page of iframes displaying individual pages as if they were one is possible. – jdm2112 Commented Oct 7, 2015 at 12:50
  • Well i dont know how to properly make a onepager then, any chance you know how to properly make a onepager, so that the user can easily edit all the content ? and is the iframe way not laggy – Dennis Heitinga Commented Oct 7, 2015 at 13:34
Add a comment  | 

2 Answers 2

Reset to default 0

You could do this exchanging each page name for the page you want to use. I just tested and it seems to work. I'm sure there are downsides (speed for one).

<?php
/**
 * Template Name: OnePager
 */
    <?php get_header(); ?>
    <!-- Page One - How it Works -->
    <section id="section1">
    <div class="container">
        <div class="col-sm-12">
            <?php
                $section1 = new WP_Query( 'pagename=how-it-works' );
                while ( $section1->have_posts() ) : $section1->the_post();?>
                <h1><?php the_title(); ?></h1>
                <?php the_content(); ?>
                <?php endwhile;
                wp_reset_postdata();
            ?>
            </div>
        </div>
    </div>
    </section>
    <!-- Page One - Who We Are -->
    <section id="section2">
    <div class="container">
        <div class="col-sm-12">
            <?php
                $section2 = new WP_Query( 'pagename=who-we-are' );
                while ( $section2->have_posts() ) : $section2->the_post();?>
                <h1><?php the_title(); ?></h1>
                <?php the_content(); ?>
                <?php endwhile;
                wp_reset_postdata();
            ?>
            </div>
        </div>
    </div>
    </section>
    <!-- Additional Pages Below -->

    <?php get_footer(); ?>

Sometimes people (including myself) are so determined on using php with wordpress that they waste a lot of time trying to do things like this when they could have created what ever it was in a fraction of the time by just using html. Wordpress is mainly designed for dynamic content. Where for the most part one-pager sites are usually pretty static.

I've done a few of these one page sites using wordpress and here's what I've tried. 1) Static html in a wordpress template (fastest and easiest) 2) Used a pagebuilder. There are a few out there, most notably Visual Composer that have support for doing this. 3) Advanced Custom Fields

Personally I liked the advanced custom fields method the most and have used it a couple times to do this. This way you can easily add image fields and text fields without having to worry about what markup the post editor might alter on output.

    <section>
        <h1><?php the_field('banner_h1_title_text'); ?></h1>
        <h2><?php the_field('banner_h2_description_text'); ?></h2>
        <a href="#" class="btn btn-default">
            <?php the_field('call_to_action_main_button'); ?>
        </a>
    </section>

Or if I'm feeling really lazy I'll use Advanced Custom Fields like above except use it with the Custom Content Shortcode then you don't have to worry about php at all. It's sort of like mustache.js for wordpress, if you've ever used or heard of that. Here a couple pages I just made using that method (parallax / sticky-sections)

Just do whatever is easiest for you. There's nothing wrong with using html for something that is hardly ever edited. Plus if you're doing it for a client, it would give them a reason to keep you around as they would still need your help if they wanted that page changed :)

Create a directory page-templates in your theme for page templates.

Then add your templates there, but omit the calls to get_header() and get_footer().

Create a template default.php and then all additional templates you might need.

Now write the pages and assign the proper templates.

In your loop do this:

foreach ($pages as $page_data)
{
    setup_postdata( $page_data );

    $template = get_post_meta( $page_data->ID, '_wp_page_template', true );

    if ( ! $template )
        $template = 'default';

    locate_template( $template, true, false );
}
转载请注明原文地址:http://conceptsofalgorithm.com/Algorithm/1749117536a316511.html

最新回复(0)