web-dev-qa-db-ja.com

wp_nav_menu関数にカスタムHTMLコードを追加する

ブートメニューのモーダルボックスをナビゲーションメニューのリンクに追加できるように、WordPressのwp_nav_menu関数にカスタムのhtmlコードを実装したいのですが、どうすればよいかわかりません。 https://stackoverflow.com/questions/12250866/how-to-add-custom-html-to-wp-nav-menu という投稿は、ウォーカーを拡張してその方法を説明するための方法です。クラス。

私の目標は、最後にカスタムのhtmlコードを作成するためにwalkerクラスの助けを借りて以下のマークアップを作成することです。

<div class="menu-primary-navigation-container">
    <ul id="navigation" class="clearfix">
        <li id="menu-item-275" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-273 current_page_item menu-item-275">
            <a href="http://sandpit.jonathanbeech.co.uk/">Home</a>
        </li>
        <li id="menu-item-17" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-17">
            <a href="http://sandpit.jonathanbeech.co.uk/about/">About</a>
        </li>
        <li id="menu-item-191" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-191">
            <a href="http://sandpit.jonathanbeech.co.uk/portfolio-two/">Portfolio</a>
        </li>
        <li id="menu-item-269" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-269">
            <a href="http://sandpit.jonathanbeech.co.uk/articles/">Articles</a>
        </li>
        <li>
            <a href="#myModal" role="button" data-toggle="modal">Contact</a>
        </li>
    </ul>
</div>

私のphpのスキルは良くないので、最後のリスト項目のコードを達成するためにstart_elとend_elのコードを修正する方法を理解するのが困難です。

助言がありますか？

class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
    function start_el ( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
        // Copy all the start_el code from source, and modify
    }

    function end_el( &$output, $item, $depth = 0, $args = array() ) {
        // Copy all the end_el code from source, and modify
    }
}
menustwitter-bootstrap
5
Jonathan Beech

その最後のリスト項目を追加するために、あなたはカスタムWalkerを必要としません。 あなたがそれをタックできるようにするフックがあります 。

function add_last_nav_item($items) {
  return $items .= '<li><a href="#myModal" role="button" data-toggle="modal">Contact</a></li>';
}
add_filter('wp_nav_menu_items','add_last_nav_item');

編集する必要があるのはstart_elとend_elではありません。それらは個々のリストアイテムを生成します。他のアイテムを追加する場所ではありません。新しいアイテムを追加できる場所に移動するには、おそらくWalker_Nav_Menuの親の Walker クラスに移動する必要があると思いますが、アイテムを追加するだけの価値はありません。

10
s_ha_dum