WordPress.org

1. soyuz
   Member
   Posted 3 years ago #

   I'm trying to style the every fourth post on the page differently from others in a template. so the different style will be applied on 4th post, 8th post, 16th post.

   i found somewhere on this forum a similar situation but i can't make it works.

   here is what i did:
   

   <?php $counter = 0; ?>
   
   	<?php if (have_posts()) : ?>
   	<?php $top_query = new WP_Query('showposts=16'); ?>
   	<?php while($top_query->have_posts()) : $top_query->the_post(); $first_post = $post->ID; ?>
   	<?php $counter = $counter + 1; ?>
   		<div class="thumbscol  <?php if(4 == $counter) : echo 'last'; endif; ?>" id="post-<?php the_ID(); ?>">
   		<?php
   			if (c2c_get_custom('thumb')) {?>
   			<div class="thumb-holder">
   				<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><img src="http://example.com/images/thumbs/thumb-<?php echo c2c_get_custom('thumb');?>" alt="<?php the_title();?>"/></a>
   			</div>
   		<?php } ?>
   		<div class="thumb-info">
   			<h2><?php the_title(); ?></h2>
   				<span style="miring">Type: <?php the_category(', ') ?></span>
   		</div>
   	</div>
   <?php endwhile; ?>

   But it only added the "last" on the 4th post.

   If someone can point me into the right direction, i really appreciate it.

   Thanks in advance.

2. muthukswamy
   Member
   Posted 3 years ago #

   Use this if you want to add styling for post 4th, 8th, 12th, 16th .... and so on

   <?php $counter = 0; ?>
   
   	<?php if (have_posts()) : ?>
   	<?php $top_query = new WP_Query('showposts=16'); ?>
   	<?php while($top_query->have_posts()) : $top_query->the_post(); $first_post = $post->ID; ?>
   	<?php $counter += 1; ?>
   
   		<div class="thumbscol  <?php if($counter%4 == 0) : echo 'last'; endif; ?>" id="post-<?php the_ID(); ?>">
   		<?php
   			if (c2c_get_custom('thumb')) {?>
   			<div class="thumb-holder">
   				<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><img src="http://example.com/images/thumbs/thumb-<?php echo c2c_get_custom('thumb');?>" alt="<?php the_title();?>"/></a>
   			</div>
   		<?php } ?>
   		<div class="thumb-info">
   			<h2><?php the_title(); ?></h2>
   				<span style="miring">Type: <?php the_category(', ') ?></span>
   		</div>
   
   	</div>
   <?php endwhile; ?>

   If you want to add only for 4th, 8th and 16th post alone, use this:

   <?php $counter = 0; ?>
   
   	<?php if (have_posts()) : ?>
   	<?php $top_query = new WP_Query('showposts=16'); ?>
   	<?php while($top_query->have_posts()) : $top_query->the_post(); $first_post = $post->ID; ?>
   	<?php $counter += 1; ?>
   
   		<div class="thumbscol  <?php if(($counter == 4)||($counter == 8)||($counter == 16)) : echo 'last'; endif; ?>" id="post-<?php the_ID(); ?>">
   		<?php
   			if (c2c_get_custom('thumb')) {?>
   			<div class="thumb-holder">
   				<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><img src="http://example.com/images/thumbs/thumb-<?php echo c2c_get_custom('thumb');?>" alt="<?php the_title();?>"/></a>
   			</div>
   		<?php } ?>
   		<div class="thumb-info">
   			<h2><?php the_title(); ?></h2>
   				<span style="miring">Type: <?php the_category(', ') ?></span>
   		</div>
   
   	</div>
   <?php endwhile; ?>

3. soyuz
   Member
   Posted 3 years ago #

   Thanks a lot muthukswamy! it works like a charm :).

Topic Closed

This topic has been closed to new replies.