[Resolved] Highlight top 10 posts

[Author]

Posts

[michaelP-16]

Hi there,
how can I hightlight the first 10 posts in my view. Looks like the green background color from resolved posts here in forum?

Kind Regards
Michael

[Nigel]

Hi Michael

There is a slightly laborious way you can do this in your loop output section using the wpv-index shortcode to generate different output (i.e. add a class to a container) for the first iteration ([wpv-item index=1]) and the second iteration ([wpv-item index=2]) and the third iteration ([wpv-item index=3]) etc. (https://toolset.com/documentation/user-guides/views-shortcodes/#wpv-item).

A neater solution is just to add a CSS rule to style the first 10 items differently, so make sure you have some kind of container for each loop iteration (e.g. div with class="iteration"), then you should be able to add a CSS rule like this:

.iteration:nth-child(-n+10) {
    background-color: green;
}

[michaelP-16]

Hi Nigel,
yes, thats it.
The simple css-solution works great.
I work for the first time with wp types and sometimes I make it difficult for myself.
But I think already now that I become a new fan of wp types 🙂

Thank you ffor your quick support.
Kind Regards
Michael