The ability to alternate row colors exists in the WCI portal style sheets, but it’s not completely obvious how to get nice alternating background colors where you’re rendering a list like search results.

There’s some documentation on how to create an adaptive layout Knowledge Base page that’s unusually comprehensive, and it sheds some light on a little trick: Adaptive Tags can do basic math with pt:logic.intexpr.

So for example, you could work your way through a $result list variable and run a mod operator on the index, which basically allows you to compute the remainder of a division operation. Which means, if you divide by 2 for every integer, the remainder will be zero half of the time and 1 the other half.

Using this nugget of knowledge, we can write code like this to alternately apply a background style color to each row of a table:

<pt:logic.intops pt:expr="($result.rank) % 2" pt:key="remainder" /> <pt:logic.intexpr pt:expr="($remainder) > 0" pt:key="isOdd" /> <pt:logic.if pt:expr="$isOdd"> <pt:logic.iftrue> <tr height="25" class="listText listItemOneBG"> </pt:logic.iftrue> <pt:logic.iffalse> <tr height="25" class="listText listItemTwoBG"> </pt:logic.iffalse> </pt:logic.if>

Credit to **Rick Ptasnik** for sharing this code a couple of years ago!

Tags: adaptive tags, Coding Tricks, logic