2026年5月20日

WordPressのカスタムメニューを管理画面に追加する方法

ログイン・アクセス

はじめに

プラグインや機能拡張を実装する際、WordPressの管理画面に専用メニューを追加したい場合があります。add_menu_page と add_submenu_page を使って独自の管理ページを作成する方法を解説します。

解決手順

ステップ1：トップレベルメニューを追加する

// functions.php またはプラグインファイル
add_action('admin_menu', function() {
    add_menu_page(
        'サイト設定',          // ページタイトル（<title>に入る）
        'サイト設定',          // メニューラベル
        'manage_options',      // 必要なケーパビリティ
        'my-site-settings',    // メニューslug（一意のID）
        'render_site_settings_page', // コールバック関数
        'dashicons-admin-settings',  // アイコン（Dashiconsクラス名またはSVG data URI）
        80                     // 位置（数値が大きいほど下）
    );
});

function render_site_settings_page(): void {
    if (!current_user_can('manage_options')) {
        wp_die('権限がありません');
    }
    ?>
    <div class="wrap">
        <h1><?php echo esc_html(get_admin_page_title()); ?></h1>
        <p>ここにコンテンツを追加します。</p>
    </div>
    <?php
}

ステップ2：サブメニューを追加する

add_action('admin_menu', function() {
    // 親メニューを追加
    add_menu_page('マイアプリ', 'マイアプリ', 'edit_posts', 'my-app', 'render_my_app', 'dashicons-smiley', 25);

    // サブメニューを追加（親のslugを第1引数に指定）
    add_submenu_page('my-app', 'ダッシュボード', 'ダッシュボード', 'edit_posts',  'my-app',            'render_my_app');
    add_submenu_page('my-app', 'レポート',       'レポート',       'edit_posts',  'my-app-reports',    'render_my_app_reports');
    add_submenu_page('my-app', '詳細設定',       '詳細設定',       'manage_options', 'my-app-settings', 'render_my_app_settings');
});

ステップ3：既存メニューにサブメニューを追加する

add_action('admin_menu', function() {
    // 投稿メニュー（edit.php）の配下に追加
    add_submenu_page('edit.php', 'インポート', 'インポート', 'edit_posts', 'my-import', 'render_import_page');

    // ツールメニュー（tools.php）の配下に追加
    add_submenu_page('tools.php', 'データエクスポート', 'データエクスポート', 'manage_options', 'my-export', 'render_export_page');

    // 設定メニュー（options-general.php）の配下に追加
    add_submenu_page('options-general.php', 'API設定', 'API設定', 'manage_options', 'my-api-settings', 'render_api_settings');
});

ステップ4：メニューページでの設定保存

function render_my_app_settings(): void {
    if (!current_user_can('manage_options')) {
        wp_die('権限がありません');
    }

    // フォーム送信処理
    if ($_SERVER['REQUEST_METHOD'] === 'POST') {
        check_admin_referer('my_app_settings_nonce');
        update_option('my_app_api_key', sanitize_text_field($_POST['api_key'] ?? ''));
        echo '<div class="notice notice-success"><p>設定を保存しました。</p></div>';
    }

    $api_key = get_option('my_app_api_key', '');
    ?>
    <div class="wrap">
        <h1>API設定</h1>
        <form method="post">
            <?php wp_nonce_field('my_app_settings_nonce'); ?>
            <table class="form-table">
            <tr>
                <th>APIキー</th>
                <td><input type="text" name="api_key" value="<?php echo esc_attr($api_key); ?>" class="regular-text"></td>
            </tr>
            </table>
            <?php submit_button(); ?>
        </form>
    </div>
    <?php
}

注意事項

add_menu_page の第3引数（ケーパビリティ）は必ずチェックしてください。コールバック内でも current_user_can() で再確認が必要です
フォーム送信時は必ず check_admin_referer() でnonceを検証してください
メニューslugは他のプラグインと重複しないよう、プレフィックスを付けてください

まとめ

管理画面メニューは admin_menu アクションフック内で add_menu_page と add_submenu_page を使って追加します。ページのコールバック関数内では権限チェックとnonce検証を忘れずに実装してください。

Post Views: 6