WordPress の管理画面に独自の設定ページを作る方法になかなか苦戦したのですが、やり方さえわかれば簡単な事でした。独自の設定ページで設定した内容をサイト上で使う事も可能です。
独自の設定ページを作る理由
ブログサイトをやる上で独自の設定ページは必要ないかもしれません。また php の知識があって自分で触れるなら尚更必要ありません。
必要になるのは自分で更新しないサイトを作ってあげる場合です。php の知識がない人がソースを開いて編集するのはハードルが高すぎます。
その為、独自の設定ページを作れば誰でも簡単に内容を編集できるわけです。
独自の設定画面の作り方
独自の設定画面を作るには、テーマ編集で function.php を編集します。
メニュー追加
add_action( 'admin_menu', 'my_setting_page' );
function my_setting_page() {
add_menu_page('ページの名前', 'メニューの名前', '権限', 'メニューの識別子', '呼び出す関数', 'アイコン', 順番);
}
まずはこれだけで管理画面に独自の項目を追加できます。
- ページの名前：タイトルタグに表示されるページの名前
- メニューの名前：管理画面のメニューに表示される名前
- 権限：管理画面で設定を行うには「manage_options」にする
- メニューの識別子：php ソース上でメニューを識別する名前
- 呼び出す関数：内容を表示する関数
- アイコン：メニューのアイコンを指定
- 順番：管理画面のメニューに表示する順番
デフォルトで存在するメニューの項目にも順番となる数字が割り当てられています。空いている数字に独自の設定メニューを追加していけます。
- 2 - ダッシュボード
- 5 - 投稿
- 10 - メディア
- 15 - リンク
- 20 - 固定ページ
- 25 - コメント
- 60 - 外観（テーマ）
- 65 - プラグイン
- 70 - ユーザー
- 75 - ツール
- 80 - 設定
それらを踏まえるとこのようなソースになります。
add_menu_page('独自設定', '独自設定', 'manage_options', 'my_setting', 'add_my_setting', 'dashicons-welcome-learn-more', 3);
呼び出す関数名や識別子はアルファベットで何でも構いません。
設定ページの中身
設定ページの中身は前述の呼び出す関数から行います。同様にテーマ編集の function.php の中に記載します。
function add_my_setting() {
include TEMPLATEPATH ."/my-setting.php";
}
function.php の中に書くとダラダラと長くなって見づらくなるので、外部の php を読み込むと見やすくなります。
TEMPLATEPATH は WordPress のテーマのパスが格納されている定数です。
以下は include で読み込んだ php ファイルです。
add_option('num1');
if ($_REQUEST['num1']) update_option('num1', $_REQUEST['num1']);
echo '<form method="post" action="admin.php?page=my_setting">';
echo '設定：<input type="text" name="num1" value="'. get_option('num1') .'" />';
submit_button();
echo '</form>';
ただテキストボックス1個と保存ボタンがあるだけのシンプルなものです。
add_option で num1 というサイトで使えるオプション（変数）を追加します。
2行目は num1 に更新があったら変数を更新しています。
3行目の action 内には、独自で作った設定画面の URL を入力します。page = の後は、前述のメニューの識別子です。
4行目は現在の設定値を最初から表示しておくために value の中に get_option で num1 を表示しています。
submit_button で保存ボタンを表示しています。
変数の利用
テーマの中で独自の設定画面で設定した内容を使うには、以下のようにします。
echo get_option('num1');
これだけでサイト上に表示できます。
保存後に設定を保存しましたという表示を出したい
現在のままだと保存ボタンを押しても、何も変化が起きぬまま保存されるだけです。どうせなら「保存しました」など通知してほしいですよね。
そんな時にはこれを追加します。
if(isset($_POST['num1'])){
echo '<div id="settings_updated" class="updated notice is-dismissible"><p><strong>設定を保存しました。</strong></p></div>';
}
更新ボタンを押すと POST メソッドで設定値を通信します。独自の設定ページを開いた時点では $_POST['num1'] には何も入っていません。
isset は変数の中身が存在しているかを判定します。更新ボタンを押した時だけ $_POST['num1'] の中身が存在する事になりますから、更新ボタンを押した時に「設定を保存しました。」が表示される仕組みです。