0

I am trying to display the content from multiple pages on a single page. However, for each page I need the title, excerpt, content and featured image. The display of each page's content has a different structure, therefore I need control over the HTML elements and their classes and ID. I also need to be able to control the order.

I've read what seems like 20 forum posts and blog articles, but none of the solutions enable control of the HTML structure for each specific set of page content, nor the order in which they are shown.

If anyone can assist, I'd be grateful.

0

This is quite a vast question to answer, so I'm not going to go into depth, I'm just going to cover the essential points.

You'll need to create a custom query to get all the data from your pages. Use WP_Query to create your custom query. Here is a basic query from the codex to get your pages

<?php

// The Query
$the_query = new WP_Query( 'posts_per_page=-1&post_type=page' );

// The Loop
if ( $the_query->have_posts() ) {
    echo '<ul>';
    while ( $the_query->have_posts() ) {
        $the_query->the_post();

        // YOUR LOOP ELEMENTS HERE

    }
    echo '</ul>';
} else {
    // no posts found
}
/* Restore original Post Data */
wp_reset_postdata();

?>

To display the title and post thumbnail, check the following links

You should work through one of the bundled themes to see how the loop is structured and how their HTML structure looks like

To order your pages, you should have a look at the orderby and order parameters in WP_Query that you can use to sort your pages by in your custom query

As for control over your HTML structure, you can use the page ID's in your classes and ID's and target and style them accordingly. Make use of the_ID to get the page ID inside the loop. Do something like this

<div id="whatever-<?php the_ID(); ?>">

or

<div class="whatever-<?php the_ID(); ?>">

EDIT

If you are going to need that strict control over your HTML, then you are going to need to hard code page ID's and HTML structure for each page. You can make use of conditional tags like is_page() for example

if( is_page( 'whatever' ) ) {

   //HTML Structure for page whatever

}elseif( is_page( 'whatever-1' ) ) {

   ////HTML Structure for page whatever-1
} //etc
  • thanks for this. Unfortunately, this doesn't actually allow me to create a different HTML structure for each incoming page. – the Freelancer Aug 25 '14 at 19:44
  • Please see my update – Pieter Goosen Aug 26 '14 at 4:27
  • Glad it helped. Enjoy :-) – Pieter Goosen Aug 26 '14 at 17:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.