Need help with Transparent Menu with Beaver Builder

Home Forums Support Need help with Transparent Menu with Beaver Builder

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • #206725

    Hi i am working on doing the Transparent menu on a test site i am playing with to get use to using the theme so i can do this on other sites i use it on..

    I used the home page settings set t0 transparent and i do have this working on the home page here using Beaver Builder and a slideshow pulling images in from Smugmug.

    I am trying to do the same for other pages but using a single top image pulled in from Smugmug.
    I have it working by adding css into BB for that page but i am having a problem with a white top area i can not get rid of.
    Using this code
    .smug-bg-image2 {
    background-image : url(;
    background-repeat: no-repeat;
    background-size: cover;

    This seems to be a area in that it seem i much put something into in the page admin content settings area to be able to see and use the advanced settings for that page.

    How can i get rid of the top white are on this page i think it might not show if i was able to just set the advanced settings for that page with out adding something into the content settings area. I only have a . put in just to be able to access the advanced settings.

    also for a adding a top image to make all this more easy it would be great if you could add in a area in the page so i can just add in the web link to the image as a option i want to use then i would not need to use the css to bring in a outside image making this more easy

    Also can you please add in a CSS area in the customizer that will let me add in css that covers all pages globaly as well.or is their a place to do that?. Thanks


    If you remove padding for this element you can see there is the default blurb behind your picture, I would suggest cleaning all this up before having anther look at what the problem is…..

    See the screenshot with padding removed from this element:

    Perhaps I can look again once you have cleaned up the page….



    Ignore that last comment in my haste I missed the problem, If you look at the screen shot below you will see I have a pointed an arrow to a small dot, this is a . in font size 17px that is causing the problem, remove that “white dot” (black while highlighted….) and you should be ok…



    Lead Developer
    Lead Developer

    It looks like you got this figured out? πŸ™‚


    I am new to generate press and using Beaver Builder. Is there a way I can make the header transparent with the Beaver Builder row behind the menu. I am a gp premium user, but I don’t want to use the header add on when I already have beaver builder to handle it. How can I accomplish this?

    Lead Developer
    Lead Developer

    Hi there,

    This depends, your navigation would have to be inside the header, and your header would have to be absolutely positioned.

    Can you link me to an example page?


    Sure. I am working on it right now at

    Lead Developer
    Lead Developer

    So you would want to add this CSS only in pages where you want it to happen. Our Simple CSS plugin adds a metabox to your pages so you can do this.

    .site-header {
        position: absolute;
        width: 100%;
        left: 0;
        z-index: 500;
    #site-navigation .main-nav li a {
        background: transparent;

    Let me know πŸ™‚


    So it’s on a page by page basis? No way to do it site wide?

    By chance do you guys also have a child theme?

    Lead Developer
    Lead Developer

    You can do it site-wide, but if you have a page that doesn’t have a header like your Beaver Builder pages, it won’t look very good.

    For site-wide CSS, add it to “Appearance > Simple CSS”.

    For sure, here’s our blank child theme:

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