こんにちわ、サイト管理者のわかっち (@wakatchi_tech) です。

WordPressで開発したサイトを運営していると、サイト独自の設定を保存したり、運用しながら設定を変更したいことがあります。

前回の記事では、WordPressのトップメニューの追加方法をご紹介いたしました。

WordPressに独自の管理メニューを追加する① トップメニューの追加

サイト独自の設定は、WordPressの管理メニューを独自に開発することをお勧めします。サイトの設定値（パラメーター）は、プラグインエディタなどを使いfunction.phpなどの…

わかっちウォッチ

この記事では、以前ご紹介したトップメニューに続き、WordPressのサブメニューの追加方法をご紹介します。

この記事は次のような方にお勧めです

  • WordPressのサイト開発者で、サイト全体の設定をWordPressの管理メニューで設定したい人
  • WordPressのテーマやプラグインの開発者
目次

WordPressに新規のサブメニューを追加する

WordPressの管理コンソールに追加した「トップメニューサンプル」という管理メニューに、「サブメニューサンプル」というサブメニューを追加します。サブメニューとは、トップメニューに含まれるページです。

下記のソースコードでWordPressにサブメニューを組み込めます。
function.phpやCode Snippetsプラグインなどを使ってそのままコピペしてみてください。

<?php
add_action(
	'admin_menu',
	function(){
        add_menu_page(
            '管理メニュータイトル' ,
            'トップメニューサンプル' ,
            'manage_options' ,
            'top_menu_sample' ,
            'render_topmenu_contents' ,
            'dashicons-calendar' ,
            0
        );
        
        add_submenu_page(
            'top_menu_sample' ,
            'サブメニュータイトル' ,
            'サブメニューサンプル' , 
            'manage_options' , 
            'sub_menu_sample' , 
            'render_submenu_contents'
        );
    }
);

function render_topmenu_contents() {
    ?>
        <div class="wrap">
            <h1>トップメニュー設定</h1>
            <p>Hello admin TOP menu !!</p>
        </div>
    <?php
}

function render_submenu_contents() {
    ?>
        <div class="wrap">
            <h1>サブメニュー設定</h1>
            <p>Hello admin SUB menu !!</p>
        </div>
    <?php
}

トップメニューにサブメニューを追加する

add_menu_page()で作成したトップメニューに、add_submenu_page()を使うことでサブメニューを組み込めます。

トップメニューを追加

管理メニューを追加するための関数を、add_action()でフック名admin_menuに追加します。

<?php
add_action(
    'admin_menu',
    function(){
        // your code
    }
);

管理メニューを追加する関数に、add_menu_page()に使って管理メニューを追加を実装します。

<?php
add_menu_page(
    '管理メニュータイトル' , 
    'トップメニューサンプル' , 
    'manage_options' , 
    'top_menu_sample' , 
    'render_topmenu_contents' , 
    'dashicons-calendar' ,
    0
);

function render_topmenu_contents() {
    ?>
        <div class="wrap">
            <h1>トップメニュー設定</h1>
            <p>Hello admin TOP menu !!</p>
        </div>
    <?php
}

add_menu_page()の引数や戻り値については、前回の記事をご参照ください。

WordPressに独自の管理メニューを追加する① トップメニューの追加

サイト独自の設定は、WordPressの管理メニューを独自に開発することをお勧めします。サイトの設定値（パラメーター）は、プラグインエディタなどを使いfunction.phpなどの…

わかっちウォッチ

サブメニューを追加

追加した管理メニューに、add_submenu_page()に使ってサブメニューを追加します。

<?php
add_submenu_page(
    'top_menu_sample' ,
    'サブメニュータイトル' ,
    'サブメニューサンプル' ,
    'manage_options' ,
    'sub_menu_sample' ,
    'render_submenu_contents'
);

function render_submenu_contents() {
    ?>
        <div class="wrap">
            <h1>サブメニュー設定</h1>
            <p>Hello admin SUB menu !!</p>
        </div>
    <?php
}

それではadd_submenu_page()の仕様を見てみましょう。

add_submenu_page()の引数

  • $parent_slug（必須）
    サブメニューを組み込む親スラッグ名。
  • $page_title（必須）
    サブメニューのページタイトル。
    本記事では、管理コンソールの左側に「テスト用トップメニュー」と表示されます。
  • $menu_title（必須）
    メニューのタイトルに使用するテキスト。
    本記事では、管理コンソールの左側に「テスト用トップメニュー」と表示されます。
  • $capability（必須）
    このメニューをユーザーに表示するために必要な権限。
    本記事では、管理メニューへのアクセスを許可するmanged_options権限を付与しています。
  • $menu_slug（必須）
    このメニューを参照するスラッグ名。
    このメニューページに対して一意である必要があります。また、使用できる文字は 小文字の英数字、ダッシュ、およびアンダースコア文字のみです。$parent_slugで指定した文字を指定すると、トップメニューのデフォルトがサブメニューの画面になります。
  • $function（任意）
    このページのコンテンツを出力するために呼び出される関数。
  • $hook_suffix
    この管理メニューで表示されるページの処理結果を受け取る関数の接頭子。

既存のトップメニューにサブメニューを追加する

add_submenu_page()の親スラッグ名を指定することで、WordPressに組み込まれている既存のトップメニューに、サブメニューを追加することができます。

下記のソースコードで既存のトップメニューにサブメニューを組み込めます。

<?php
add_action(
    'admin_menu',
    function(){
        add_submenu_page(
             'options-general.php', // 組み込みのトップメニュー
              'サブメニュータイトル' ,
              'サブメニューサンプル' , 
              'manage_options' , 
              'sub_menu_sample' ,
              'render_submenu_contents'
            ); 
    }
);
    
function render_submenu_contents() {
    ?>
        <div class="wrap">
            <h1>サブメニュー設定</h1>
            <p>Hello admin SUB menu !!</p>
        </div>
    <?php
}

管理メニューをクリックした時に表示される画面を、サブメニューすることができます。

親スラッグ名の種類

前述のソースコードは、元々組み込まれている設定メニューに組み込みました。

親スラッグを変えることで他の組み込みメニューにもサブメニューを追加できますので、ぜひ試してみてください。

ダッシュボードindex.php
投稿edit.php
メディアupload.php
固定ページedit.php?post_type=page
コメントedit-comments.php
テーマthemes.php
プラグインplugins.php
ユーザusers.php
ツールtools.php
設定options-general.php
親スラッグ名のリスト

まとめ

今回は、WordPressの管理コンソールにサブメニューを追加する方法をご紹介しました。トップメニューと同様にPHPによる実装が必要ですが、思ったよりも簡単だったかと思います。

次回からメニューページでの設定更新やデータのダウンロードなど、より実践的な方法を記載していきます。

わかっち

管理メニューを作る目的は、運用に関する設定の保存やサイト運営者によるデータの取得だからね。

本記事が少しでもお役に立てれば幸いです。

最後までお読みいただき、ありがとうございました！

カテゴリー
WordPress
タグ
前の記事
Ultimate Member 2.7.0がリリースされました
2023年10月18日
次の記事
WordPressに値を設定する独自の管理メニューを追加する
2023年10月25日