Every 2nd output different

Hey there!
I am fairly new to Kirby…and to programming with php. I guess this will be an easy one for you pros!

On my parent page, I’d like to display all my children pages in a kind of list:

First child:
Picture on left side, Excerpt with a grey background and orange Button on right side.

Second child:
Excerpt with an orange background and grey Button on the left side, pic on the right side.

pic, grey back & orange button

…and so on.

Can anybody help me with the code?

This can be done with CSS, without any PHP code. Search for nth() child selector.

As regards the order of the elements, the best solution depends on what method you use to put the elements next to each other, if you use flexbox, you can use the order property. If you are using float, you can float the element left or right, all without having to change the order of the elements in the DOM.

It shall look like this. Lovely piece of art istn’t it? So i am trying to realize this by css… I have never tried the nth() child selector.

The most lovely piece of art I’ve seen in a while, yes :wink:

Edit: here’s another post with the same subject that might be helpful: SOLVED - Alternate layout project thumbnails