ワードプレスでwp-bootstrap-navwalkerをカスタマイズするには

Question

wp-bootstrap-navwalkerを使用してナビゲーションをカスタマイズしようとしています。ここ

は、私は完全に正常に動作している

wp_nav_menu(array(
    'menu'    => 'primary', 
    'theme_location' => 'primary', 
    'depth'    => 2, 
    'container'   => 'div', 
    'container_class' => 'collapse navbar-collapse', 
    'menu_class'  => 'nav navbar-nav navbar-right', 
    'fallback_cb'  => 'wp_bootstrap_navwalker::fallback', 
    'walker'   => new wp_bootstrap_navwalker()) 
); 

それをダイナミックにするために、このWP-ブートストラップ・navwalkerを使用しています私の現在の静的コード

<div class="collapse navbar-collapse"> 
    <ul class="navbar-nav nav navbar-right"> 
    <li><a class="menu" href="index-2.html">home</a></li> 
    <li><a class="menu" href="#">travel</a></li> 
    <li><a class="menu" href="#">lifestyle</a></li> 
    <li><a class="menu" href="about.html">about me</a></li> 
    <li><a class="last-menu" href="contact.html">contact</a></li> 
</ul> 
</div> 

の一例です。今私は問題がある、私は<a class="menu">home</a>の中にmenuクラスを持っています。そのデータが動的に来る場合、どうすればクラスを私のアンカータグの中に入れることができますか？これをカスタマイズできる方法はありますかwp_nav_menu(array());？

Answer 1

'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',にwp_nav_menu(array())を追加すると、カスタムナビアイテムと通常のリンクアイテム用の特別なクラスが作成されます。その後、それらをCSSからターゲティングすることができます。 お役立ちリンク：wp_nav_items css

そうしないと、変更する必要があります。wp_bootstrap_navwalker

Answer 2

私はこのコード

<header> 
     <nav class="navbar navbar-expand-md navbar-dark bg-dark mb-4"> 
    <a class="navbar-brand" href="#">Top navbar</a> 
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> 
    <span class="navbar-toggler-icon"></span> 
    </button> 
    <div class="collapse navbar-collapse" id="navbarCollapse"> 
    <ul class="navbar-nav mr-auto"> 
     <li class="nav-item active"> 
     <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link" href="#">Link</a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link disabled" href="#">Disabled</a> 
     </li> 
    </ul> 

    </div> 

使用していると私はそれダイナミック

<?php 
    wp_nav_menu(array(
      'menu'    => 'top', 
      'theme_location' => 'primary', 
      'depth'    => 2, 
      'container'   => 'div', 
      'container_class' => 'collapse navbar-collapse', 
      'container_id'  => 'navbarCollapse', 
      'menu_class'  => 'navbar-nav mr-auto', 
      'fallback_cb'  => 'WP_Bootstrap_Navwalker::fallback', 
      'walker'   => new WP_Bootstrap_Navwalker()) 
     ); 

    ?> 

作るために、このWP-ブートストラップ・navwalkerを使用

ただし、getbootstrapに表示されている例では表示されませんでした