設定画面を持つ簡単なプラグインの作成 : WordPress

Pocket

WordPressのプラグイン作成に関するメモ。

作成するプラグインの機能

プラグインの設定画面(以下プラグインページ)で入力した値を管理画面のフッターに表示する。プラグインのメニューは管理メニューの[ 設定]メニューにサブメニューとして追加する。

プラグインの作成

Exampleプラグインのファイル構成

WordPressインストールディレクトリ
    |
    |-- wp-content
        |
        |-- plugins
            |
            |-- example
                |
                |-- example.php

ソースコード

<?php
/*
Plugin Name: Example
Version: 1.0
Plugin URI: http://www.example.com
Description: プラグインページに入力された値を管理画面のフッターに表示。
Author: Example
Author URI: http://www.example.com
*/
 
//--------------------------------------------------------------------------
//
//  管理画面>設定>Exampleプラグインページを追加
//
//--------------------------------------------------------------------------
 
// 管理メニューのアクションフック
add_action('admin_menu', 'admin_menu_example');
 
// アクションフックのコールバッック関数
function admin_menu_example () {
    // 設定メニュー下にサブメニューを追加:
    // 追記 2012.05.16
    // コメントにてcottonspaceさんからご指摘いただきました。manage_optionsはクオートで囲む必要があります。
    // 誤り add_options_page('サンプルプラグイン', 'サンプルプラグイン', manage_options, __FILE__, 'example');
    add_options_page('サンプルプラグイン', 'サンプルプラグイン', 'manage_options', __FILE__, 'example');
}

// プラグインページのコンテンツを表示
function example () {
    // 設定変更画面を表示する
?>
    <div class="wrap">
        <h2>Example</h2>
        <form method="post" action="options.php">
            <?php wp_nonce_field('update-options'); ?>
            <table class="form-table">
                <tr valign="top">
                    <th scope="row">キー</th>
                    <td><input type="text" name="key" value="<?php echo get_option('key'); ?>" /></td>
                </tr>
            </table>
            <input type="hidden" name="action" value="update" />
            <input type="hidden" name="page_options" value="key" />
            <p class="submit">
                <input type="submit" class="button-primary" value="<?php _e('Save Changes') ?>" />
            </p>
        </form>
    </div>
<?php
}
?>
<?php
//--------------------------------------------------------------------------
//
//  プラグイン削除の際に行うオプションの削除
//
//--------------------------------------------------------------------------
if ( function_exists('register_uninstall_hook') ) {
    register_uninstall_hook(__FILE__, 'uninstall_hook_example');
}
function uninstall_hook_example () {
    delete_option('key');
}
 
//--------------------------------------------------------------------------
//
//  フッターへの表示
//
//--------------------------------------------------------------------------
add_action('admin_footer', 'admin_footer_example');
function admin_footer_example () {
    $key_value = get_option('key');
    if ( $key_value ) {
        echo "<p>キー : " . esc_html($key_value). "</p>";
    }
}
?>

ソースコードの詳細

/*
Plugin Name: Example
Version: 1.0
Plugin URI: http://www.example.com
Description: プラグインページに入力された値を管理画面のフッターに表示。
Author: Example
Author URI: http://www.example.com
*/

プラグインに必須の記述。プラグインファイルであることを宣言する。

//--------------------------------------------------------------------------
//
//  管理画面>設定>Exampleプラグインページを追加
//
//--------------------------------------------------------------------------
  
// 管理メニューのアクションフック
add_action('admin_menu', 'admin_menu_example');

// アクションフックのコールバッック関数
function admin_menu_example () {
    // 設定メニュー下にサブメニューを追加:
    add_options_page('サンプルプラグイン', 'サンプルプラグイン', ’manage_options’, __FILE__, 'example');
}

add_options_page関数(Function Reference/add options page « WordPress Codex)[1]
呼び出し add_options_page( $page_title, $menu_title, $capability, $menu_slug, $function );
パラメーター
$page_titele : 追加するプラグインページのtitleタグに表示するテキスト。
$menu_title : メニューに表示するテキスト。
$capability : 追加するメニューを表示するcapability
$menu_slug : メニュー内では一意になるように付けたスラッグ名。
$function : 追加するプラグインページが表示されるときに呼び出されるコールバック関数。

例ではスラッグ名は一意の値を付けるためPHPの定義済み定数__FILE__を使って自身(example.php)のパスを設定している。

// プラグインページのコンテンツを表示
function example () {
    // 設定変更画面を表示する
?>
    <div class="wrap">
        <h2>Example</h2>
        <form method="post" action="options.php">
            <?php wp_nonce_field('update-options'); ?>
            <table class="form-table">
                <tr valign="top">
                    <th scope="row">キー</th>
                    <td><input type="text" name="key" value="<?php echo get_option('key'); ?>" /></td>
                </tr>
            </table>
            <input type="hidden" name="action" value="update" />
            <input type="hidden" name="page_options" value="key" />
            <p class="submit">
                <input type="submit" class="button-primary" value="<?php _e('Save Changes') ?>" />
            </p>
        </form>
    </div>
<?php
}
?>

exampleはコールバック関数。
form要素のaction属性options.phpはwordpressインストールディレクトリ/wp-admin/options.phpを呼び出す。
データベースのoptionsテーブルへのデータの追加はプラグインページの「変更を保存]をクリックした際に行われる。
»Adding Administration Menus – WordPress Codex 日本語版
»Creating Options Pages – WordPress Codex 日本語版

//--------------------------------------------------------------------------
//
//  プラグイン削除の際に行うオプションの削除
//
//--------------------------------------------------------------------------
if ( function_exists('register_uninstall_hook') ) {
    register_uninstall_hook(__FILE__, 'uninstall_hook_example');
}
function uninstall_hook_example () {
    delete_option('key');
}

プラグインをアンインストールしたときに設定したオプションをデータベースから削除する。
» register_uninstall_hook() – WordPress Codex

参考資料

関連記事

»投稿画面のタイトル入力域の幅とビジュアルリッチエディタ入力域の幅を変更するWordPressプラグイン : WordPress,プラグイン

[1] 管理メニューのトップレベルにメニューを追加するときはadd_menu_page関数が用意されている。

コメント

Trackbacks

  1. […] WordPressで簡単なプラグインの作成 : WordPress | findxfine -Web制作に関する覚書- […]

    ピンバックby初WordPressプラグイン管理画面作成成功! – [Mu]ムジログ — 2009-12-03 @ 3:34 PM

  2. […] 設定画面を持つ簡単なプラグインの作成 : WordPress – FindxFine […]

    ピンバックbyプラグインを作る時に参考になりそうなサイト | ガラスのハート — 2018-02-19 @ 8:08 PM


  1. capability の manage_options は文字列としてクオートしなくては駄目なのでは。たぶん定数にはなっていないと思います。間違っていたらすみません。

    コメント by cottonspace — 2012-04-27 @ 10:16 PM

  2. cottonspaceさん

    コメントありがとうございます。
    返信が遅くなってすみません。

    ご指摘いただきました点を修正しました。
    ご指摘ありがとうございます。

    コメント by findxfine — 2012-05-16 @ 2:34 PM

コメントの投稿

改行と段落タグは自動で挿入されます。
メールアドレスは表示されません。