[Wordpress]カテゴリを拡張するPluginを作成したのでメモ的エントリー

どうも、久しぶりの更新です。
最近はもっぱらWordpress界隈を徘徊している僕です。
エイプリルフールに記事公開してますが、本当のことしか書いてないので期待した人はごめんなさい。

過去記事を読んでもらったらわかると思いますがCakePHPはそこそこできる方で、jQueryとかGoogle Analyticsなんかはカナリ好物です。
でも今流行のWordpressにはカナリ疎いです。
Wordpress覚えるために色んな勉強会に参加しています。

先日、参加したWordBar堺という勉強会で、プラグイン作成のハンズオンをやったので紹介したいと思います。
プラグイン作成に興味がある人は参考にしてみてください。

WordBar堺について 

 毎月、堺市のコミュニティカフェ パンゲアで開催される、Wordpress勉強会です。会場についたらまずビールを飲むのがお約束です。クローズドコミュニティなので参加したい人はこの人に聞いてみてください。

本題：Wordpressプラグインの作り方

前置きが長くなりましたが本題です。
プラグイン作成までの流れは以下のとおりです。

1. 課題の発見
   現在、何に困っているのか。何がしたいのかを明確にします。
2. 解決するためのコード探し
   Google検索すると解決策のコードが落ちています。なければ作るしか無い。
3. テスト
   拾ってきたコードが正しく動くかチェックします。functions.phpとかでね。
4. 実装
   プラグイン化してインストール。

今回作成したプラグインはgithubに上げているので「自己責任で」利用してもらって構いません。（ダウンロード）

課題の発見

Q.プラグイン作るのは何のためか？
A.課題を解決するためです。当たり前ですが、プラグイン作りたいなら解決したい課題を見つけてください。

WordBar堺では、参加者のY氏の課題を解決することにしました。
”個別記事のサイドバーにカテゴリ別のブロックを表示したい”という課題でした。
「Wordpress」カテゴリの記事だったら、サイドバーにWordpressのロゴが入る、とかそういうやつです。

あと、表示する内容は、管理画面で簡単に変更できるとメンテナンス性もいいので、そんな機能を提供したいですね。
カテゴリ編集画面に、ブロック表示用のHTMLを登録できるようにします。

解決するためのコード探し

自分で考えてコードを書いてもいいんですが、検索するとほぼ同じ機能を提供するコードが見つかります。ありがたく拝借しましょう。

今回は同じく参加者のH氏がコードが書かれた記事を知っていました。
WordPressのカテゴリーにカスタムフィールドを追加する(webOpixel)

ものすごくやりたい事に近かったので、拝借します。

テスト

先ほどのコードをfunctions.phpに貼り付けます。

view plainprint?

1. <?php  
2. // functions.php  
3.   
4. /** 
5.  * カテゴリを拡張 
6.  * Original http://www.webopixel.net/wordpress/436.html 
7.  */  
8.   
9. // 管理画面のカテゴリ編集画面を拡張  
10. add_action ( 'edit_category_form_fields', 'extra_category_fields');  
11. function extra_category_fields( $tag ) {  
12.     $t_id = $tag->term_id;  
13.     $cat_meta = get_option( "cat_$t_id");  
14. ?>  
15. <tr class="form-field">  
16.  <th><label for="extra_text">その他テキスト</label></th>  
17.  <td><textarea name="Cat_meta[extra_text]" id="extra_text" ><?php if(isset ( $cat_meta['extra_text'])) echo esc_html($cat_meta['extra_text']) ?></textarea></td>  
18. </tr>  
19.   
20. <?php  
21. }  
22.   
23. // メタデータの保存  
24. add_action ( 'edited_term', 'save_extra_category_fileds');  
25. function save_extra_category_fileds( $term_id ) {  
26.     if ( isset( $_POST['Cat_meta'] ) ) {  
27.     $t_id = $term_id;  
28.     $cat_meta = get_option( "cat_$t_id");  
29.     $cat_keys = array_keys($_POST['Cat_meta']);  
30.     foreach ($cat_keys as $key){  
31.     if (isset($_POST['Cat_meta'][$key])){  
32.     $cat_meta[$key] = $_POST['Cat_meta'][$key];  
33.     }  
34.     }  
35.     update_option( "cat_$t_id", $cat_meta );  
36.     }  
37. }  
38. // ここまで  

<?php
// functions.php

/**
 * カテゴリを拡張
 * Original http://www.webopixel.net/wordpress/436.html
 */

