WordPressのカスタムメニューを複数表示する

WordPressのカスタムメニュー機能で作ったメニューを複数箇所で表示する設定方法です。例えば、ヘッダーとフッターでカスタムメニューを設置する事ができます。

function.phpに下記のように記入します。

register_nav_menus( array(
    'head_navi' => 'ヘッダーナビ',
    'foot_navi' => 'フッターナビ',
));

‘head_navi’ => ‘ヘッダーナビ’, ’foot_navi’ => ‘フッターナビ’,
の部分でダッシュボードの”テーマの場所”の箇所の名前を設定します。
ここを設定するとダッシュボードへ下のように名前が表示されてそれぞれ場所を設定できるようになります。
ダッシュボードの”テーマの場所”の箇所の名前を設定

次にそれぞれの表示したい場所へ下記のように、wp_nav_menu()へ’theme_location’の値(カスタムメニューの名前)を入れて記入します。

//ヘッダーへ記入
<?php wp_nav_menu(array(
  'theme_location'  => 'head_navi',
)); ?>
//フッターへ記入
<?php wp_nav_menu(array(
  'theme_location'  => 'foot_navi',
)); ?>

あとはそれぞれのメニュー内容をダッシュボードで設定します。

Related Article

4 Comments & Tracbacks

  • トリケン 2014-04-18 11:20 AM

    はじめまして。
    質問、いいでしょうか?
    フッターメニューのカレントが正しくかえってこなくて困っています。
    思い当たるふしなどありましたら教えていただけないでしょうか。
    別のテンプレートを使っているページを表示したときにホームがカレントになるようなのです。
    グローバルナビは正しいのですが、試しにフッターに入れてみると、やっぱりおかしい結果がかえります。
    ヒントなどいただけると、ありがたいです。
    よろしくお願いします。

    Reply

    • saori 2014-04-18 1:58 PM

      トリケン さま

      はじめまして。
      通常なら複数設置した場合でもカレントページにカレントのクラスがつくと思います。

      > 別のテンプレートを使っているページを表示したときにホームがカレントになるようなのです。
      そのテンプレートに wp_nav_menu が書かれていないとかでしょうかね…??

      もしくは filterフックで何か加工されているとか??
      今思い浮かぶのはこのくらいでしょうか…。

      あまりお力になれずすみません。よろしくお願いします。

      Reply

    • saori 2014-04-18 2:24 PM

      たびたびすみません。もう一つ思い出しました。
      以前カテゴリに関する機能が上手く動かなくなった事があって、そのときはWP本体をインストールし直すことで治りました。(wp-contentフォルダ confing.php 以外を上書きアップロードしました)
      通常の機能が上手く動かないときはWP本体の可能性もあるかもですね。あとはプラグインとのなにかとか…。

      Reply

  • ウララ 2015-04-03 9:30 AM

    WPは、時々機能が上手く動かないことがありますよね。アップデートしても前のものが表示されたり。ものすごく困ると同時に腹が立ちますよね。しかしアドバイスに従って、WPそのものをインストールし直したら、あらなんとちゃんと動いてくれているではないですか!!Reinstall、なるほどでした。ありがとうございます!

    Reply

Leave a Comment

Emailは公開されません。*は必須項目です。


*


Categorys

Tags

CSS3 ダッシュボード ヘッダー トラブル コードサンプル コンテンツ スライドショー jQueryプラグイン php 引っ越し 素材 お知らせ JavaScript Facebook CSS カテゴリー 投稿タイプ IE HTML5 Shareボタン seo レスポンシブ Photoshop タクソノミー ナビゲーション カスタムメニュー Git Macアプリ サイドバー WPセキュリティ SVG iTunes PHPリファレンス API WP使い方 query_posts データベース get_posts() 条件分岐 コメント function RSS スマートフォン Sass/Compass さくらVPS