it-swarm-ja.com

カスタムメニュー:カスタムホームリンクによる動的ハイライト表示の問題

私は現在wp_nav_menuを実装しています - 動的ハイライトのためにすべてがうまく保存されました。メニューコードは次のようになります(カスタムリンクであるhomeが選択されているとき)。

<div class="menu-header">
<ul class="menu" id="menu-main-nav">
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-126" id="menu-item-126"><a href="path.to.link">Home</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-122" id="menu-item-122"><a href="path.to.link">Information</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-123" id="menu-item-123"><a href="path.to.link">Contact</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-124" id="menu-item-124"><a href="path.to.link">About</a></li>
</ul>
</div>

Home以外のページ(これは「カスタムリンク」です)が選択されている場合、これは書き出されます。

<li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-65 current_page_item menu-item-122" id="menu-item-122"><a href="path.to.link">Information</a></li>

ご覧のとおり、これにはアクティブリンクの 'current-menu-item'が含まれており、カスタムリンクでは 'menu-item-type-custom menu-item-object-custom'としか表示されません。

だから私の質問は、WP3メニューのカスタムリンクの選択した項目スタイルを追加する方法はありますか?

1
toomanyairmiles

私はいくつかのjQueryでこれを達成しました:

$("#sidebar ul li").each(function () {
     if ($(this).find("a").attr("href") == window.location.href) {
         $(this).addClass("current-menu-item");
     }
});

(私のナビゲーションはid 'sidebar'のdivにあります、あなたは最初のセレクターを変更する必要があるでしょう)。

リンクのhrefが現在のURLと同じかどうかをチェックし、そうであれば "current-menu-item"を追加します。その後、.current-menu-styleクラスを使ってアクティブリンクをスタイルすることができます。

0
Shaun

より良い方法は、 "Home"ページをwp_page_menu() argsに追加して、 "Home"ページへのリンクを追加することです。

最初に、ホームリンクを表示するために、このフィルタをfunctions.phpに追加します。

function mytheme_filter_page_menu_args( $args ) {
    $args['show_home'] = true;
    return $args;
}
add_filter( 'wp_page_menu_args', 'mytheme_filter_page_menu_args' );

Dashboard -> Appearance -> Menusでは、 "Pages"メタボックスの下に "Home"ページへのリンクが表示されます。それを選択して、あなたのカスタムメニューに追加してください。

クレジットとスクリーンショットはこちら

0
Chip Bennett