Alternate Styling for Lists.



I'm trying to implement the following code,

<div class="list">
<div class="orders flt_Lt">
<li class="bg"> <a href="#">Chufes</a></li>
<li class="bg"> <a href="#">Chufes</a> </li>
<li> <a href="#">Biases</a></li>
<li> <a href="#">Biases</a> </li>
<li class="bg"><a href="#">Grizzlies</a></li>
<li class="bg"> <a href="#">Grizzlies</a> </li>
<li> <a href="#">Powder Magaziens</a></li>
<li> <a href="#">Powder Magaziens</a> </li>


Each of the <li> Items is a category, from the help docs, I get how to display the list of items,


  <w:kb:item:each category='exp'>
    <li><w:name /></li>

My question is how would I implement the "class='bg'" style is there some kind of counter I could access ?

Have more questions? Submit a request


  • 0
    Michael Slater

    You can access the loop counter with w:each_index and test it with w:if_each_index.

    For details and examples, see

  • 0
    Vicknesh Ramachandran

    Thanks for the input Michael, we just cleaned up the code, and implemented a small JQuery script to update the backgrounds of the items, using

          $(".orders ul li:nth-child(4n+1)").addClass("bg")
          $(".orders ul li:nth-child(4n+2)").addClass("bg")

Article is closed for comments.
Powered by Zendesk