WordPressのwp_nav_menu()で出力した親カテゴリーのリンクを無効にするjQueryスニペット

WordPressのログイン時のツールバー

WordPressのwp_nav_menu()で親カテゴリーと子カテゴリーを出力した後に、親カテゴリーのリンクだけを無効にするjQueryスニペットです。ドロップダウンメニューなどを作る際に、親カテゴリーのタイトルだけを使いたいという時があるかと思うので。CSSのpointer-eventsを使ってもリンクを無効にできるみたいなんですが、IEが対応していないっぽいのでJSを使うのがよさそう。

やり方

例えば、以下のようにナビゲーションを出力したとして。

<nav id="local-navi">
    <?php wp_nav_menu(array('menu' => 'local', 'container' => '')); ?>
</nav>

jQueryでこんな感じで書いてあげると親カテゴリーのリンクだけを無効にできます。

$(function() {
    $('#local-navi > ul > .menu-item > a[href^=http]').removeAttr("href");
});

他のやり方としては、親カテゴリーだけを手打ちして、その子カテゴリーだけをwp_list_categories()を使って表示させるのもよさそうです。この場合はchild_ofというパラメータを使う必要があります。

参考サイト

スポンサーリンク

スポンサーリンク

アクセスランキング

Tags

オススメ商品

Archives