// 管理画面のカテゴリ編集画面を拡張
add_action ( 'edit_category_form_fields', 'extra_category_fields');
function extra_category_fields( $tag ) {
    $t_id = $tag->term_id;
    $cat_meta = get_option( "cat_$t_id");
?>
<tr class="form-field">
 <th><label for="extra_text">その他テキスト</label></th>
 <td><textarea name="Cat_meta[extra_text]" id="extra_text" ><?php if(isset ( $cat_meta['extra_text'])) echo esc_html($cat_meta['extra_text']) ?></textarea></td>
</tr>

<?php
}

// メタデータの保存
add_action ( 'edited_term', 'save_extra_category_fileds');
function save_extra_category_fileds( $term_id ) {
    if ( isset( $_POST['Cat_meta'] ) ) {
    $t_id = $term_id;
    $cat_meta = get_option( "cat_$t_id");
    $cat_keys = array_keys($_POST['Cat_meta']);
    foreach ($cat_keys as $key){
    if (isset($_POST['Cat_meta'][$key])){
    $cat_meta[$key] = $_POST['Cat_meta'][$key];
    }
    }
    update_option( "cat_$t_id", $cat_meta );
    }
}
// ここまで

できました。

説明の下に「その他テキスト」項目が増えた！htmlも書けるよ。

元記事には画像登録のコードもあったのですが、要らないので削除しました。
ちなみに、コメントに出典元URLを入れておけば、コードの意味がわからなくなった時にすぐ調べられるのでお勧めです。（あと、俺が書いたコードじゃねーから！という主張にもｗ）

次は、sidebar.php あたりに出力用のコードを埋め込みます。

view plainprint?

1. // sidebar.php  
2.    <aside class="widget">  
3.    <?php  
4.    if ($category = get_the_category()) {  
5.     foreach ($category as $value) {  
6.      $cat_data = get_option('cat_'.intval($value->term_id));  
7.      print_r($cat_data['extra_text']);  
8.     }  
9.   
10.    }  
11.    ?>  
12.    </aside>  

// sidebar.php
   <aside class="widget">
   <?php
   if ($category = get_the_category()) {
    foreach ($category as $value) {
     $cat_data = get_option('cat_'.intval($value->term_id));
     print_r($cat_data['extra_text']);
    }

   }
   ?>
   </aside>

できました。サイドバーに登録したテキストが表示されてればOKです。
print_r() は echo esc_html()など用法に合わせて書き換えてください。

実装

こんな程度の小さなコードだったらfunctions.phpに書いておくだけで良いんじゃね？と思ったりもします。
しかし、テーマファイルの一部であるfunctions.phpだと、テーマをアップデートした時に消えてしまう可能性大です。（デザイナーさんがうっかり消したとかねｗ）
あとは、別サイトで同じ課題に当たった時に、プラグイン化しておくとインストールするだけでクリア。functions.phpの中身を隈なく探して拾い上げるなんて愚かな作業をせずに済みます。

では、プラグイン化します。

/plugins フォルダの中に好きな名前のフォルダを作ります。
/plugins/expand-category-sakai
とかね。
次は、フォルダ名と同じファイル名のPHPを作成します。
/plugins/expand-category-sakai/expand-category-sakai.php
中身は、先ほどfunctions.phpに書き込んだコードを切り取って貼り付け。
ファイルの先頭にオマジナイを書きます。

view plainprint?

1. /* 
2. Plugin Name: Expand Category Sakai 
3. Description: Word Bar Sakai 2013/03/30 
4. Author: Tomoyuki Sugita 
5. Author URI: http://tomotomosnippet.blogspot.jp/ 
6. Version: 0.1 
7. */  

/*
Plugin Name: Expand Category Sakai
Description: Word Bar Sakai 2013/03/30
Author: Tomoyuki Sugita
Author URI: http://tomotomosnippet.blogspot.jp/
Version: 0.1
*/

できました。
プラグインを有効化してみてください。さっきと全く同じ結果が表示されます。
一応、断っておきますが、Author（作者）とかは自分の名前に書き換えてくださいね。

作ったプラグインは自分だけでこっそり使うでもいいですし、友達にあげてもいいですし、Wordpressらしく公開してもいいです。
冒頭にも書きましたが、私はgithubに公開したので、使いたい人は好きに使ってください。
ただし、自己責任でお願いします。
自己責任とは、「入れたのに動かない」とか「入れたら表示がおかしくなった」とかの文句を僕宛に送らないことです（笑）
問題があれば直して使ってください！プルリクエストしてくれると泣いて喜びます！

では、素敵なワードプレスライフを！

（2013/04/03 20:58 追記）

よく見たら<textarea>タグが間違ってたので修正しました。

githubには修正済みファイルが上がっています。