Different menu background color for posts

evagenna · June 2018

Hello,

I have set a transparent menu as default on the website.

I want it to be different on blog and post pages: in this case it should have a white background and a a smaller width (for example 800px).

Is it possible?

Thanks

Pablo · June 2018

Hi,

You can change a style of header by using Layouts in Wordpress Dashboard.

When you'll make a new layout, you have to go to your edit your page you want to have different menu and on the bottom of settings you'll find an option named Custom | Layout, set it to your custom layout (http://prntscr.com/jue41s)

But, you can't change color of header using BeTheme Options.

It can be done only with Custom CSS.

Thanks.

evagenna · June 2018

Hello,

I don't want to add a custom layout to a page.

I need the menu to be different ONLY on blog and blog posts: here on this page for example the menu should have a white background and a a smaller width (for example 800px)

https://www.landing.allinclusivebusiness.com/2018/06/13/titolo-esempio/

While it should remain the same on other pages.

Can you suggest some CSS editing to obtain this result?

Pablo · June 2018

Custom CSS will destroy menu this menu because menu is scaled with JS script - it won't be working properly after adding CSS.

Custom Layouts will help you, you can set custom layout only for blog and blog posts as well.

BeTheme > Theme Options > Blog, Portfolio & Shop > Blog > Single Post (http://prntscr.com/jufsvb)

Here's a Custom CSS code for changing color of navbar for blog and blog posts

body.single-post #Header #Top_bar{
background:white !important;
}

body.blog #Header #Top_bar{
background:white !important;
}

Thanks

evagenna · June 2018

Ok, so can you please explain in detail how to obtain the result I want using Layout settings?

This the needed result --> the menu should have a white background and a a smaller width (for example 800px)

This the page ---> https://www.landing.allinclusivebusiness.com/2018/06/13/titolo-esempio/

Because I see no way to set up what I need in Layouts and it seems like there is no way to customize menu.

Thanks

Pablo · June 2018

I see now what you're talking about, pardon me.

Unfortunable, we cannot change it in any way, BeTheme do not allow to change width of header in any way.

Custom CSS is destroying it.

To change width of menu you have to change HTML/JS script, what we do not support.

Cheers.

evagenna · June 2018

I don't understand which code you refer to when you say that is going to destroy menu. The dangerous one is the css for color or css for width? Can I safely use css code you sent before?

I copied it in css editor, the menu turned white, that's ok but also text and logo are white in initial position and not visible. You can see here https://www.landing.allinclusivebusiness.com/2018/06/13/titolo-esempio/

Any solution to make text and logo dark?

Pablo · June 2018

Custom CSS width can make a lot of problems.

I can change only your color of text.

body.single-post #Top_bar a{
color:black !important;
}

body.blog #Top_bar a{
color:black !important;
}

I noticed that you have few types of logo uploaded.

Try to use a blue version of it instead.

It's not possible to make your logo dark in CSS code.

Thanks.

Different menu background color for posts

Comments