CODEWITHSUNDEEP
phpwordpressloopshide
Shaun Taylor
Shaun Taylor

Reputation: 972

Hide loop if no posts exist

I simply have a single loop that's pulling through a CPT, but I would like to hide the whole container div of the loop, if it has no posts...

I'm trying various iterations of this if statement surrounding the container:

<?php if( have_posts() ): ?>
<?php endif; ?>

But I can't seem to get it to work properly... The full code blog is here:

<?php if( have_posts() ): ?>

<div class="container default-strip-section">
<h2><?php the_field('vacancies_title'); ?></h2>
<div class="row justify-content-center">

    <?php
        $args = array( 
          'post_type' => 'vacancies',
          'posts_per_page' => 9999
          // 'orderby' => 'title',
          // 'order'   => 'ASC'
        );
        $the_query = new WP_Query( $args );
    ?>

    <?php if ( $the_query->have_posts()  ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>

        <div class="col-md-12">  
            <a href="<?php the_permalink(); ?>">
                <p><?php the_title() ?></p>
            </a>
        </div>

    <?php endwhile; wp_reset_postdata(); endif; ?>

</div>
</div>

<?php endif; ?>

Can anyone point out what I'm doing wrong? I'm sure I'm missing something simple! Thanks for looking!! :)

Upvotes: 1

Views: 307

Answers (2)

Shoelaced
Shoelaced

Reputation: 881

@rank's answer is nearly correct -- it needs the object instance before the_post() again:

<?php
$args = array( 
    'post_type'      => 'vacancies',
    'posts_per_page' => 9999, // If you're wanting to show all posts, use -1 here.
);

$the_query = new WP_Query( $args );

if ( $the_query->have_posts() ) :
    ?>

    <div class="container default-strip-section">
    
        <h2><?php the_field('vacancies_title'); ?></h2>
        
        <div class="row justify-content-center">

            <?php
            while ( $the_query->have_posts() ) :
            $the_query->the_post();
                ?>

                <div class="col-md-12">  
                    <p><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></p>
                </div>

                <?php
            endwhile;
            ?>

        </div>
    </div>

    <?php
endif;
wp_reset_postdata();
?>

Upvotes: 1

rank
rank

Reputation: 2544

You need to put the html of the container after the if have_posts(), where you check if there are any posts. This way the whole container is not displayed when the if is not true. But you are using a ACF field of the post where you are showing this list of vacancies. So we save the id into a variable to be able to view the value inside of your custom query called the_query (this is not a self-explanatory / good name). Why not call it vacancies_query to have a more readable code. Putting it together it should look like this:

<?php
    $current_post = get_the_ID();
    $args = array( 
        'post_type' => 'vacancies',
        'posts_per_page' => 9999
    );
    $vacancies_query = new WP_Query( $args );

    if ( $vacancies_query->have_posts() ) : ?>
        <div class="container default-strip-section">
            <h2><?php the_field('vacancies_title', $current_post); ?></h2>
            <div class="row justify-content-center">
                <?php while ( $vacancies_query->have_posts() ) : the_post(); ?>
                    <div class="col-md-12">  
                        <a href="<?php the_permalink(); ?>">
                            <p><?php the_title() ?></p>
                        </a>
                    </div>
                <?php endwhile; ?>
            </div> <!-- row -->
        </div> <!-- container -->
    <?php else :
        /* nothing to see here */
    endif;
    
    wp_reset_postdata();
?>

Upvotes: 1

Related Questions