Add div after every 3 posts

1 Views

Here’s my current code: 

<?php 
$mvp_posts_num = esc_html(get_option('mvp_posts_num')); 
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1; 
query_posts(array( 'posts_per_page' => $mvp_posts_num, 'paged' => $paged ));
if (have_posts()) : 
    while (have_posts()) : the_post(); 
?>
    <li class="infinite-post">
        This is where post summaries will be displayed.
    </li>
<?php 
    endwhile; 
endif; 
?>

This is basically repeating the class continuously down the page. However, after every 3, I want to add this:

Read More
<div class="post-info-name left relative"></div>

I know how to do this with foreach statements but this is for a WordPress theme and it looks like it’s something a bit different that’s needed.

I’m okay doing this with PHP or CSS, whatever is best.

Any help would be greatly appreciated.

Post Views: 1

Related posts

2 comments

  1. This is fairly simple

    <?php 
$mvp_posts_num = esc_html(get_option('mvp_posts_num')); 
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1; 
query_posts(array( 'posts_per_page' => $mvp_posts_num, 'paged' => $paged ));
if (have_posts()) : 
    $x = 0;
    while (have_posts()) : the_post(); 
?>
        <li class="infinite-post">
            This is where post summaries will be displayed.
        </li>

<?php 
        $x++;

        if ( $x == 3 ) :
            echo '<div class="post-info-name left relative"></div>';
            $x = 0;
        endif;    
    endwhile; 
endif; 
?>

  2. You could try:

    <?php 
$mvp_posts_num = esc_html(get_option('mvp_posts_num')); 
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1; 
query_posts(array( 'posts_per_page' => $mvp_posts_num, 'paged' => $paged ));
if (have_posts()) : 
    $loopCount  = 0;
    while (have_posts()) : the_post(); ?>
    <li class="infinite-post">
        This is where post summaries will be displayed.
    </li>
    <?php
        $loopCount++;
        if ( $loopcount > 2 ) :
            $loopcount = 0;
            echo '<div class="post-info-name left relative"></div>';
        endif;
    endwhile; 
    endif; 
?>

Comments are closed.