web-dev-qa-db-ja.com

<span> tag htmlの<a>タグをワードプレスメニューに変換する方法

ブートストラップのないメニューをワードプレスに変換しています。ドロップダウンがないので、ウォーカークラスを使用する必要はないと思います。 Google Chromeで調べると、ulタグクラスは正しいものですが、HTMLメニューでタグを表示すると、spanタグが付いていることがわかります。

<a href="home">
  <span>Home</span>
</a>

しかし、私のワードプレスのメニューはちょうどこんな感じです：

<a href="home">Home</a>

必要なスタイルはspanタグの中にあるように見えますが、現在のメニューコードでこれを行う方法がわかりませんか？

<div class="menu_wrapper">
    <nav id="menu">
            <?php wp_nav_menu(array(
                'menu_class' => 'menu menu-main',
                'container' => '',
                'theme_location' => 'main_menu'
            ));
            ?>
    </nav>
</div>

これはオリジナルのメニューです。

<div class="menu_wrapper">
    <nav id="menu">
        <ul id="menu-main-menu" class="menu menu-main">
            <li class="current-menu-item">
                <a href="index.html"><span>Home</span></a>
            </li>
            <li>
                <a href=""><span>item1</span></a>
            </li>
            <li>
                <a href=""><span>item2</span></a>
            </li>
            <li>
                <a href=""><span>item3</span></a>
            </li>
        </ul>
    </nav>
</div>
theme-developmentmenus
1
user8463989

link_beforeにはlink_afterおよびwp_nav_menu引数を使用する必要があります。それらをそれぞれ'<span>'および'</span>'に設定します。

wp_nav_menu( [
  'menu_class'     => 'menu menu-main',
  'container'      => '',
  'theme_location' => 'main_menu',
  'link_before'    => '<span>',
  'link_after'     => '</span>'
] );
4
Nathan Johnson