Streaming live at 10am (PST)

Add custom CSS for specific CMS item

Hello. I have a collection of posts, I’d like to create a custom ordered list style for one of the posts inside the collection, how can I do this? Is it possible to assign a custom class to a specific post for example?

I’d like to style ordered lists differently in this one post. The posts use rich text to display the content.

Thank you.

do you have a demo of your site? need specific examples to suggest a solution

How would I make all the H1’s on just one of the posts’s content pink for example?
https://preview.webflow.com/preview/flexible-template-example?utm_source=flexible-template-example&preview=1c3cc9398cd87ed859a9c5cdb4a81d19

Thanks

jQuery is loaded for you already. Just add a class to elements you need to change. Style the class on an existing element on a comp page. You could create a field in the cms for markup. JQuery as an example, then in the page template, add the field as content in the markup you add to the template footer.

You don’t even need JavaScript/jQuery for this…

<style>
.post-pod[href="/posts/5-great-web-design-resources"] h2 {
    color: hotpink;
}
</style>

That looks excellent, never seen that before. I’ll give it a try.

Hi Sam – I think you’ve misunderstood. That Href selector is for targeting the Href attribute of a link element, not the web address of the page. So unfortunately, looks like we’re back to a JavaScript solution for this.

Oh, I misread. You should have linked directly to the page http://flexible-template-example.webflow.io/posts/5-great-web-design-resources

Here you go:

<script>
if(location.pathname === '/posts/5-great-web-design-resources') {
  $('h2').css('color', 'hotpink');
}
</script>