I’m trying to create a page header for the blog page of my website and I need a little assistance. Since I’m able to use HTML in the page header content, I’m trying to include the following:
<h1>My Heading Title Goes Here</h1>
However, this will automatically fetch the global h1 style with color, size and so on (which I can globally edit from the theme customizer). However, I would like to have a new custom h1 class used only for that page header and I’m not quite sure how to achieve that.
So far I’ve tried the following:
1. I’ve installed the default GeneratePress child theme
2. From the custom CSS editor I’ve included the following code:
3. In the page header content I’m using the following h1 tag:
<h1 class="main-header">My Heading Title Goes Here</h1>
All changes are correctly saved, however, when I reload the page I’m not able to see the heading title properly, it seems that my custom CSS is overwritten with the default settings of the theme and with the styles that can be set from the page header content page (in terms of color, alignment and so on). Is there any way to have a new custom h class which I can use in the header?