How to fetch custom menu and links in WordPress

WordPress customization is always been fascinating for web developers. In this article, we will learn how to create and fetch custom menus and links on a WordPress website.

The PHP code for fetching custom menus and links is written in such a way that you can fetch both parents’ and their children’s menu items.

Create a custom menu

Let’s create a custom menu. Go to “Appearance” and click “Menus”:

Now, click on the “create a new menu” link:

Here you need to set the menu name. We are using “Custom Menu” in this example.

Once you set the name, click on the “Create Menu” button to save it:

Now, configure the menu links and click on “Save Menu” to save your changes:

Congratulations! your custom menu is created.

Now, we will move into the next step which is the coding part.

The PHP code

We will use wp_get_nav_menu_object() and wp_get_nav_menu_items() functions to deal with the menus and their elements.

The wp_get_nav_menu_object() returns a navigation menu object.

While the wp_get_nav_menu_items() retrieves all menu items of a navigation menu.

We will first fetch the custom menu name using its name. And then we will fetch the menu and its items.

Please see the following script for reference and add it to the functions.php of your child theme:

<?php
	// name of menu which you have created
	$menu_name = 'Custom Menu';
	
	// check if menu exists
	if ( $menu_name != '' ) {
		// get menu info by menu name
	    $menu = wp_get_nav_menu_object($menu_name);
	  	// get menu items by menu id
	    $menu_items = wp_get_nav_menu_items($menu->term_id);
	    $menu_list = '';
	    $count = 0;
	    $submenu = false;$cpi = get_the_id();
	    foreach( $menu_items as $current ) {
	        if($cpi == $current->object_id ){
	        	if ( !$current->menu_item_parent ) {
	        		$cpi = $current->ID;
	        	}
	        	else{
	        		$cpi = $current->menu_item_parent;
	        	}
	        	$cai = $current->ID;
	        	break;
	        }
	    }
	    foreach( $menu_items as $menu_item ) {
	        $link = $menu_item->url;
	        $title = $menu_item->title;
	        $menu_item->ID == $cai ? $ac2 = ' current_menu' : $ac2 = '';
	        if ( !$menu_item->menu_item_parent ) {
	            $parent_id = $menu_item->ID;$parent_id == $cpi ? $ac = ' current_item' : $ac = '';
	            if(!empty($menu_items[$count + 1]) && $menu_items[ $count + 1 ]->menu_item_parent == $parent_id ){
	            	//Checking if an element has child
	                $menu_list .= '<li class="dropdown has_child'.$ac.'"><a href="'.$link.'" class="dropdown-toggle'.$ac2.'" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><span class="nav-span"></span>'.$title.'<span class="caret"></span></a>';
	            }else{
	                $menu_list .= '<li class="'.$ac.'">' ."\n";$menu_list .= '<a href="'.$link.'" class="'.$ac2.'">'.$title.'</a>' ."\n";
	            }
	             
	        }
	        // check if a menu item is a parent element
	        if ( $parent_id == $menu_item->menu_item_parent ) {
	            if ( !$submenu ) {
	                $submenu = true;
	                $menu_list .= '<ul class="dropdown-menu">' ."\n";
	            }
	            $menu_list .= '<li class="item">' ."\n";
	            $menu_list .= '<a href="'.$link.'" class="'.$ac2.'">'.$title.'</a>' ."\n";
	            $menu_list .= '</li>' ."\n";
	            if(empty($menu_items[$count + 1]) || $menu_items[ $count + 1 ]->menu_item_parent != $parent_id && $submenu){
	                $menu_list .= '</ul>' ."\n";
	                $submenu = false;
	            }
	        }
	        if (empty($menu_items[$count + 1]) || $menu_items[ $count + 1 ]->menu_item_parent != $parent_id ) { 
	            $menu_list .= '</li>' ."\n";      
	            $submenu = false;
	        }
	        $count++;
	    }
	} else {
	    $menu_list = '<li>Menu "' . $menu_name . '" not defined.</li>';
	}

	echo $menu_list;
?>

The code is written as per the Bootstrap dropdown menu structure. The code is fully customizable. You can change the classes to make them fully customizable as per your theme’s CSS.

Trick:

You can write this code where ever needed on your theme, you can put that code in a function e.g. fetch_custom_menu($menu_name) and put the function code in the functions.php file and just call the function with the menu name e.g. fetch_custom_menu('Custom Menu').

Please note that we have used “Custom Menu” as an example in this article. You can use the menu name according to your requirements.