WordPressのウィジェットの作り方
今更だけどウィジェットが鬼便利。
WordPressよくできてるなあと感心する。
サイドバーに何か追加したいとき、標準のテキストウィジェットでテキストやHTMLのレベルですむものならさくっと追加できる。
簡単なPHPのコードを実行したい場合はPHP Code Widgetを使えばいける。
更にウィジェットを自作するともっといろいろなことができる。
そういうわけなので基本的な表示方法と、ウィジェットごとのオプションの設定の仕方について整理してみる。
かなり簡単。
まずは基本のHello World
テキストウィジェットでいけるレベルであるが、最初の一歩はシンプルに。
< ?php
/**
* @package Hogehoge
* @version 0.1
*/
/*
Plugin Name: Hoge Widget
Plugin URI: http://brass.to/
Description: Hoge Hoge Hoge
Author: akahige
Version: 0.1
Author URI: http://brass.to/
*/
class HogeWidget extends WP_Widget {
function HogeWidget() {
parent::WP_Widget(false, 'ほげうぃじぇっと');
}
function widget($args, $instance) {
extract($args);
echo $before_widget;
echo 'Hello World!';
echo $after_widget;
}
}
add_action('widgets_init', create_function('', 'return register_widget("HogeWidget");'));これをWordPressのプラグインディレクトリにhoge_widget.phpとでも名前を付けて保存すれば動く。
冒頭のコメントはプラグインとして認識させるためのコメント。
WP_Widgetクラスを継承
2.8以降はWP_Widgetを継承することでウィジェットを作成できる。
それより前のバージョンでは作り方が違うが、今更過去を振り返る必要はないので割愛。
コンストラクタ
とりあえずウィジェットの管理画面に表示されるウィジェット名を設定。
widgetメソッド
widgetメソッドの中身がウィジェットに表示される内容になる。
$before_widgetやら$after_widgetやらはサイドバーごとに決まっているオプション。
他のウィジェットとの和を乱さぬためにお約束として入れる。
echoが残念な感じだがサンプルなので気にしないことにする。
ウィジェットの登録
add_actionの行でウィジェット初期化時にウィジェットを登録して使用できるようにしている。
この一行がないとウィジェットが使えるようにならない。
以上。
表示はこれだけ。スゲー簡単。
ウィジェットのオプションを設定できるようにする
ウィジェットの管理画面でオプションを設定して、それをウィジェットの表示に使えるようにする。
オプションはウィジェットのインスタンスごとに保存されるので、同じ種類のウィジェットを複数配置してそれぞれ別のオプション内容に基づいた表示をさせることが可能。
class HogeWidget extends WP_Widget {
function HogeWidget() {
parent::WP_Widget(false, $name = 'ほげうぃじぇっと');
}
function widget($args, $instance) {
extract($args);
$title = apply_filters('widget_title', $instance['title']);
echo $before_widget;
if ($title) echo $before_title . $title . $after_title;
echo 'Hello ' . htmlspecialchars($instance['name']) . '!';
echo $after_widget;
}
function update($new_instance, $old_instance) {
$instance = $old_instance;
$instance['title'] = strip_tags($new_instance['title']);
$instance['name'] = strip_tags($new_instance['name']);
return $instance;
}
function form($instance) {
echo '<div>title:<br /><input name="' . $this->get_field_name('title') . '" type="text" value="' . $instance['title'] . '" /></div>';
echo '<div>name:<br /><input name="' . $this->get_field_name('name') . '" type="text" value="' . $instance['name'] . '" /></div>';
}
}formメソッド
formメソッドが管理画面のオプション設定フォームの内容。
get_field_nameでinputタグのnameを取得するのがミソ。
$instanceには設定済みのオプションの値が入っている。
echoが残念なかんｊ（ｒｙ
updateメソッド
変更後の値（$new_instance）と変更前の値（$old_instance）が渡ってくるので、それらを使ってオプションとして保存する内容を返す。
フォームでの入力内容を検証したり加工したりしたい場合にはここでいろいろと処理することができる。
変更後の値をそのまま使うのであれば
return $new_instanceの一行でもよい。
というか親クラスのWP_Widgetでそういう内容になっているので、それでよければupdateメソッドの定義は略せる。
特にウィジェット用のテーブルなどを作らなくてもオプションを保存できるところが素敵。
widgetメソッド
設定したオプションの内容が$instanceに入っているのでそれを使うことができる。
新しく出てきている$before_titleやら$after_titleやらもサイドバーごとに決まっているオプション。
以上。
これも簡単。
ほんとうにWordPressはよくできていると感心する。
