ナビゲーションメニュー (カスタムメニュー)を設置しよう

ヘッダーメニューやフッターメニューを管理画面から編集できるようにするためにはregister_nav_menus()をfunctions.phpに記載してテンプレートにwp_nav_menu()を記述することで表示できます。

1. カスタムメニューを登録

まずは管理画面で設定できるようにfunctions.phpにコードを記述します。

ファイル functions.php
関数 register_nav_menu()

コード(複数登録)

register_nav_menus( array(
  'header-navigation' => 'ヘッダーメニュー',    // 1. 登録名、2. 説明(管理画面に表示)
  'footer-navigation'  => 'フッターメニュー',
) );

参考)関数リファレンス/register nav menu – WordPress Codex 日本語版

2. カスタムメニューを表示

header.phpなどのテンプレートにカスタムメニューを表示できるようにコードを記述します。

コード

<?php
  wp_nav_menu( array(
    'theme_location' => 'header-navigation'    // 登録名を指定
  ) );
?>

参考)テンプレートタグ/wp nav menu – WordPress Codex 日本語版

補足 メニューの登録がなかった場合にメニューを表示しない

wp_nav_menu()をtheme_locationを指定して実行している場合、デフォルトで固定ページのリストが表示される仕様になっています。メニューを非表示にする場合にはコードを追記する必要があります。

コード

ファイル header.php など

<?php	 	 
if(my_get_nav_menu_object_by_locations('header-navigation')){
    wp_nav_menu( array(
        'theme_location ' => 'header-navigation',
    ) );
}
?>	 	 

ファイル functions.php

// 指定のメニューのリンク個数を取得	 	 
function my_get_nav_menu_object_by_locations( $locations = '' ) {
    if($locations){
        $locations = $locations;
        $nav_menu_obj = get_nav_menu_locations();
        $menu_id = $nav_menu_obj[ $locations ];
        $menu_obj = wp_get_nav_menu_object($menu_id);
        return $menu_obj->count;
    }
} 	 

Wodpress デザイナーの私的メモ帳

条件分岐

投稿関連

固定ページ関連

カテゴリー関連

タクソノミー、ターム関連

プラグイン

その他

MW WP Form

  • このエントリーをはてなブックマークに追加

プロフィール

kura

WEBで食べていきたいデザイナーです。 趣味でアプリ開発(ペア、デザイン担当)やNuxt.jsやらをいじってますが、やばいな~と感じつつネットの波に取り残されないようにワカッタこと、キヅイタことをカキカキします。