scriptygoddess RSS Feed
 
 
 
 

Alternating comment colors

I feel just a wee bit lazy sharing this, because this snippet is only five lines long. However, these five lines have done more to make one of my sites pleasant to read than just about any other five lines of PHP I've written.

The idea: let PHP drop in alternating styles into your comment text. On skins 2 and 3 of geek-chick.net I use this to alternate the colors of table rows, but in this example I'm showing you how to use it in a <p> tag.

This should be a quickie to implement, no matter what CMS you're using.

Put this block of code up at the top of your page:

<?
function comment_style() {
static $comment_count;
$comment_count++;
if ($comment_count % 2) {
echo "odd";
}
else {
echo "even";
}
}
?>

…and for whatever bit of repeating text that you want to alternate styles on (usually comments), do this:

<p class="<? comment_style(); ?>">

I've set up the classes "odd" and "even" in my stylesheets. If you want different names, change them in the comment_style() function and name them appropriately in your style sheet.

What does this function do? Pretty simple, really. It declares the variable $comment_count to be static, meaning that the current value of $comment_count isn't erased after each time the function runs. (Otherwise, it would run, and reset, and run, and reset, and $comment_count would always be equal to 1…which is useless.)

Here's the part that might snag you. $comment_count % 2 doesn't mean "divided by two." Division, in PHP, is done by the / operator. That next line actually means "If the current value of $comment_count, divided by two, generates a remainder, then echo "odd."

Those wacky coders….

I'm sure there are vastly more interesting uses for this code than what I've come up with so far, so I thought I'd share with you guys.

8 Responses to “Alternating comment colors”

  1. 1
    Gaile:

    Amy, I must have picked this up from somewhere else you have it posted, I've been using it in my journal for awhile now (see the comments of any post). I'm in the process of switching over to mt and a new layout but this is one little code snippet I don't want to forget. Thanks!

  2. 2
    Donna:

    An elementary question, but I just have to ask it: to implement this line

    &ltp class="&lt? comment_style(); ?&gt"&gt

    you place one version in your style sheet as "odd" and one as "even", then use the &ltp&gt tag in your comment template?

    Or would "even" and "odd" be where you name the colors you want to use? That makes sense to me.

    It sounds like I might be over-thinking things…Thanks!

  3. 3
    Tricia:

    Heeeeeey, that's a nifty idea! :)
    I like having my comments pop-up, so I just have a VERY simple style sheet with them, and maybe alternating colors or styles would snazz it up just a bit.

  4. 4
    Lynda:

    Awesome Amy! Thanks for sharing. :)

  5. 5
    kristine:

    This is really cool :) Thanks for actually explaining why it works – I love learning the whys behind things :)
    I could really see how this could be a cool thing to implement on a high-use blog to make each post alternate colors! Now I just need to find a good use for it on my site so I can try it out :wink:

  6. 6
    Row:

    Actually I think that's a very useful application of the code you wrote. So there. :D

    Thankyou.

  7. 7
    Paul V:

    ok after 3.5 hours of searching for this code and then another 6 hours of trying different places to put it. The pc is about the be thrown out the window for just a simple thing.

    I know you guys and gals that just LOVE coding write like coders and believe me non coders or those with little if not any knowlege of what they are doing get lost in your mumbo jumbo.

    Question for you clever guys and gals.

    Where exactly do you put that code?
    Which page?
    Between which other code?
    And what should be written in the css?

    Thank you so much in advance.

    Paul V

  8. 8
    Dayna:

    Could we use this methos on div tags instead of paragraph text?

Categories

Archives

Bookmarks

WordPress Resources

Meta

ADVERTISEMENTS