[Support request] Changing header font color when using Elements header

Home Forums Support Changing header font color when using Elements header

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #1029129
    gedosan

    Hi guys,

    How do I change the header nav bar font color (and set the background to transparent) on a page where I’m using an Elements header? I’d also like to tweak the size of the H1 tag as well just for that page.

    I’m using Tom’s Simple CSS plugin, so able to add page-specific CSS.

    Thank you kindly,

    G

    #1029138
    David
    Staff
    Customer Support

    Hi there,

    within the Header Element > Site Header Tab you can set it to Merged – example setup here:

    https://docs.generatepress.com/article/page-hero-examples/#example-2

    In the Header Element – there is an Elements Class field. Give it a class name eg. custom-hero then you can use that class to target the H1 :

    .custom-hero h1 {
        font-size: 56px;
    }
    #1029154
    gedosan

    Hmm, I already did that (set it to merged)?

    #1029174
    gedosan

    sorry just spotted it. By the way, could you provide me with the CSS to control the size of the author pic, byline and date please?

    #1029208
    David
    Staff
    Customer Support

    So you already have this CSS for the author avatar in Simple CSS:

    .page-hero-gravatar img {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        position: relative;
        vertical-align: middle;
        margin: 0 10px 0 0;
    }

    Change the width and height properties to resize.

    For the byline and date try adding this:

    .hero-meta a,
    .hero-meta time {
        font-size: 16px;
    }
    #1029239
    gedosan

    Perfect thanks

    #1029246
    David
    Staff
    Customer Support
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.