Moving the nav menu around in Thesis is super easy. If you check out hooks, you will start to figure out that the nav menu can pretty much go anywhere. I this particular video, I show how to put the nav menu above the sidebars. This is especially useful if you have a bunch of nav menu items, as they tend to get cluttered in a normal nav arrangement. Thesis’ super powerful PHP engine makes nav bar adjustments easy as pie. Or if you don’t like pie then cake.
Here is the PHP that I use in this tutorial:
remove_action('thesis_hook_before_header','thesis_nav_menu');
add_action('thesis_hook_before_sidebars','thesis_nav_menu');
And here is the single line of CSS I use:
.custom .menu li { float: none; }Good luck using Thesis! Be sure to send all requests to:
ThesisTutor [at] gmail [dot] com
Remember to Get Thesis or Upgrade to the Thesis Developers Option!
{ 16 comments… read them below or add one }
Dude, you need to put a donate button on this site because these tutorials are fantastic. I would love to flip you a few bucks.
Holy Crap these tutorials are killer!
Hi,
Just want to say your videos is exactly what I need and I think other need to. I wouldnt mind donate some too.
Video tutorials like this is what I have been missing, I get great help in thesis forum….but videos makes it crystal clear and easy to duplicate. Hope you will make more.
Thanks
I’m glad to see you added a donate button. This tutorial is exactly what I was looking for. But one thing did not work. I added the
.custom #tabs li { float: none; },
but my menu is not lined up with one item on top of the next. Instead I have 2 items next to each other, then under that there are 2 items next to each other, and so on. I am able to make it look right with
.custom .sidebar ul.sidebar_list {
padding:20px 20px 10px 30px
}
but with that I feel like I’m just forcing each item on it’s own line because it bumps up against the side of the sidebar.
Thanks
hey.. i tried this and put the commands
remove_action(‘thesis_hook_before_header’,'thesis_nav_menu’);
add_action(‘thesis_hook_before_sidebars’,'thesis_nav_menu’);
i still cannot make my header at the top of thesis theme…
still confusing me
can you tell me how to do that?
thanks
@Kuang
The nav menu is at the top by default…
Awesome V-Tutorial! Keep ‘em coming! Its good that you don’t ramble into another dimension, like other tutorials, keep it simple….Thanks,
Dave
Dude this tutorial kicks ass! I have really been struggling to get a 3 column layout with the nav menu above the left sidebar ! You are a legend! Thanks a million
Thanks
Thank you very much Matt. Very good explanation on how to change the menu side bar from the top to the side. Also, can you tell me what program you are using when playing with the CSS.
Philippe
Sorry Matt — I must be missing something. I watched your tutorial and you have the CSS code as .custom #tabs, but above you have .custom .menu. Unfortunately, neither are working for me! I’m using 1.8 on WP 3.0.1, with the NavBar set to Thesis (as opposed to WP).
Any help you can offer would be great. I don’t know enough to know what I’m doing wrong!
Thanks … but my page links are coming out horizontal not vertical as shown in the video?
what am i missing please?
Thanks!
.custom .menu li { float: none; }
Oops! Code was upstream of “*/” — thanks!
Thanks alot for this tutorial. I had been trying to find out how to change thesis nav into a vertical nav for quite a while now!
Thank you for this FANTASTIC video – I was really struggling with this but you’ve helped me – and so easily! Really appreciate it.