web関連

wordpressで設定ページ(オプションページ)を作成した時のメモ

wordpressで設定ページ(オプションページ)を作成した時のメモ

wordpressでかゆいところに手が届くような管理ページが一つあるといいよねーという会話から設定ページを作った時のメモ

wordpressで設定ページを作る方法

functions.phpに書く

// 「管理メニュー」に追加
add_action( 'admin_menu', 'sample_theme_menu' );

function sample_theme_menu() {

// サブレベルメニューとして追加する場合(どっちかでいい)
  add_options_page( 'サンプルテーマオプションページ', 'テーマオプション', 'manage_options', 'theme_option', 'sample_theme_option' );
// トップレベルメニューとして追加する場合(どっちかでいい)
  add_menu_page( 'サンプルテーマオプションページ', 'テーマオプション', 'manage_options', 'theme_option', 'sample_theme_option', 'dashicons-welcome-learn-more' , 3 );

// ユーザーが管理画面にアクセス時に他のフックより先に実行
add_action( 'admin_init', 'register_mysettings' );
}

function register_mysettings() {
  //register our settings
  register_setting( 'option-settings-group', 'new_option_01' );
  register_setting( 'option-settings-group', 'new_option_02' );
  register_setting( 'option-settings-group', 'new_option_03' );
}

// ページに表示する内容エリア
function sample_theme_option() {
  // 権限を持っていなかった時にアクセスできないようにする
  if ( !current_user_can( 'manage_options' ) )  {
    wp_die( __( 'このページにアクセスする権限がありません。' ) );
  }
  // 以下よりページの中身
?>
<div class="wrap">
<h2>テーマオプションページ</h2>
<form method="post" action="options.php">
  <!-- 「settings_fields」を入れることで面倒な処理を行ってくれるらしい -->
  <?php settings_fields( 'option-settings-group' ); ?>
  <?php do_settings_sections( 'option-settings-group' ); ?>
  <table>
      <tr>
      <th>オプションテキスト01</th>
      <td><input type="text" name="new_option_01" value="<?php echo esc_attr( get_option('new_option_01') ); ?>" /></td>
      </tr>
      <tr>
      <th>オプションテキスト02</th>
      <td><input type="text" name="new_option_02" value="<?php echo esc_attr( get_option('new_option_02') ); ?>" /></td>
      </tr>
      <tr>
      <th>オプションテキスト03</th>
      <td><input type="text" name="new_option_03" value="<?php echo esc_attr( get_option('new_option_03') ); ?>" /></td>
      </tr>
  </table>
  <?php submit_button(); ?>
</form>
</div>

<?php 
}
見づらいけどコピペでいけると思う、以下は出力方法

出力方法

適当なテンプレートphpファイルに以下の記述を書くと出力されます。

<?php echo get_option('new_option_01'); ?>
<?php echo get_option('new_option_02'); ?>
<?php echo get_option('new_option_03'); ?>

とりあえずこれで動くと思う

少し前までアクションフックとか「?」出まくっていたけど少し理解できるようになってくると「wordpressってやればやるほど無料でいいんすか?」って思えてくるくらい色々できてすごいと思う(小並感)