• 解決済 shinobazu

    (@shinobazu)


    メニューをオンマウスすればサブメニューが表示されるのが通常ですが、その時に親の名前を子メニューの上に表示させたいと思っています。

    コードで書くとこのような感じです。

    <ul class="main-nav">
    	<li>
    		<a href="#">リンク1</a>
    		<ul class="sub-menu">
    			<h2>これは「リンク1」のサブメニューです</h2>
    			<li>リンク1-1</li>
    			<li>リンク1-2</li>
    		</ul>
    	</li>
    	<li><a href="#">リンク2</a></li>
    	<li><a href="#">リンク3</a></li>
    </ul>

    h2で囲ってある部分がそれです。

    wp-includes/nav-menu-template.phpを編集して、h2タグを追加する所まではできたのですが、これがリンク1でもリンク2でもそれぞれのサブメニューの親の名前が出るようにしたいのですが、なかなか上手くいきません。

    ちなみにnav-menu-template.phpで編集したところはこのようにしてあります。
    *47行目あたり

    public function start_lvl( &$output, $depth = 0, $args = array() ) {
    		$indent = str_repeat("\t", $depth);
    		$output .= "\n$indent<ul class=\"sub-menu\"><h2></h2>\n";
    	}

    どなたかご教示いただければと思います。よろしくお願いいたします。

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • モデレーター gatespace

    (@gatespace)

    似たような質問があります。
    グローバルナビのsub-menuにdivタグを入れる方法
    https://ja.forums.wordpress.org/topic/148627?replies=4

    基本的に、コアファイルと呼ばれる wp-includes 以下のファイルを書き換えないほうが良いです。WordPressアップデート時に「なかったこと」になります。

    http://wpdocs.sourceforge.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%82%BF%E3%82%B0/wp_nav_menu

    「メニュー項目用の親クラスを追加する方法」参考にして、予め <h2>これは「リンク1」のサブメニューです</h2> という、部分をソースとしてかならず出るようにしておいて、あとは js なり css なりで「メニューをオンマウスすればサブメニューが表示される」というのを実装すればいいかと。

    トピック投稿者 shinobazu

    (@shinobazu)

    >gatespace様

    ご回答ありがとうございます。
    教えていただいた方法を用いて少し工夫してやってみたりしましたが、やはり上手くいきませんでした。すいません。

    上記の例コードではリンク1にしかサブメニューがありませんが、これがリンク2にも3にもサブメニューがあり、それぞれリンク2をオンマウスしたら「これはリンク2のサブメニューです」と表示されればいいのですが。
    何かh2の間に親の名前を呼び出すものがあればいいのですが・・・

    テーマの functions.php に以下をコピペでいけるんじゃないかしら

    add_filter( 'wp_nav_menu', function( $nav_menu, $args ) {
      return preg_replace(
        '@<a ([^>]+)>(.+)</a>\n+\t*<ul class="sub-menu">@m',
        '<a $1>$2</a><ul class="sub-menu"><li>'.
        '<h2>$2</h2>'.
        '</li>',
        $nav_menu
      );
    }, 10, 2 );

    トピック投稿者 shinobazu

    (@shinobazu)

    >Pimp My Site様

    ご回答ありがとうございます。
    こちらの環境で確認してみたところ、私がこうしたいなと思っていた通りに表示されていました。

    WP、PHPはまだまだ初心者なもので、自力で頑張ってみたものの行き詰っていたので本当に助かりました。
    ありがとうございました。

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • トピック「submenu表示時に親メニューの名前を追加、表示するには」には新たに返信することはできません。