Hi Webflow friends, I am having a heck of a time changing the H5 (the blue text) in this rich text block within a collection. I have tried everything I can think of, looked at other posters questions and answers and I CAN NOT get it to change. If i go into the collection and change it from an H5 to a H4 it changes but I want the H5 to be a dark grey colour (h4 is green - “work experience”) I have tried to create a “new” H5 and change it in hopes that this one will change we well, but it doesn’t. I have been working on this for 3 days now and I am going nuts!!!
You need to go to any other page that’s not a collection page and drag in the heading component. (You can drag it in anywhere as you will delete it in a sec).
Select the component and from it’s settings select H5.
From the selector box choose ‘All H5 Headings’ (as pictured).
In regular CSS you only need to create selector scope and thats it (more specific wins):
h4{
color: black; /* global site heading */
}
.some-rich-text-wrapper h4{
color: DarkGray; /* override h4 global setting */
}
my html
<h4>I am black</h4>
<div class="some-rich-text-wrapper">
<h4>i am DarkGray</h4>
</div>
You find the same idea for Webflow richtext editor. Try this steps:
Steps:
1. Drag to the page some rich-text block
2. Create wrapper class "test" (or any name!)
![|572x196](upload://rop0i3V60I6VuiVOM9iAQvTni6B.png)
3. Set h4 to blue or any color
4. Now remove this richtext editor and give to your teams-->information block this class
THank you so so much Rob!! This helped out a ton. It was such a simple thing and your directions were so perfect. I know it may sound silly but this made my day lol.