Имеется такая структура меню:
<ul class="nav navbar-nav nav__top-menu">
<li class="nav-item">
<a class="nav-link" href="index.html">home</a>
</li>
<li class="nav-item dropdown">
<span class="nav-link" id="thisIsUs" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" >about</span>
<ul class="dropdown-menu" aria-labelledby="thisIsUs">
<li><a class="dropdown-item" href="#">sub1</a></li>
<li><a class="dropdown-item" href="#">sub2</a></li>
<li><a class="dropdown-item" href="#">sub3</a></li>
<li><a class="dropdown-item" href="#">sub4</a></li>
<li><a class="dropdown-item" href="#">sub5</a></li>
</ul>
</li>
</ul>
Некоторые пункты меню верхнего уровня являются ссылками a
, а некоторые являются span
, содержащие вложенный список со ссылками.
Меню подключаю так:
<?php
$args = array(
'menu' => 'header-menu',
'menu_class' => 'nav navbar-nav nav__top-menu',
'container' => 'ul',
);
wp_nav_menu($args);
?>
Но по умолчанию все пункты меню выводятся ссылками а
.
Как сделать так, чтобы элемент списка li
с классом dropdown
содержал в себе не ссылку, а такой спан: <span class="nav-link" id="thisIsUs" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" >...</span>
.
Необходима именно такая структура html
, т.к. от этого зависит работа библиотеки для responsive menu.