WordPressには管理画面から任意の場所にメニューを追加することができる、カスタムメニューという機能があります。
Contents
カスタムメニューを使用する方法
カスタムメニューを使用するには、functions.phpに以下を記述して「有効化」させる必要があります。
functions.php
function register_my_menu() {
register_nav_menus( array( // 複数のナビゲーションメニューを登録する関数
'header-nav' => 'ヘッダーナビ',
'footer-nav' => 'フッターナビ,
));
}
add_action( 'after_setup_theme', 'register_my_menu' );カスタムメニューを有効化されると管理画面の「外観」に「メニュー」という項目が追加され、カスタムメニューが使えるようになります。
「header-nav」という名前で登録した、カスタムメニューを表示したい場合は、任意の場所に下記のように記述します。
ここでは、header.php内のグローバルナビを表示させたい場所に、追加します。
// メニューを表示したい場所に記述します
<?php
wp_nav_menu( array(
'theme_location' => 'main-menu'
) );
?>カスタムメニューで使用できるパラメータ
先に記述指定た、カスタムメニューを表示する位置を指定するtheme_location以外にも下記のパラメータを使用して、カスタムメニューを囲う要素に任意のIDやクラス名を指定することができます。
<?php wp_nav_menu( array(
'menu' => '',
'menu_class' => 'menu_class', // メニューを構成するul要素につけるクラス名
'menu_id' => 'menu_id', // メニュを構成するul要素につけるID名
'container' => 'nav', // ulを囲う要素を指定。無しの場合にはfalseを指定
'container_class' => 'container_class', // コンテナに適用するクラス名
'container_id' => 'container_id', // コンテナに適用するID名
'fallback_cb' => 'wp_page_menu', // メニューが存在しない場合にコールバック関数を呼び出す
'before' => '[before]', // リンクの前に挿入するテキスト
'after' => '[after]', // リンクの後に挿入するテキスト
'link_before' => '[link_before]', // リンク内の前に挿入するテキスト
'link_after' => '[link_after]', // リンク内の後に挿入するテキスト
'echo' => true, // メニューをHTML出力する（true）かPHPの値で返す（false）か
'depth' => 1, // 何階層まで表示するか。0は全階層
'walker' => '', // カスタムウォーカーを使用する場合
'theme_location' => '', // メニューの位置を指定
'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>', // %1$sには'menu_id'のパラメータ展開、%2$sには'menu_class'のパラメータ展開、%3$sはリストの項目が値として展開されます
)); ?>