[Resolved] menu and header transparant

Home Forums Support menu and header transparant

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #977286
    Ewout

    Hiya,

    On my website http://tyker.com/concept

    I want all the background for the headers and menu’s on all devices to be RGBA(255,255,255,0.75) (White transparent)

    How do I achieve this?

    Kind regards,

    Ewout

    #977309
    David
    Staff
    Customer Support

    Hi there,

    you can edit the Customizer > Colors > Primary Navigation or Off-canvas Panel and set the background colors there

    #977320
    Ewout

    Hi David,

    added it to primary and Off-canvas but this didn’t work out….

    Please your insight on this.

    Kind regards,

    Ewout

    #977323
    Leo
    Staff
    Customer Support

    Do you want the transparent navigation style to be global or only when header element merge is used?

    #977728
    Ewout

    Hiya,

    I have the main menu for desktop merged but for mobile devices not. Do I have to delete the merge element?

    What I would like to accomplish is that all the menu’s(desktop tablet mobile) have a transparent background of rgb(255,255,255,0.7)

    I hope it makes sense:)

    Kind regards,

    Ewout

    #977734
    Ewout

    And also the headers, you can see now that there is an transparant background in the heaer but behinde the menun items on desktop there is als another layer of color.

    kind regards,
    Ewout

    #978212
    Leo
    Staff
    Customer Support

    Currently the header color is set to rgba(255,255,255,0.8) in the header element and you have added the CSS below which is setting the navigation color:

    .inside-navigation {
    	background-color: rgba(255,255,255,0.8)
    }

    You can’t have rgba(255,255,255,0.7) on top of rgba(255,255,255,0.8) as they are both transparent.

    I hope that makes sense.

    #978293
    Ewout

    Yes thank you, that helped to put away one layer.

    Now i only have a different layer right behind the menu items, how can that become the same as the rest?

    Kind regards,

    Ewout

    #978367
    Leo
    Staff
    Customer Support

    If you want the navigation color to be the same as header color, then try setting the navigation color to transparent by removing the hex code.

    #978382
    Ewout

    Yes that works, but than my sticky and mobile nav bar have no rgb(255,255,255,0.7)…

    Any suggestion on that?

    Kind regards,

    Ewout

    #978385
    Ewout

    I can see that in the top of the page there is a rgb(255,255,255,0.7) layer, is this because of the element I made for merging the header to be transparent?

    If so, can I remove that and make just the headers and menu’s background rgb(255,255,255,0.7)?

    Kind regards,

    Ewout

    #978529
    Leo
    Staff
    Customer Support

    That case then set the option in the customizer to be rgb(255,255,255,0.7) then transparent in the header element navigation color setting:
    https://docs.generatepress.com/article/header-element-overview/#navigation-colors

    Let me know if this helps 🙂

    #978538
    Ewout

    Thanks for the answer.

    I just made it work with some custom css, now its working fine.

    Thanks for your time and efforts!

    Kind regards,

    Ewout

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