Archived topic
Header and menu
15 replies · Started by Deyana on August 20, 2017
Hi,
I want to make header everywhere (blog page, pages, posts, etc.) like
http://demo.generatepress.com/contact/
i.e. Logo and menu with that height without other header.
I tried with Page Header (Merge with site header), but it requires content on Page Header (I don't see content in your contact page and shop posts) and I still can not change the height of menu.
I'd be grateful if you help me.
I resolved first issue with <!-- page header -->, but still don't know how to change menu height - not height of menu item, just space above and under menu.
Hi there,
Any chance you can link me to the site so I can make sure which space you are referring to?
Thanks!
Hi, Leo,
Thanks for the help.
This is my example page (the same is for the posts)
https://free.otgovori.info/primerna/
Now logo and menu are in the top. I want to be in the middle.
I found that height may be changed with
.inside-header {
padding: XXpx;
}
Am I right, or can be done easy through customizer?
But still i can't put the logo and menu it in the middle :(
So you are wanting both logo and navigation in the center?
If so try adding the logo image as a navigation item as here:
https://docs.generatepress.com/article/centering-logo-navigation/#add-your-logo-to-the-navigation
Then the location to below header and align center:
https://docs.generatepress.com/article/navigation-location/
https://docs.generatepress.com/article/navigation-layout/#navigation-alignment
Let me know if this is what you wanted :)
I'm sorry, I obviously do not explain well with my bad English.
I don't want logo and navigation in the center, I want them in the middle with top and bottom padding.
For now I resolved this with:
.site-header {display:none}
.main-navigation {
padding: 50px 0px;
}
.main-navigation .main-nav ul ul li a {
padding: 10px 10px;
}
.sticky-navigation {
padding: 10px;
}
@media (max-width:768px) {
.main-navigation {
padding: 10px 0px;
}
}
Unfortunately it doesn't work for sticky navigation, where I don't want the same padding :(
Sorry I'm still not sure what you mean. The logo and navigation are currently in the middle already with top and bottom padding?
Maybe adjusting this? https://docs.generatepress.com/article/header-padding/
Let me know :)
I want exactly the same header (logo and navigation) as your demo.generatepress.com :)
Please, see may explanation on the images:
https://free.otgovori.info/docs/desktop-demo-generatepress.jpg
https://free.otgovori.info/docs/sticky-demo-generatepress.jpg
Тhank you for your patience :)
Ok so here are the steps to accomplish that:
- Upload logo in Customizer > Site Identity
- Set the primary navigation Location to float right and menu item height to be the same as the logo height:
https://docs.generatepress.com/article/navigation-location/
https://docs.generatepress.com/article/menu-item-height-width/
- Adjust the header padding:
https://docs.generatepress.com/article/header-padding/
- Upload a navigation logo and set it to Sticky:
https://docs.generatepress.com/article/navigation-logo/
- Adjust the sticky navigation height:
https://docs.generatepress.com/article/sticky-navigation/#menu-item-height
- Set secondary navigation location to float right:
https://docs.generatepress.com/article/secondary-navigation-location/
Let me know :)
Thank you very much! Great Support!
Only one left: color of secondary menu - "Navigation Width" and "Inner Navigation Width" are set to "Full", but... please, Look at the screenshot:
Looks like you figured it out? https://s30.postimg.org/iag9bfcs1/2017-08-23_0841.png
This is other site - https://otgovori.info and it's done with css from my post above. I think that your solution is better.
Look https://free.otgovori.info/primerna/, that is made with your instructions (free.otgovori.info is a test site, home page redirects to otgovori.info).
Try setting the location to above header and align right:
https://docs.generatepress.com/article/secondary-navigation-location/
https://docs.generatepress.com/article/secondary-navigation-layout/#navigation-alignment
It's work.
Thanks again. I wrote a 5 star review in wordpress.org :)