- This topic has 7 replies, 2 voices, and was last updated 1 year ago by
David.
-
AuthorPosts
-
March 17, 2020 at 12:58 am #1197001
TWMA Support
Hi
Please have a look at the following site > http://thecaskreserve.staging.wpengine.com/
You will notice that both the Home page and the general contact pages both have the same header with slide out menu. What I would like to achieve is that on the home page there is no menu background colour or emblem (top left), but only the page content and the hamburger slideout menu (sticky). On the general content pages I want the menu header bar with the emblem and colour strip with the hamburger slide out menu (also sticky).
I have tried looking at using the headers tool but it seems that the menu settings are site wide in the customiser. so spinning my wheels a bit.
Thanks
JonMarch 17, 2020 at 1:30 am #1197023David
StaffCustomer SupportHi there,
create a new Header Element:
https://docs.generatepress.com/article/header-element-overview/
Within go straight to the Site Header tab and enable Merge with content. Then check the Navigation colors option where you can now set the background to be transparent etc.
Then on the Display Rules set which pages etc. you want it to apply to. For the Home page there is a specific display rule of
Front Page
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 17, 2020 at 2:37 am #1197068TWMA Support
Thanks for the above, very helpful. The only thing I am struggling with now is…
– Remove the emblem on the top left of the home page
– Remove the background colour of the menu when you scroll the home page.Thanks
March 17, 2020 at 4:00 am #1197139David
StaffCustomer SupportTry this CSS:
.sticky-enabled.home .main-navigation.is_stuck { background-color: transparent; } .home .navigation-branding { display: none; } .home .main-navigation:not(.slideout-navigation) .main-nav { margin-left: auto; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 17, 2020 at 6:32 am #1197249TWMA Support
Thats great thanks David. Now just need the hamburger menu to stay blue on scroll and I think I am done…
March 17, 2020 at 7:36 am #1197460David
StaffCustomer SupportTry this:
.home .main-navigation.sticky-navigation-transition .main-nav > ul > li.slideout-toggle > a { color: #1e73be; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 17, 2020 at 8:12 am #1197488TWMA Support
Thanks for the help… all working nicely now.
March 17, 2020 at 9:30 am #1197581David
StaffCustomer SupportYou’re welcome
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.