Archived topic
Put inside of
6 replies · Started by Matthew on February 13, 2018
For layout purposes (i want a translucent background on the nav to overlay the background on the header section), I was wondering if it's structurally possible to move the main, top <nav> inside of the <header> just above it? Current it is <header></header><nav></nav>, and I would like it to be <header><nav></nav></header>.
I'm using the child theme, so I'm guessing I need to find the correct file to edit from the main theme, move it into the child theme, and then edit... but I'm unsure exactly which files and where to edit.
Thank you very much!
When I posted this, it took <nav> and <header> out of my subject line... sorry about that. I don't see a way to edit the subject/topic now.
Hi there,
I'm not quite sure what you mean.
What are you trying to achieve?
Would GP hooks help at all?
https://docs.generatepress.com/article/hooks-overview/
http://demo.generatepress.com/hook-locations/
I want to put the top <nav> inside of the <header> at the top of the site. Currently it is outside of it when I look at the source code.
So basically I want to move to code for <nav> to be up inside <header> so the structure would be:
<header>
<nav> </nav>
</header>
What about setting the navigation location to float right? https://docs.generatepress.com/article/navigation-location/
Thank you for the replies.
I don't want it to float right in that space... I would like my top nav / menu to be beneath my logo, so that I have space to the right of the logo for an advertisement.
Any further thoughts?
Thank you very much.
Hi Matthew,
The easiest thing to do here is to use hooks.
1. Open your container in the Before Header hook:
<div class="header-container">
2. Close it in the After Header hook:
</div>
Then style the container:
.header-container {
background-image: url(URL TO YOUR IMAGE);
}