Make Primary Menu Navigation Bar Overlay Static

Hi Sgreenb7,

Your logo seems to be displaying fine on scroll:

https://prntscr.com/jb59k3

Thank you!

Hey thanks for the help.

I am referring to this situation seen here https://www.dropbox.com/s/vjs1uw9yau2jhcp/1st%20logo.JPG?dl=0

I want the background to always remain white and not disappear.

Hello @sgreenb7,

You can add the following custom CSS to Appearance -> Customize -> Additional CSS section to make the navbar background white.

.navbar.navbar-transparent {
    background-color: #fff;
}

Hey thanks that worked great. Can you also help me do the same for the colors of the options in my navigation bar (home, about, contact us). Since we made it always white now they don’t show up at the top until you begin scrolling since they are set to be white at the top at the start and fade with the same effect the navbar was doing.

What I’m saying is so they also just stay the same color and dont have that fade effect.

Would be much appreciated,
Thanks
Simon

Hello @sgreenb7,
I see you found a way to fix the colors on the menu on the navigation bar after you set it to white. Would you mind sharing how, because I have the same problem.

T.I.A.

Hey @terrangirl ,

This is the code I have in my additional CSS of customize:

.navbar-brand > img{ 
max-height: 50px !important; 
}

.navbar.navbar-transparent {
    background-color: #fff;
}

.navbar.navbar-transparent .navbar-nav > .active > a {
    color: #555
}

First part: adjust the logo image size to 50px

Second part: Makes the background of the nav menu white

Third Part: What you are looking for. Controls the color of the menu items when the navbar is at the top. Make these the same color (#555 in my case) to the color code you have when it scrolls.

Let me know if this helps and if you have other questions.