Page List Template help!
Permalink
Hi,
I am looking to replicate a page list layout where the list layout will alternate on each record and the background will change colour too....see attachment for what I'm trying to achieve.
So my question is what is the best way for me to achieve this?
Many thanks for any help received.
Kind regards
Stu
I am looking to replicate a page list layout where the list layout will alternate on each record and the background will change colour too....see attachment for what I'm trying to achieve.
So my question is what is the best way for me to achieve this?
Many thanks for any help received.
Kind regards
Stu
Thanks for your reply, unsure how I can move the divs around in the layout just using CSS. I was thinking of coming from the angle of having a counter within the page_list template file and then having three different layouts according to the page list number, i.e if its article 1 then this layout/background colour / bg image, if its article 2 then.... if article 3 then....if article 4 repeat as article 1 if that makes any sense!?
yeah, you can do this with a bit of php too...It just depends what you prefer.
If you go that way, I would still use css classes for the colors, and use (bootstrap) grid classes for positioning.
This way it would be easy to create a nice responsive design.
If you go that way, I would still use css classes for the colors, and use (bootstrap) grid classes for positioning.
This way it would be easy to create a nice responsive design.
Yep it's already built in Bootstrap and working fine with responsive etc, my issue is now I'm moving the site ton concrete5 how I can achieve the item count within the page_list template file?
A nice way to do this could be using array and the % (modus) operator (left-over).
Create an array with 3 strings of classes, then use (counter % 3) to get 0, 1 or 2.
something like:
Or just use if :D
Create an array with 3 strings of classes, then use (counter % 3) to get 0, 1 or 2.
something like:
$counter = 0; $mydivclass = array( 0 => 'color1 col-xs-12 col-md-8', 1 => 'color2 col-xs-12 col-md-offset-4 col-md-8', 2 => 'color3 col-xs-12 col-md-offset-2 col-md-8'); // and in the loop: <div class="<?php echo $mydivclass[$counter % 3] ?>"> </div> <?php ++$counter ?>
Or just use if :D
You're a star! Great starting point for me!!
Many thanks
Many thanks
:nth-child(odd) and :nth-child(even)
here's the first link I found on google:http://stackoverflow.com/questions/5080699/using-css-even-and-odd-p...