A Quick Guide to WordPress Custom Menus

by Nikolaenko Maxim · Published November 5, 2012 · Updated August 8, 2018

Start from the beginning and gradually reach the result.
I think everyone noticed, what's in wordpress, when building a standard structure on templates purchased or downloaded from the Internet, Main menu (top) defined for pages, and the menu in the sidebar for posts.
On one of my projects, I needed to duplicate the main menu at the bottom of the page and the menu items had to be of different types. For example, the page "About the company" was exactly the type "Page", and the news was displayed in the form of "Records", that is, short releases should be output, which will lead to the full news.
Let's start creating our menu from the admin menu Appearance -> Menus. After login, at the top of your admin panel there is an item Screen Options, by changing the settings you can enable data of a certain type or disable it.

I don't think there's much to talk about, what others have already said I will add a small video from YouTube

Take a look at the video above, there is a question Theme Location on the menu Appearance > Menu, just not affected, but this is one of the most important and key issues. When I needed the ability to select the desired menu from the admin panel to temporarily replace it, I simply did not find articles in Russian.

The first thing to remember, it's about the menu API in wordpress. You can read it on the official website at code.

Consider the registration method from my practice:

<!--?php function my_theme_three_navs() { register_nav_menus(array( 'primary' => 'Primary Menu',
	'top' => 'Top Nav Menu',
	'bottom' => 'Footer Nav Menu',
));
}
add_action('init', 'my_theme_three_navs');
?-->

<!--?php function my_theme_three_navs() { register_nav_menus(array( 'primary' => 'Primary Menu',

'top' => 'Top Nav Menu',

'bottom' => 'Footer Nav Menu',

));

}

add_action('init', 'my_theme_three_navs');

?-->

After adding the code snippet to the file function.php on the menu Appearance -> Menus -> Theme Location a new dropdown list will appear with a list of created menus. It remains only to add a label to the theme of our site. About, how to do this in detail, again, you can read in the WordPress Code in English.

An example of setting a label in the site header, header.php file

<? wp_nav_menu(array( 'theme_location' => 'top',
		'container_class' => 'my-nav'
	));
?>

<? wp_nav_menu(array( 'theme_location' => 'top',

'container_class' => 'my-nav'

));

Online tutoring services. List of courses I teach

Basic web design course;
Site layout;
General course on CMS WordPress and continuation of the course on template development;
Website development in PHP.