ブートストラップナビスタイルをワードプレスに統合する方法

Question

私のスタイルをワードプレスに統合する際に問題があります。私はワードプレス自体の中でこれを行うための選択肢があることを知っている、それは動作しますが、navbarに接続されていないようです。私がしたいのは、各ナビゲーションバーのリンクに「すべりミドルアウト」のクラスを追加することだけです。

<div class="collapse navbar-collapse" id="mainNavbar"><!-- NAVBAR COLLAPSE -->   

        <div class="site-nav"><!-- SITE NAV --> 

         <?php 

          $args = array(

           'theme_location' => 'primary' 

          ); 

         ?> 

         <?php wp_nav_menu($args); ?> 

        </div><!-- ./SITE NAV --> 

       </div><!-- NAVBAR COLLAPSE --> 

各リンクを個別に指定する必要がありますか？、つまりテーマ内では実用的ではないと思いますか？

Answer 1

あなたは完全なリストについては、ここを参照してください、メニューのマークアップへの情報のかなりの数のビットを追加することができます。https://developer.wordpress.org/reference/functions/wp_nav_menu/

しかし、実際の<a>タグにクラスを追加するために、あなたはナビゲーションウォーカーを作成する必要がありますこれはかなり複雑です。 https://codex.wordpress.org/Class_Reference/Walker

そして、あなたの希望クラスを追加する必要があり、非常に単純な例：

はここでWordpressの中に歩行者に関するいくつかの情報です。

<?php 
class Walker_Menu extends Walker { 

    // Tell Walker where to inherit it's parent and id values 
    var $db_fields = array(
     'parent' => 'menu_item_parent', 
     'id'  => 'db_id' 
    ); 

    /** 
    * At the start of each element, output a <li> and <a> tag structure. 
    * 
    * Note: Menu objects include url and title properties, so we will use those. 
    */ 
    function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) { 
     $output .= sprintf("\n<li><a href='%s'%s>%s</a></li>\n", 
      $item->url, 
      ($item->object_id === get_the_ID()) ? ' class="sliding-middle-out current"' : ' class="sliding-middle-out"', 
      $item->title 
     ); 
    } 

}?> 

してからメニューコールにウォーカークラスを追加します：あなたは、あなたのテーマののfunctions.phpファイルでこれを配置する必要があります

<?php 
$args = array(
    'theme_location' => 'primary', 
    'walker' => new Walker_Menu 
); 
wp_nav_menu($args); 
?>