Support » Fixing WordPress » Adding different styling every 3rd post

  • Hi,

    Would any be able to help me out on this query….

    I’m trying to add a different style class to every 3rd post displayed inside the loop.

    I’d also like to use this to add a </tr><tr> after every 3rd post on another page (so I can list lots of posts to a table with 3 on each row).

    Thanks for any help on this one!

Viewing 7 replies - 1 through 7 (of 7 total)
  • I’d say there may be a lot of ways to do that..

    Put a counter into loop and fetch style information from a “style pool” using that counter; be sure to use “cycling fetching”…

    Let’s say:

    $style_classes = array('first','second','third');
    $style_index = 0;
    // ...
    // in a loop:
    <span class="<?php echo "class=$style_classes[$style_index%3]"; $style_index++; ?>"> .... </span>

    Does this make sense?

    Hi Dor,

    I can’t get this to work. Below is the code I have…

    while (have_posts()) : the_post();
    $style_classes = array('first','second','third');
    $style_index = 0;
    		<div class="<?php echo "class=$style_classes[$style_index3]"; $style_index++; ?>">
    			<div class="indexreview"><a href="<?php the_permalink() ?>" title="read the interview with <?php the_title_attribute(); ?>"><?php echo c2c_get_custom('Image URL', '<img src="', '" width="240" height="88" '); ?>alt="<?php the_title_attribute(); ?>" />
    			<h3 class="interviewheader"><a href="<?php the_permalink() ?>" title="read the interview with <?php the_title_attribute(); ?>"><?php the_title(); ?></a>
    <?php echo c2c_get_custom('Stand First', '<p>', '</p>'); ?>
    			<div class="postdate"><?php the_time('d.m.y') ?> </div>
    			<div class="commentquote"><?php comments_popup_link('0', '1', '%'); ?></div>
    <?php endwhile; ?>

    I get the following error:
    Parse error: syntax error, unexpected '%', expecting ']' in [mydomain] on line 139

    Can you shed any light on what I’m doing wrong?

    First, this:

    $style_classes = array('first','second','third');
    $style_index = 0;

    should be outside of the loop. Before query_posts, let’s say.

    Next, right you are, that’s my fault, try to use one more variable, like this:

    <div class="<?php $k = $style_index%3; echo "class=$style_classes[$k]"; $style_index++; ?>">

    Mmm… should work.

    Thanks! If you want more or less options do you just change the number of classes in that array and the number here $style_index%3;?

    I’m not using code like this,
    but you can try:

    // outside the loop:
    $style_classes = array('first','second','third', 'fourth');
    $styles_count = count($style_classes);
    $style_index = 0;
    // inside the loop:
    <div class="<?php $k = $style_index % $styles_count; echo "class=$style_classes[$k]"; $style_index++; ?>">

    So, you can change “styles pool” (or, in general case, variables “pool”) and loop fetching over $styles_count.

    Well, you can use also a variant with no extra variable (my fault again):

    // inside the loop:
    <div class="<?php echo $style_classes[$style_index++ % $styles_count]; ?>">

    @dor, sorry i’m not well into programming thing, can you explain what does $style_index%3 mean? Or what i need google to know it 🙂

    I didn’t understand what is % mean. I know it’s very simple, but i don’t know how to google it. :-[

    upd. oh i get it

    This is awesome, but I’m not sure how to implement a similar option using the wp_nav_menu tag. I’m not very familiar with PHP.

    This is what I have. I get a parse error if I use another <?php ?> inside for the class of the span. Any ideas on how to make it work for this template tag?

    $style_classes = array('first','second','third','fourth');
    $style_index = 0;
    <?php wp_nav_menu( array( 'container_class' => 'menu-header', 'before' => '<span class="$k = $style_index%3; echo "class=$style_classes[$k]"; $style_index++;">', 'after' => '</span>' ) ); ?>
Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Adding different styling every 3rd post’ is closed to new replies.