Stephanie Leary

Writer, WordPress consultant, recent MLIS grad

Call a navigation menu using a shortcode

52 Comments

Today I came across a weird situation: I needed to place a navigation menu in the content of a page. A shortcode was the obvious solution, but there doesn’t appear to be one built in for menus. I created this one very quickly:

function print_menu_shortcode($atts, $content = null) {
	extract(shortcode_atts(array( 'name' => null, ), $atts));
	return wp_nav_menu( array( 'menu' => $name, 'echo' => false ) );
}
add_shortcode('menu', 'print_menu_shortcode');

Place this in functions.php, then use [menu name="main-menu"] to call the menu in your content (replacing "main-menu" with your menu’s slug, of course).

You could adapt this to accept any of the other arguments available for wp_nav_menu(), but this served my purposes.

Reader Interactions

Comments

  1. Thanks for the post. I wrote it like this:

    function my-shortcode-name() {
    return wp_nav_menu( array( ‘theme_location’ => ‘mymenu-name’,’depth’ => ‘2’,’menu_class’ => ‘my-class-name’, ‘echo’ => false ) );
    ;}add_shortcode(‘my-shortcode-name’,’my-shortcode-name’);

    One problem tough. When I put the shortcode in a custom post type field the class “current_page_item” wont show up as it should. Any solution for this?

    I tested “wp_reset_query();”:

    function my-shortcode-name() {
    wp_reset_query();
    return wp_nav_menu( array( ‘theme_location’ => ‘mymenu-name’,’depth’ => ‘2’,’menu_class’ => ‘my-class-name’, ‘echo’ => false ) );
    ;}add_shortcode(‘my-shortcode-name’,’my-shortcode-name’);

    It works on pages but mess up the site on posts.

    Any solution?

    BR.

    Hakan

    Reply

    • Hehehe almost 5 years later, but I didn’t need it till today. Perhaps you were looking something like this:

      In functions.php
      function print_menu_shortcode($atts, $content = null) {
      extract(shortcode_atts(array( 'name' => null, 'class' => null ), $atts));
      return wp_nav_menu( array( 'menu' => $name, 'menu_class' => $class, 'echo' => false ) );
      }

      add_shortcode('menu', 'print_menu_shortcode');

      And in the content
      [menu name="-your menu name-" class="-your class-"]

      Hope you find your solution in time.

      Reply

  2. Thnak you!! This is brilliant! I am not a coder but this was exactly what I needed. I saw some popup somewhere to donate but don’t now. I will throw in a few bucks for this.

    Reply

  4. That’s great! I searched now for while to solve that problem because I did too many widgets with widget logic and now this works out of the box – copy&paste and done – thanks a lot!

    Reply

  9. Now need a slight edit – any thoughts?

    Need the ability to display just the sub pages from the page it displays on?

    Reply

  10. I was about to write this same code, then I thought I bet someone else has had this same exact issue so I searched, and sure enough… This worked great, thanks!

    Reply

  11. Thanks for this post! Your description is – for me – as a WP-newbie inconceivable, as I do not understand where to copy the text “[menu name =” main menu “]” to? Also in the functions.php of the theme below the copied function?

    Reply

  12. For hours I’ve been looking to get this one!
    THANKS! It works smoothly.
    If anyone can make this work with a combobox or dropdown, it would even be better, but this one is fine already!

    Reply

  14. Hi,

    I’m looking for a solution to replace the default wordpress menu.
    My “custom” menu generated with the ‘Accordion Pro’ plug-in will be perfect.
    It outputs a shortcode like this:

    [accordion_pro id=’5′]

    Currently the header.php file has the following code to make the default menu appear:

    ‘primary’ ) ); ?>

    Where do I have to place the shortcode to replace the default menu with the Accordion Pro menu?

    Thanks!

    Reply

  17. Hi Stephanie,

    thx for this great post. I was searching for a plugin, but with a shortcode its much easier. At the moment I m trying to combine it with a dropdown menu. if it works, ill post here again :-)
    thx for your help!
    cheers Arthur

    Reply

    • Andrew – I know this is a long time afterward but hoping you can help me with this issue. How did you get the dropdown menu to show??

      Reply

  31. Wow thank you Stephanie! I have been using a stupid plugin to do this same thing for months now. I was going through the plugins on my site this weekend, trying to get rid of any unnecessary ones, which is when I found this guide. Cheers.

    Reply

  32. Hello,

    This code worked but the menu is showing vertically. I tried to add a display:inline; to have it horizontal but no change. Can you help?

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *