Custom code affect ONLY a section

[Fosca_C]

Helloo!

We have inserted this line of code:

.w-dyn-item:nth-child(even) { direction: rtl; } .w-dyn-item:nth-child(even) p { direction: ltr; }

to make the CMS elements appear alternately.

However, this behavior, only on the “sectors” cms pages , also propagates to the navbar dropdown with CMS.

How should this custom code change so that it only acts on that reference cms? I try put an ID but it doens’t work ):

Can someone help me with a little video?

[Schuschi_Eyes (Martin S.)]

Hi @Fosca_C

That’s quite simple to achieve. Here’s what you have to do:

• Create a class for the collection item (you will need this class in the code)
• Move the custom code element outside of the CMS collection. Just put it anywhere AFTER the CMS collection.

• Change the code in the custom code element:

<style>
.cms-item.alternate:nth-child(even) {
direction: rtl; 
}

.cms-item.alternate:nth-child(even) p {
direction: ltr;
}
</style>

Make sure that the class in the code matches the class you created for the CMS item (in my example I created a main-class and a subclass: .cms-item.alternate)

By giving your CMS items a class you can target them in the code. So only the elements that have this class will alternate.

[Fosca_C]

Thank you so much! Great, it worked!!