A
A
Alexey2022-04-19 18:25:26
WordPress
Alexey, 2022-04-19 18:25:26

How to create a menu in WP?

Good afternoon, how to transfer the menu in WP correctly using HTML anguy. I can't assign classes to ul, li , a.

<?php wp_nav_menu( array(
                                        'theme_location' => 'primary_menu',
                                        'container'  => '',
                                        'items_wrap' => '%3$s',
                                        'list_item_class' => 'header_nav-item',
                                        'link_class' => 'nav-link',
                                    )
                                );
                            ?>

<li class="header_nav-item">
                        <a href="/" class="nav-link">
                            <span class="nav-title">Services</span>
                        </a>
                        <div class="hover-submenu">
                            <a href="" class="submenu-link">W</a>
                            <a href="" class="submenu-link">M</a>
                            <a href="" class="submenu-link">B</a>
                            <a href="" class="submenu-link">U</a>
                            <a href="" class="submenu-link">E</a>
                            <a href="" class="submenu-link">I</a>
                        </div>
                    </li>
                    <li class="header_nav-item">
                        <a href="works.html" class="nav-link">
                            <span class="nav-title">Works</span>
                        </a>
                    </li>
                    <li class="header_nav-item">
                        <a href="company.html" class="nav-link">
                            <span class="nav-title">Company</span>
                        </a>
                    </li>
                </ul>

Answer the question

In order to leave comments, you need to log in

2 answer(s)
A
Anton Litvinenko, 2022-04-19
@AntonLitvinenko

There are several approaches to distribute the necessary classes in the menu
1. wp_nav_menu allows you to give classes to the object above the menu, the menu itself, add markup before and after the link using the after and before settings.
2. You can add classes to Li elements in this way
https://stackoverflow.com/questions/14464505/how-t...
3. You can also do it through the filter
https://developer.wordpress.org/reference/hooks/ na...
4. Use the walker_nav_menu class, but PHP skills are needed here, but it allows you to do almost anything
https://wp-kama.ru/function/walker_nav_menu
https://misha.agency/course/menu-wordpress
https ://dimox.name/bem-wp-nav-menu-walker/
5. Reverse the menu using the standard WordPress classes and continue to use this code as a blank

A
Artem Zolin, 2022-04-21
@artzolin

I will supplement the answer of Anton Litvinenko . If you have a completely custom layout, then the easiest way is to get an array of elements using wp_get_nav_menu_object()and output with an arbitrary loop. You can get it by name:

$menu_name = 'Menu';
$nav_menu = wp_get_nav_menu_object( $menu_name );

if ( !$nav_menu ) {
  $menu_id = wp_create_nav_menu( $menu_name );
} else {
  $menu_id = $nav_menu->term_id;
}

// получаем элементы меню
$nav_menu_items = wp_get_nav_menu_items( $menu_id );

By registered location:
$menu_location = 'primary';
$locations = get_nav_menu_locations();

if ( isset( $locations[$menu_location] ) ) {
  $nav_menu_items = wp_get_nav_menu_items( $locations[$menu_location] );
}

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question