Grow your CSS skills. Land your dream job.

Nesting WordPress loops [2 loops inside one]

  • # October 23, 2013 at 10:25 pm

    Hi Guys,
    I am trying to nest two loops in one loop.
    The two loops below are pulling content from custom posts and working perfectly individually.
    1st loop:

    <?php query_posts( array( 'post_type' => 'stories') );
       while (have_posts()) : the_post();?><!-- begin of loop -->
    
          <section class="story-sec">
             <h3><?php the_title() ?> <span><?php the_field('title_2nd_row'); ?></span></h3>
              <?php the_content() ?>
          </section>
    
    <?php endwhile; wp_reset_query(); ?><!-- end of loop -->
    

    2nd loop:

    <?php query_posts( array( 'post_type' => 'products') );
          while (have_posts()) : the_post();?><!-- begin of loop -->
    
            <div class="product" style="background: rgba(<?php the_field('box_color'); ?>)">
                <h3><span><?php the_title(); ?></span><?php the_field('product_name_2nd_line'); ?></h3>
                <p><?php the_field('product_description'); ?></p>
            </div>
    
    <?php endwhile; wp_reset_query(); ?><!-- end of loop -->
    

    I want to add these two loop in one so the most latest post from any one of these custom post stays on TOP.
    Does someone here knows how to do this? Thank you!!

    # October 24, 2013 at 11:48 am
    1. Use WP_Query instead of query_posts WP Query

    2. Use only one query, you can accomplish this by passing an array of post_type slugs to the post_type value.

      ‘post_type’ => array( ‘stories’, ‘products’ ),

    # October 24, 2013 at 5:27 pm

    @mcjohnst Thank you so much that really helped a lot. This is what i did and its working perfectly…

        <?php query_posts( array('post_type' => array ( 'stories', 'products')));
            while (have_posts()) : the_post();?><!-- begin of loop -->
            <?php if (get_post_type( $post ) == 'stories') { ?>
                <section class="story-sec">
                    <h3><?php the_title() ?></h3>
                    <?php the_content() ?>
                </section><!-- Story part ends-->
    
            <?php   } else if(get_post_type( $post ) == 'products') { ?>
                                <p><?php the_field('product_description'); ?></p>
                     ?>"></div>
                            </div>
            <?php   } ?>
    
        <?php endwhile; wp_reset_query(); ?><!-- end of loop -->
    

    I would greatly appreciate it If you could help me out with one more thing I am trying to do: With 2 loops I am pulling content from 2 custom posts and they are now in one loop. Now I want to add one more condition to it. The content from the custom posts should only show If the Page title is equal to the custom-filed value, which i am going to pull from each custom post.

    For example the page title is “Fishing” and the value of custom-field from specific custom post is also “Fishing” then this post should show.

    I will be comparing the main page title within the loop so i know that I have to use Global variable like this : which will be out side the loop and I can pull the custom filed value with this:

    <?php $Pago_title = the_title(); ?> 
    

    This

    <?php $Pago_title = the_title(); ?> give me "Fishing" 
    
    and This <?php the_field('persons_name'); ?> gives me "Fishing" both are same, right?   
    

    but when i try to add this condition it doesn’t work.

    I don’t have much knowledge of PHP. Any help would be greatly appreciated. thanks

    # October 25, 2013 at 7:37 am

    Hi man,

    the_title() function echos out the value, not returns it. Use get_the_title() to assign the title to a variable.

    I presume you are retrieving the custom post type pages inside the main loop, yes? So the the_title(), the_content() functions are available to you.

    Alter your query to say:

    <?php
    
    $args = array(
        array(
            'post_type' => array ( 'stories', 'products'),
            'meta_query' => array(
                array(
                    'key' => 'persons_name', // or whatever your custom post type field is called
                    'value' => get_the_title() // will work only if the main loop has started
                )
            )
        )
    );
    
    $query = new WP_Query( $args );
    
    ?>
    

    Let me know if it works ;)

    # October 29, 2013 at 6:49 pm

    Hi @Tomasz Lisiecki Thank you so much for helping me out here. As i mentioned I am not a php programmer and can’t understand complex php code easily. The code you sent me doesn’t really draw a clear picture for me.

    Could you please add your code into the code i provided :) here is my code.

        <?php query_posts( array('post_type' => array ( 'stories', 'products')));
            while (have_posts()) : the_post();?><!-- begin of loop -->
            <?php if (get_post_type( $post ) == 'stories') { ?>
                <section class="story-sec">
                    <h3><?php the_title() ?></h3>
                    <?php the_content() ?>
                </section><!-- Story part ends-->
    
            <?php   } else if(get_post_type( $post ) == 'products') { ?>
                                <p><?php the_field('product_description'); ?></p>
                     ?>"></div>
                            </div>
            <?php   } ?>
    
        <?php endwhile; wp_reset_query(); ?><!-- end of loop -->
    

    Also, I don’t see any if else condition in your code. Filtering the entries based of few specific conditions is my main goal here. I tried to do this but didn’t work:

     <?php if (get_post_type( $post ) == 'stories' && get_the_title() == the_field('select_page'))) { ?>
    

    Thanks again :)

    # October 30, 2013 at 2:06 am

    Hi friend,

    Sorry for not making my code very clear to you.

    Basically what my code does, it adds another criteria to the query to return only these custom posts which custom field matches the parent page title. Therefore you don’t need an extra IF condition inside the loop.

    'meta_query' => array(
        array(
            'key' => 'persons_name', // or whatever your custom post type field is called
            'value' => get_the_title() // will work only if the main loop has started
        )
    )
    

    Please have a read about WordPress query in the Codex. It is explained there very well (even for someone who is not brother with PHP).

    The final code should look like this (sorry for re-writing your script, but I am very picky when it comes to formatting).

    <?php
    
    // Set some arguments for the query
    $args = array(
        array(
            'post_type' => array ( 'stories', 'products'),
            'meta_query' => array(
                array(
                    'key' => 'persons_name', // or whatever your custom post type field is called
                    'value' => get_the_title() // will work only if the main loop has started
                )
            )
        )
    );
    
    // Get results from the database. Please note the WP_Query. This is a proper way of running custom queries.
    $query = new WP_Query( $args );
    
    // Check if there are any results (you can add "else:" case and display 404 page or something - flexibility!)
    if( $query->have_posts() ) :
    
        // Query through results
        while( $query->have_posts() ) : $query->the_post();
    
        ?>
    
            <section class="story-sec">
    
            <h3><?php the_title() ?></h3>
    
            <?php the_content() ?>
    
            </section>
    
        <?php
    
        endwhile;
    
    endif;
    
    wp_reset_postdata();
    
    ?>
    

    I am really sorry if I misunderstood you. Please let me know if this is the solution you are looking for. If not I will happily point you in the right direction again.

    Thanks, Tomasz

    # November 3, 2013 at 12:25 am

    Hi @Tomasz Lisiecki,
    I understand that you code is really efficient for the different posts with same format but I have different HTML code and styling for these two custom posts. I stripped out all the extra HTML here so people could focus on the actual problem I am trying to solve here.
    Also, I need to add many other conditions in if else statements but I didn’t mention those here because i thought that if I could figure out how to do just one than I will have no problem in adding other conditions.

    Do you think you can help me check those conditions in existing if else statements in my code? This is how my actual looks like:

        <div class="product-list">
    
            <?php query_posts( array('post_type' => array ( 'stories', 'products')));
                while (have_posts()) : the_post();?><!-- begin of loop -->
                <?php if (get_post_type( $post ) == 'stories') { ?>
                    <section class="story-sec">
                        <h3><?php the_title() ?> <br><span><?php the_field('title_2nd_row'); ?></span></h3>
                        <?php the_content() ?>
    
                        <div class="social-info"><span class="name"><?php the_field('persons_name'); ?><br><?php the_field('city_name'); ?></span></div>
                    </section><!-- Story part ends-->
    
                <?php   } else if(get_post_type( $post ) == 'products') { ?>
                        <div class="product" style="background: rgba(<?php the_field('box_color'); ?>)">
                                <h3><span><?php the_title(); ?></span><?php the_field('product_name_2nd_line'); ?></h3>
                                <p><?php the_field('product_description'); ?></p>
                                <a class="info-link" href="#">Ingradients/nutritional info</a>
                                <div class="product-img"><img src="<?php the_field('product_image'); ?>" alt="<?php the_title(); ?> <?php the_field('product_name_2nd_line'); ?>"></div>
                        </div>
                <?php   } ?>
    
            <?php endwhile; wp_reset_query(); ?><!-- end of loop -->
            <br class="clear">
        </div> <!-- product-list ends -->
    

    I really appreciate the efforts and time you are putting in this issue to help me out.
    Thank you so much :)

    # November 7, 2013 at 6:56 pm

    I found the solution of this problem.
    Thank you so much everyone… :)

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".