Black Friday sale! Get up to 25% off GP Premium! Learn more ➝

[Resolved] Custom H1 class for Page Header

Home Forums Support [Resolved] Custom H1 class for Page Header

Home Forums Support Custom H1 class for Page Header

  • This topic has 2 replies, 2 voices, and was last updated 6 years ago by Leo.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #425722

    Hi there,
    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:

    .main-header h1 {
    	color: #fff;
    	size: 65px;
    	font-family: "Open Sans", sans-serif;
    	font-weight: 700;
    	text-transform: uppercase;

    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?

    Thank you in advance.
    Velin N.


    You can close the thread, I’ve found my mistake and now everything works properly.


    Customer Support

    Glad you found the solution 🙂

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.