[Support request] transparent navigation background

Home Forums Support transparent navigation background

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #1387903
    Heinrich

    hi team, struggling with a color setup. i want to have the normal navigation transparent but the sticky navigation with a background. when i change the background colour in customizer, it effects both.

    in the screenshot you can see the yellow part i want to have transparent without effecting the background when scrolling.

    screenshot

    #1388054
    David
    Staff
    Customer Support

    Hi there,

    you can use a Header Element:

    https://docs.generatepress.com/article/header-element-overview/

    You don’t need to add any Page Hero content. Just skip to the Site Header tab and select Merge with Content. You can then edit the Navigation colors and set them to transparent.

    The sticky nav will respect the customizer colors.

    #1426116
    Sam

    Hi!
    I wanted to achieve the same. A transparent background but white while on “sticky”.
    The sticky effect set to Hide when scrolling down.
    I didn’t work out for me. Don’t know if I missed something here.
    In:
    Layout / Typography / Primary Navigation the background set to white.
    And I created a Header Element, changing only:
    Merge with content and the display rules to Entire Site.

    What happened: the navigation is always white, the header element didn’t make a difference.

    #1426243
    David
    Staff
    Customer Support

    1. Keep your current Customizer colors for the Navigation.
    2. Edit the Header Element. Make sure Site Header > Merge with content is enabled.
    3. You will see an option for Navigation Colors. Check this.
    4. You can now edit the Colors for the navigation – by default they will be set to transparent.

    #1426866
    Sam

    Almost there…

    #1426879
    Sam

    All right.
    Actually I was struggling with it for really no reason.

    Why: actually the site already has elements configured. Some of those elements already define headers.
    Therefore, what I had to do was to apply “navigation colors” to the already existing elements.

    Simple for those who are more into programming… Not really my case!
    I’m from languages and marketing 🙂

    #1427083
    David
    Staff
    Customer Support

    Well i am glad to hear you found the solution 🙂

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