WordPress自作テーマにカスタマイズメニューを追加する方法【プラグイン不要】

WordPressのテーマを自作で作成している。

WordPress管理画面にあるメニュー項目が表示されない。

メニュー項目を表示し、管理画面上でカスタマイズされたメニューをサイトに表示・出力したい。

本記事ではこのような悩みを解決します。

functions.phpにコードを記述

<?php 
//メニュー有効
function register_my_menus() { 
  register_nav_menus( array(
    'header' => 'ヘッダー',//表示する位置
    'footer' => 'フッター',//表示する位置
    'side' => 'サイド',//表示する位置
  ) );
}
add_action( 'after_setup_theme', 'register_my_menus' );

WordPressテーマがデフォルトだと管理画面にメニュー項目は表示されません。

上記コードをfunctions.phpに記述しましょう。

register_nav_menus()関数内のパラメータにメニューを設置したい箇所を複数指定します。

パラーメータの記述方法は以下の通りです。

‘任意のスラッグ名英数字’ => ‘配置名’,

メニューを配置したい箇所のテンプレートにコードを記述

  <nav>
    <?php
    wp_nav_menu(array(
      'theme_location' => 'header'
    ));
    ?>
  </nav>

メニューを配置したい箇所のphpテンプレートファイルに上記コードを記述します。

パラメータでtheme_locationを指定。

値に前章で指定した配置箇所のスラッグ名を記述します。

以上で設置完了です。

前章で複数配置箇所を指定してた場合は同じように任意のテンプレートファイルにコードを記述、パラメータにスラッグを指定しましょう。

管理画面でメニューをカスタマイズ

前章までの行程を行なったら、WP管理画面の外観サブ項目に【メニュー】が追加されてるのでクリックします。

メニューをカスタマイズしましょう。

カスタマイズしたら、メニュー位置にfunction.phpに記述したパラメータの配置位置を指定し保存します。

以上で完成です。

まとめ

自作でテーマを作ると、好きなようにメニューの配置位置を決めれるのでとても便利です。

ぜひ参考にしてください。

以上で解説を終わります。

Ads

関連記事

WordPress プログラミング

【wordpress】全テンプレートページで使用可能なグローバル変数を定義する方法【簡単】

2022.02.23
91
WordPress プログラミング

ワードプレスのエディタで自動整形機能を無効・停止する方法

2020.05.20
78
WordPress プログラミング

【プラグイン不要】WordPress・PHPサイトでCSS・JS・画像ファイルのキャッシュを常に自動削除する方法【簡単】

2022.04.09
60
WordPress プログラミング

【簡単】投稿用カテゴリーの初期設定(未分類)を変更する方法

2022.03.31
17