Docs

[AppScholar2016]

Hi,

I’ve read several different threads on this (and I’ve copy/pasted the code recommended in those convos to no avail).

I am using Renew Stack.

My website is: AppScholar.com

I am attempting to replicate the transparent Top Bar and Navigation shown in this theme: Transparent Header Example I Wish To Mimic in X-Theme

So the navigation bar does the following:

• Is always transparent if a picture is in the column directly underneath
• Has the column color of column directly underneath if no picture is used
• The Column Picture underneath the transparent Navigation and Top bar extends upward to become a part of their background as well (since they are transparent)

Any help is greatly appreciated.

Thanks!

[Rupok]

Hi there,

Thanks for writing in! Let’s follow this thread – https://community.theme.co/forums/topic/minor-problems-with-transparent-navbar-in-revolution-slider/#post-1391398

Cheers!

[AppScholar2016]

Hello,

I did reply to the thread you referenced and they (a member of your team) told me to start my own thread (that’s what this is) instead of replying to an old thread (the link you’d referenced to reply to) that is complete (please click through to the link you referenced to validate my claim).

Please help me now on this thread with my issue. PLEASE.

Thanks

[Rad]

Hi there,

What are these two? I’m not sure what column you’re referring to your provided site.

1. Has the column color of column directly underneath if no picture is used
2. The Column Picture underneath the transparent Navigation and Top bar extends upward to become a part of their background as well (since they are transparent)

The CSS and code that you added aren’t working since your navigation isn’t set to fixed positioning. Let’s start with this, please go to Admin > Appearance > Customizer > Header > Navbar Position and set it to Fixed top. Then I’ll continue checking 🙂

Thanks!

[AppScholar2016]

Hi,

Okay, I’ve set the Navbar Position to ‘Fixed Top’ but it still isn’t working.

I’m trying to make it do this (please see attachment). So the image that is set for Section 1 background moves up underneath the transparent Navigation bar and Top Bar.

I believe I misspoke in my earlier post. I’m wanting the Section 1 image or color (depending on the page) to be the background behind the transparent header (like seen in the homepage example).

🙂

Thanks!

[Rad]

Hi there,

Ah, you just wish to make it transparent 🙂

In that case, please remove other CSS and Javascript added from other threads, instead, add this CSS.

.x-topbar, .x-navbar {
    background-color: transparent !important;
}
.masthead {
height: 0px;
}

If you wish to implement it to your home page only, then change it to this

.home .x-topbar, .x-navbar {
    background-color: transparent !important;
}
.home .masthead {
height: 0px;
}

Hope this helps.

[Author]

Posts