Выглядеть будет так:
Шаг 1. Добавляем стили
[php]
/*———————————– меню НАЧАЛО —————————-*/
ul#mainmenu {
position: relative;
top: 10px;
font-size: 19px;
text-transform: uppercase;
float: right;
}
ul#mainmenu li {
display: inline-block;
padding-right: 15px;
}
ul#mainmenu li a{
color: #fff;
padding: 5px 10px;
background-color: #900;
}
ul#mainmenu li a:hover{
border-bottom: 1px dotted #fff;
background-color: #900;
}
#mainmenu .current-menu-item > a {
color: #FFF;
padding: 5px 0px;
background-color: #900;
}
ul#mainmenu li:last-child {
padding-right: 0px;
}
/*———————————– меню КОНЕЦ—————————-*/
[/php]
Шаг 2. Регистрируем меню в файле functions.php, присваиваем идентификатор maine. В админке появится возможность вклчить нижнее меню.
[php]
register_nav_menus(array(
‘maine’ => ‘Нижнее меню’ //Название другого месторасположения меню в шаблоне
));
[/php]
Шаг 3. Код вызова в header или куда нужно
[php]
<?php
wp_nav_menu( array(
‘theme_location’ => ‘maine’,
‘container’ => ”,
‘menu_class’ => ‘sf-menu ‘,
‘menu_id’ => ‘mainmenu’,
‘fallback_cb’ => false,
‘link_after’=>'<span class="border-menu"></span>’
) );
?>
[/php]
Делаем меню Responsive
Для этого буду использовать – https://responsivemobilemenu.com/en/. Качаем здесь.
Код вывода опубликованный ранее меняем на:
Выводим меню:
[php]
<div class="rmm" >
<?php
wp_nav_menu(
array(
‘theme_location’ => ‘obuch’,
‘menu_class’ => ‘nav rmm-main-list’,
‘container’=>”
)
);
?>
</div>
[/php]
