- This topic has 9 replies, 2 voices, and was last updated 10 years, 6 months ago by
.
-
Posts
-
Wes, what’s the best way to add the nav bar to the top of a site using the Agile theme? Something similar to this image with the logo on the left, nav at the top, and Genesis Responsive slider below. Also with the nav staying at the top on the interior pages as well.
Thanks.
Remove the “remove_action” in the functions file.
Then follow this tutorial to add it back – http://www.studiopress.com/tutorials/navigation#reposition-primary You can add it to wherever you need it to show by taking a look at the hooks – http://www.studiopress.com/tutorials/hook-reference …….then make your adjustments from there.
So I removed that section and added in the following:
/** Reposition the primary navigation */
remove_action( 'genesis_after_header', 'genesis_do_nav' );
add_action( 'genesis_before_content_sidebar_wrap', 'genesis_do_nav' );
For some reason, there is a search bar showing up on the right side of the “header” area and I have no idea where it’s pulling from since I don’t have a search widget inserted anywhere. Check it out here.Obviously I still need to do some CSS work to get the nav to look right, but is there a theme whose code you would recommend copying any pasting over to get the nav to align horizontally across instead of vertically as it is now?
The search box is coming from your Genesis Theme settings. Go into your Genesis Theme settings and uncheck the box under the Primary Nav that says – “Enable Extras on Right Side?”
…The nav was designed/coded to be vertical for this theme, so I don’t have any extra “shortcuts” for it since that was the intention. However, you may be able to get away with removing the “clear: both” for the <li> – .menu-primary li, .menu-secondary li, #header .menu li on line 313
Wow, I feel stupid! Of course that’s where it would be pulling from!
I tried removing the “clear: both”, but it didn’t have any effect on the nav layout. Where would you recommend starting to change it from vertical to horizontal?
Looks like its still there……you may have removed it from somewhere else. It should be on line 313 (currently) –
.menu-primary li, .menu-secondary li, #header .menu li {
clear: both;
float: left;
list-style-type: none;
}When I remove it, this is what your site looks like – http://i.imgur.com/v1v3z.png
Got it! Sweet. One (hopefully) last question. Is there a way to make the header right (left) widget area show up at the bottom of the content when viewing on a mobile device? Currently when I shrink the browser the Facebook page (or any other widget) displays below the title but above the navigation and content. I think it would look much better if it shifted below. What should I change in the responsive code to make it do that?
Not sure how that can be done just yet. The css will only control the display, but it doesn’t control the order/location of the html/code. There would need to be some type of PHP/Javascript needed to make something like that happen.
Ok, thanks. If you run across a way to that, let me know. That would make the theme even better! Thanks again for your help.
- The topic ‘Adding Navigation to the Top of Site’ is closed to new replies.