Two menus by default are built into most WordPress themes built with the Genesis framework, these are the primary and secondary menus. Generally these menus are great to use when building an e-commerce store, but sometimes there can be a little confusion for the website administrator on which menu to use for each store menu item (ie cart and account links); or there are too many menu items that simply don’t fit within these two menu areas.
For a client’s e-commerce website, I typically like to add a purpose built menu for the e-commerce store pages. This makes it easier for the client to manage the e-commerce menu ongoing. If you are using the Woocommerce plugin to run your e-commerce store, you can add the following code into your theme functions file to add a new ‘Shop’ menu that only appear on the Woocommerce pages.
Here’s how you can modify the code to suit your needs:
To change the location of where this menu appears, use the Genesis Visual Hook Guide (http://genesistutorials.com/visual-hook-guide/), and choose the appropriate hook location and change the ‘genesis_after_header’ on line 25 to the hook location that would you are after. As an example if you would like the menu to appear at the top of the page above your header you would change the hook to ‘genesis_before_header’.
To remove the menu from a certain woocommerce page i.e. the checkout page, simply remove the conditional out the if statement on line 4.
if ( is_woocommerce() || is_shop() || is_cart() || is_checkout() || is_account_page () || is_view_order_page() || is_product() )
For the menu to take on the styles of the primary menu, add the nav-primary class to the menu_class argument on line 12, if you would like the menu to take on the styles of the secondary menu simply add the nav-secondary class to the menu_class argument arguments.
Lastly, if you would like to add a dropdown to this menu, change the depth argument on line 15 form 1 to 2.
Leave a Reply