【WordPress】管理画面に独自の設定画面を追加する方法｜add_menu_pageの基本と応用

WordPressでは、管理画面に独自の設定ページを追加することで、オリジナルのプラグインやテーマ設定をユーザーが簡単に変更できるようにすることができます。この記事では、add_menu_pageを使った基本的な手順から、設定値の保存やフォームの設計まで、実践的な実装方法を紹介します。

add_menu_pageとは？

add_menu_page()は、WordPressの管理メニューに新しいトップレベルのメニュー項目を追加するための関数です。これにより、独自の設定ページを管理画面に統合することができます。

構文は以下の通りです：

add_menu_page(
  string $page_title,
  string $menu_title,
  string $capability,
  string $menu_slug,
  callable $function,
  string $icon_url = '',
  int $position = null
);

基本的な設定画面を追加するサンプルコード

以下のコードをfunctions.phpまたはプラグインファイルに記述することで、管理画面に「サイト設定」という独自ページを追加できます。

add_action('admin_menu', 'my_custom_settings_menu');
function my_custom_settings_menu() {
  add_menu_page(
    'サイト設定',
    'サイト設定',
    'manage_options',
    'my-site-settings',
    'my_site_settings_page',
    'dashicons-admin-generic',
    60
  );
}

function my_site_settings_page() {
  echo '<div class="wrap">';
  echo '<h1>サイト設定</h1>';
  echo '<form method="post" action="options.php">';
  settings_fields('my_settings_group');
  do_settings_sections('my-site-settings');
  submit_button();
  echo '</form>';
  echo '</div>';
}

設定項目を保存する処理

続いて、保存する項目の登録処理です。admin_initで設定項目を登録します。

add_action('admin_init', 'my_settings_init');
function my_settings_init() {
  register_setting('my_settings_group', 'my_option_text');

  add_settings_section(
    'my_settings_section',
    '基本設定',
    null,
    'my-site-settings'
  );

  add_settings_field(
    'my_option_text',
    'テキスト設定',
    'my_option_text_callback',
    'my-site-settings',
    'my_settings_section'
  );
}

function my_option_text_callback() {
  $value = get_option('my_option_text', '');
  echo '<input type="text" name="my_option_text" value="' . esc_attr($value) . '" />';
}

設定の読み込みと活用

設定した値は、以下のようにテンプレートや処理の中で呼び出して利用できます。

$text = get_option('my_option_text');
echo esc_html($text);

アイコンや表示位置をカスタマイズ

add_menu_pageの引数で、ダッシュボードアイコンの指定や、表示位置を自由に調整可能です。

• アイコン: dashicons-admin-site など
• 表示位置: 数字が小さいほど上に表示されます（例：60で「外観」の下）

まとめ

WordPress管理画面に独自の設定ページを追加することで、テーマやプラグインの利便性が大きく向上します。add_menu_pageを活用し、ユーザーが扱いやすいUIと安全な保存処理を実装することで、より洗練されたWordPress開発が可能になります。