Instructions for creating menus and getting menus in wordpress

Tutorials 0 lượt xem

Instructions for creating menus and getting menus in wordpress

Menu in WordPress is a pretty important component. Most wordpress websites have this function. So standing in the position of a wordpress coder, you should learn and know how to master it.

In this article, I will show you how to create and get menus in WordPress.

Create menus in wordpress

The menu in wordpress is located at: Admin -> interface -> menu

But when creating a new theme, this menu area will not appear, because in order for the website to support the menu function, you must declare the menu display locations first.

Instructions for creating menus and getting menus in wordpress

When creating a new website theme, the menu function will not be supported

Declare the display position of the menu

To declare the display positions of the menu, insert the following code into the functions.php file of the theme you are using.

function register_my_menu() {
    register_nav_menu('header-menu',__( 'Menu chính' ));
    register_nav_menu('footer-menu',__( 'Menu Footer' ));
}
add_action( 'init', 'register_my_menu' );
<div><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span></div>

The above code declares 2 menus.

  • The header menu displays the menu at the top of the website with the id: header-menu
  • The footer menu displays the menu under the footer of the website with the id: footer-menu

Note: I will use these ids to get the menu.

Add content to the menu

After declaring the menu display position in wordpress, you will see the interface appear as shown below

Instructions for creating menus and getting menus in wordpress

The delay is to add the contents to the 2 created menu positions. See the article on creating menus in wordpress to know how to do it.

Get wordpress menu

To get the menu outside the front end we use the wp_nav_menu function. Specifically, we insert the following code into the position to display.

Code to display header menu

<?php wp_nav_menu( 
  array( 
      'theme_location' => 'header-menu', 
      'container' => 'false', 
      'menu_id' => 'header-menu', 
      'menu_class' => 'menu'
   ) 
); ?>
<div><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span><span>7</span><span>8</span></div>
<?php wp_nav_menu( 
  array( 
      'theme_location' => 'footer-menu', 
      'container' => 'false', 
      'menu_id' => 'footer-menu', 
      'menu_class' => 'menu'
   ) 
); ?>
<div><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span><span>7</span><span>8</span></div>

Explain:

  • wp_nav_menu  is the get menu function.
  • ‘theme_location’  is the menu id you want to get, in this case I get the id I just initialized above
  • ‘container’  is a div tag that wraps outside the menu, (yes or no).
  • ‘menu_id’  is the id of the ul tag when displaying the menu.
  • ‘menu_class’  is the class of the ul tag when displaying the menu.

Epilogue:

So today I show you how to create and get menus in wordpress. The content of this article is quite simple, so you can easily grasp it.

If you have any questions, you can comment below, I will see and answer all questions

Hello friends

Bài viết liên quan