• 解決済 fri 231

    (@3rdl81)


    いつもお世話になってます。
    以下のようなグローバルメニューを作る時のご相談です。

    親ページ
     ∟子ページ1
     ∟子ページ2
     ∟子ページ3

    ここで、親ページは固定ページでも、カテゴリーでも、カスタムリンクでもなく、ただの文字にしたいんです。
    親ページをクリックした時に、隠れていた子ページがずらっと表示されるような動きにしたいので、親ページにURLは不要なのです。

    外観 > メニュー から作るとなると、どうしても親項目にも何かしらURLを設定しなければ、入れ子構造が作れないのかなと思ったのですが・・・
    このような時どうしたらいいでしょうか?
    苦肉の策として、親ページをカスタムリンクで作ってURLに # を指定してみたりしましたが、ちょっとスクロールしてからクリックすると、ページトップに画面が移動したりして、これは最善ではない感じがしました。

    もちろんテンプレートで作れば一発なのですが・・・
    テンプレートを修正できない他のユーザーにも、自由にメニュー構造を編集してもらいたいです。

    何かいい方法があればアドバイスいただきたいです。
    よろしくお願いします。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • hide

    (@hideokamoto)

    JavaScriptが書ける様子であればこういうやり方もあるのですが、
    管理画面からとなるといい感じのプラグインを探し当てるくらいでしょうか・・・
    http://qiita.com/mwtonbel/items/f3c6e2373c348ea74b19

    実装内容を見るに親ページをクリックした際に発動するJSがある様子ですので、
    そのあたりにevent.preventDefault();を設定するとかですかね。

    ikaring

    (@ikaring)

    nobita

    (@nobita)

    こんにちは、

    カスタムリンクで、URLに、javascript:みたいに、怪しげな値を入力すると、href属性がカットされたリンクが出来るみたいなんで、
    (作成後空のURL入力欄がメニューの中にできるようです)ので、そういうのでどうでしょうか?

    https://reference.hyper-text.org/html5/element/a/

    トピック投稿者 fri 231

    (@3rdl81)

    Okamoto Hidetaka 様

    ありがとうございます。
    使い方があっているかは分かりませんが、以下のような記述をしてみたところ、希望通りの動きになりました!

    jQuery(function ($) {
            $('.menu-item-has-children').click(function () {
    		return false;
            });
            $('.sub-menu li').click(function () {
    		event.stopPropagation();
            });
    });

    removeChildだけ思いついたのですが、これだとaタグではさまれたメニュー名まで消えてしまって、私はそこでJavaScriptでの策が尽きてしまっていました。
    ありがとうございました。

    トピック投稿者 fri 231

    (@3rdl81)

    ikaring 様

    カスタムウォーカークラス自体を初めて知りました。
    以下のサイトを参考にfunctions.phpに書いてみたところ、うまくいきました!

    http://blog.it.churaumi.tv/wordpress-walker-nav-menu

    ありがとうございます。

    トピック投稿者 fri 231

    (@3rdl81)

    nobita 様

    javascript:

    で試してみました。おっしゃるとおり、リンクが効かなくなっていました!
    とってもお手軽です。
    ありがとうございます。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「親項目は文字だけでURLは不要な時のメニューの作り方(外観>メニュー)」には新たに返信することはできません。