WordPress.org

1. Damien
   Member
   Posted 2 years ago #

   Hi.

   Wondering if anyone knows how I can display a
   <div class>...<div>
   after every 10 article posts on my index page. I would have 10 articles, then the div, another 10, then the div, then another 10 and finish.

2. esmi
   Theme Diva & Forum Moderator
   Posted 2 years ago #

   Set up a counter variable before the Loop. Then inside the loop, increment the counter every time the Loop runs and run and check to see if it's reached 10. If it has, output your <div> block and reset the counter back to zero.

3. Damien
   Member
   Posted 2 years ago #

   I've come up with a solution (I think) but I'm really unsure if this is the way forward... I'm getting some strange behaviour from this when I change the count so it's most likely wrong.

   As I said, I was after something like this (no content here, just an image link), I'm pulling the forst image from each post and displaying it, and in after every 4th post I would like to add a div called "thumbs"

   Post 1 Image 1
   Post 2 Image 2
   Post 3 Image 3
   Post 4 Image 4
   </div><div thumbs>
   Post 5 Image 5
   Post 6 Image 6
   Post 7 Image 7
   Post 8 Image 8
   </div><div thumbs>
   post 9 etc etc...

   This is what kinda works... anyone see what I've done wrong?

   <?php if (have_posts()) : ?>
   <?php $count = 0; ?>
   <?php while (have_posts()) : the_post(); ?>
   <?php $count++; ?>
   <?php if ($count%4== 0) : ?>
   
   //this is for the after 4th, 8th, 12 etc posts
   </div><div class="thumbs">
   //end this is for the after 4th, 8th, 12 etc posts  
   
   <?php $postimageurl = get_post_meta($post->ID, 'thumbnail', true);
   if ($postimageurl) {
   ?><div class="thumb">
   <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
   <img src="<?php bloginfo('template_directory'); ?>/timthumb.php?src=<?php echo get_post_meta($post->ID, "thumbnail", true); ?>
   &w=300&zc=1" alt="" /></a>
   <div class="vote">
     <a href="/login" class="like"></a>
      </div>
   <a class="source" href="<?php the_permalink() ?>" target="_blank">Visit the source</a>
   </div>
   
   <?php } else { ?>
   
   <img src="<?php bloginfo('template_directory'); ?>/images/wpshoutlogo.jpg" alt="WPShout.com | No image available" /></a>
   <div class="vote">
   <a href="/login" class="like"></a>
   </div>
   <a class="source" href="<?php the_permalink() ?>" target="_blank">Visit the source</a>
   </div>
   <?php } ?>
   
   <?php else : ?>
   
   <?php $postimageurl = get_post_meta($post->ID, 'thumbnail', true);
   if ($postimageurl) {
   ?><div class="thumb">
   <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
   <img src="<?php bloginfo('template_directory'); ?>/timthumb.php?src=<?php echo get_post_meta($post->ID, "thumbnail", true); ?>
   &w=300&zc=1" alt="" /></a>
   <div class="vote">
   <a href="/login" class="like"></a>
   </div>
   <a class="source" href="<?php the_permalink() ?>" target="_blank">Visit the source</a>
   </div>
   
   <?php } else { ?>
   
   <img src="<?php bloginfo('template_directory'); ?>/images/wpshoutlogo.jpg" alt="" /></a>
   </div>
   <?php } ?>
   
   <?php endif; ?>
   <?php endwhile; ?>
   <?php endif; ?>

4. esmi
   Theme Diva & Forum Moderator
   Posted 2 years ago #

   Not gone through all of the code (the WordPress pastebin might make it easier to read) but spooted this:

   <?php if ($count%4== 0) : ?>
   
   //this is for the after 4th, 8th, 12 etc posts
   </div><div class="thumbs">
   //end this is for the after 4th, 8th, 12 etc posts

   Where's the end of that if statement? Shouldn't it be:

   <?php if ($count%4== 0) : ?>
   
   //this is for the after 4th, 8th, 12 etc posts
   </div><div class="thumbs">
   <?php endif;?> //end this is for the after 4th, 8th, 12 etc posts

5. Damien
   Member
   Posted 2 years ago #

   hmmm good point... I just noticed what you mean, I'm using a modified version of this:

   <?php if (have_posts()) : ?>
   <?php $count = 0; ?>
   <?php while (have_posts()) : the_post(); ?>
   <?php $count++; ?>
     <?php if ($count == 2) : ?>
             //Paste your ad code here
             <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
             <?php the_excerpt(); ?>
      <?php else : ?>
             <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
             <?php the_excerpt(); ?>
     <?php endif; ?>
   <?php endwhile; ?>
   <?php endif; ?>

   http://www.smashingmagazine.com/2009/06/10/10-useful-wordpress-loop-hacks/

   Gonna have to read up and get my head around this, thanks for your help so far :)

6. Damien
   Member
   Posted 2 years ago #

   Works for me now :)

   <?php if (have_posts()) : ?>
   <?php $count = 0; ?>
   <?php while (have_posts()) : the_post(); ?>
   <?php $count++; ?>
   <?php if ($count%3== 0) : ?>
   
   // make with the usual article content
   //and do something under every third post
   
   <?php else : ?>
   
   // make with the usual article content
   
   <?php endif; ?>
   <?php endwhile; ?>
   <?php endif; ?>

7. esmi
   Theme Diva & Forum Moderator
   Posted 2 years ago #

   Glad to hear you got it sorted and thanks for posting the solution.

8. Damien
   Member
   Posted 2 years ago #

   no problems mate, and just as an added note for those with no idea;

   <?php if ($count%3== 0) : ?>

   3 being the number of articles shown before the extra code you add to display below it, a banner or anything you like.

Topic Closed

This topic has been closed to new replies.