Move the Main Navigation in WooThemes Canvas
For anyone who has worked with me or talked about picking a WordPress theme, they’ll know that I almost always suggest the Canvas theme from WooThemes.com. With a nice clean slate and a huge selection of user-facing options, Canvas can be modified to fit any need – as shown by the growing variety of Canvas Child Themes. Still, there was something that always bugged me about Canvas – the main Navigation was below the header. This means if you have a large header or only have it on certain pages, the navigation menu can bounce around and it never stays static – I like my menus at the top of the browser, gosh darn it.
As expected with Canvas, it’s an easy fix! Just add the following code to your theme’s
functions.php file to stick that menu right where it belongs:
And voila! Your site should now look like this:
See it in action on the example site: dafttheater.com
Update: February 17, 2015
Thanks to Joe in the comments section below, here’s a bit of modified code to get the “Top Menu” below your “Primary Menu”, which would most likely be an ideal setup. Thanks for the code, Joe! 🙂
Have any questions or comments about this article, or ways you think it can be improved?
Join the conversation in the comments below, or sign up for my newsletter to recieve periodic updates!
This is exactly what I was looking for. Thank you!
I’ve tried reducing the padding on the header at the top in order to move that a bit higher with no success. And ideas?
Thank you. This is almost what I’m looking for and am sure it is just a case of changing something simple, but how would I place the top menu below the primary menu?
I managed to get the top menu blow the primary menu by replacing woo_nav with woo_top_navigation and then swapping the remove/add lines.
However, for some reason, it is still showing the top menu in its original location as well as below the primary menu.
Sorry about all these messages, but hopefully this will turn up for anybody else looking.
The fix for this was to have this in the second section:
remove_action( ‘woo_top’,’woo_top_navigation’, 10 );
add_action( ‘woo_header_after’,’woo_top_navigation’, 10 );
Good addition, Joe! Thanks for that – I’ll actually add it at the bottom in case anyone else has the same question. 🙂
Hopefully it will help 🙂