hiromasa.zone : o)

2005/11/19 Saturday 投稿時の月齢:17.9  月名:居待月  潮汐:中潮 Moon:17.9[居待月]今日の心技体 : 好調期低調期好調期

WordPress 2.0 beta 1 Live このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 22:55

次期 WordPress 2.0 の beta 1 がでたようです。 やはりマイルストーン名は 1.6 ではなく 2.0 になったようですね。

[wp-testers] Beta 1 Live

Matt Mullenweg m at mullenweg.com
Sat Nov 19 00:41:15 GMT 2005

ソースのほうも .zip 形式でダウンロードできますので、既存のテーマ・プラグイン等試験してみたい方はいれてみると面白いかもしれません。 🙂

さて、WordPress のソースコードの管理には Subverstion というシステムが使われています。 これは、ソースコードの修正履歴取得やグループ作業が間違いなく行えるようになっている、いわゆるバージョン管理システムです。

この手では CVS が有名ですが最近は Subversion が増えてきた気がします。

開発環境 Eclipse では、Subversion へのアクセスが GUI で簡単にできるようなプラグインがあります。(CVS は標準サポート) 

Subversion

実際に Subversion で WP の”リポジトリ”にアクセスし、あるひとつのファイルの履歴を見ているところです。 上が履歴で、下が最新版ソースとの比較をしているところです。 Matt さん他が一生懸命修正しているのが分かります。

この手のバージョン管理システムがないと修正前のソース履歴を残すのに非常に手間がかかることは想像に難くないわけで、ありがたいシステムです。Web サイトを持つ方はご自分の HTML 他をバージョン管理システムにいれて管理・・・なんてすると便利ですね!。

Eclipse からは、Subclipse というプラグインでアクセスできます。

Subclipseプラグイン – EclipseWiki

リポジトリに、Subversionが使えるようになります。

Subversion 管理のプロジェクトはこちらでアクセスできますので、興味がある方はやってみてください。 🙂

2005/11/18 Friday 投稿時の月齢:16.9  月名:立待月  潮汐:大潮 Moon:16.9[立待月]今日の心技体 : 好調期低調期好調期

WordPress の次のバージョンで遊んでみる このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 22:01

次期 WordPress 1.6 がだいぶ出来上がってきているようなので、家の開発環境にいれてみました。

Roadmap – WordPress Trac – Trac

Active tickets:
    12
Closed tickets:
    235

Roadmap のマイルストーン名が 1.6 から 2.0 にいつの間にか変っていました。 もしかして 2.0 にするのかな??。

WordPress 1.6

1.6 trunk にも tinyMCE の UI コンポーネントがのりました。 さわればさわるほどすごいなこれ・・・。 また、一覧から記事を消したりしたときも「もにょ~ん」って消えていったりしてなかなか凝っています。

そしてぼく的に注目だった、キャッシュ機構も動いていました。 “ Built-in caching ala WP-Cache ” とあったのでてっきり WP-Cache 的な画面記録方式かとおもいきや、なんとクエリーキャッシュで実装されています!。

まだ詳しくソースを読んでいないので間違っているかもしれませんが、要は、よく使う “データ” (画面じゃない) は MySQL 問い合わせずに、Web サーバにファイルで記録したキャッシュからとりだして動作速度をあげる・・・そんなイメージです。

直感の感想ですが、「ちゅーか、速いわ 1.6」

動かせる環境がある方はインストールしてみると面白いかもしれません。ぼくも今後に備えてソースみてみることにします。

2005/11/17 Thursday 投稿時の月齢:15.7  月名:満月  潮汐:大潮 Moon:15.7[満月]今日の心技体 : 好調期低調期好調期

WordPress エントリをはてなブックマークに登録 – wp-hatena プラグイン正式版 – リリース このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 18:43

WordPress の各エントリを「はてなブックマーク」するクイックリンクを自動的に挿入するプラグイン wp-hatena をつくりましたので紹介します。

[ダウンロード]

wp-hatena-0.93j.zip

** 2005/11/18 追記 **

Masayan さんよりバグリポいただきまして、0.93 で修正しています。 0.92 落とした方申し訳ありませんが再度 0.93 のダウンロード、上書きインストールをお願いいたします。 大変失礼いたしました。

出力タグのエンティティ変換で誤りがあったのを修正しています。(Valid XHTML ではなかった)

  1.  *** 111,115 ****
  2.    'http://del.icio.us/post?url=',
  3.    'delicious.12px.gif',
  4.    12, 12,
  5.  ! '&title=' . urlencode($title)
  6.  
  7.  --- 111,115 ----
  8.    'http://del.icio.us/post?url=',
  9.    'delicious.12px.gif',
  10.    12, 12,
  11.  ! '&title=' . urlencode($title)

Masayan さん、どうもありがとうございました!。

■スクリーンショット

wp-hatena スクリーンショット

■機能

  • WordPress の各エントリの任意の位置に「はてなブックマーク」への登録クイックリンク画像を挿入できます
  • del.icio.us」への登録クイックリンクも挿入できます

■インストール方法

  1. お使いのエンコードにあった「wp-hatena-0.93_*.zip」をダウンロード展開します
  2. 展開された「wp-hatena」ディレクトリごと WordPress のプラグインディレクトリ(wp-content/plugins/)にアップロードします (ファイルが wp-content/plugins/wp-hatena/*)に配置されるようにします)
  3. WordPress の管理画面より wp-hatena を有効化します。
  4. お使いの WordPress テーマの ** エントリ表示部分 ** の任意の位置に次のコードを追加します。

はてなの場合 :

  1.  <?php if(isset($wph)) $wph->addHatena(); ?>

del.icio.us の場合 :

  1.  <?php if(isset($wph)) $wph->adddelicious(); ?>

その両方を隣り合わせて挿入する場合(例) :

  1.  <?php if(isset($wph)) {
  2.      $wph->addHatena();
  3.      $wph->adddelicious();
  4.  }?>

■特記事項

  • 「はてなブックマーク」用のリンク画像 (hatena.gif) は、はてな様より利用の許可をいただいて同梱しているものです。
  • del.icio.us 用のクイックリンク画像は同梱しておりません。デフォルト設定で wp-content/plugins/wp-hatena/delicious.12px.gif に設定してあります。申し訳ありませんが、各自のご判断で画像をご用意下さい。

■ライセンス

WordPress に従い GPL で配布します。

■謝辞

  • ブックマーククイックタグのアイディアをぼくに与えてくれた Castaway。さんに、
  • del.icio.us 対応の要望をくださった、chameleon さんに、
  • Web サービスに不慣れなぼくのために del.icio.us の仕様を調べてくれた kohaku さんに、
  • バグレポをくださった、Masayan さんに、
  • はてなブックマーク画像のプラグイン利用を快く承諾して頂いた、はてな さんに、
  • ブログを読んでくださっていたみなさんに、

感謝いたします。

wp-hatena にみるプラグインの作成方 – 後編 – このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 18:38

wp-hatena にみるプラグインの作成方 – 後編 – です。

前回はこちら。

wp-hatena にみるプラグインの作成方 – 前編 –

おっとここで、kohaku さんchameleon さんから入電。 同じソーシャルブックマークの del.icio.us への対応要望をいただきました。(←ということにしてください(笑)

次回は、このプラグインを del.icio.us 対応に改造してみます。 そしていよいよ Masayan さんも登場しますのでおたのしみに…

今回は WP というより PHP 寄りの話題になりそうです。プログラムを書くときの “共通項のまとめ方” のイメージだけつかんで頂ければ・・・、、と思って書いてみました。 この辺の言語の仕組みが分かると、既存のプラグインの流れも追いやすくなるとおもいます。 良ければ読んでみてください。

ということで、wp-hatena の del.icio.us 対応をいよいよやってみます。(遅くなってごめんなさい..)

まずは、del.icio.us の仕様を調べてみます。

  • 「http://del.icio.us/post?url=[ブックマーク登録URL]」という形式でリンクすればブックマーク登録画面になる

となっているようです。 はてなが「http://b.hatena.ne.jp/append?[ブックマーク登録URL]」とすれば良いのと同じイメージですね。はてな用のコード(関数)を転用すればすぐできそうです。あと違うのは画像ファイルの URL くらいです。

では、既にある、はてなをうけもつ addHatena() 関数のコードをみてみましょう。

  1.  function addHatena() {
  2.   
  3.    $title  = '<a';
  4.    $title .= ' href="' . $this->haneta_url . get_permalink() . '"';
  5.    $title .= ' target="_blank"';
  6.    $title .= '">';
  7.    $title .= '<img ';
  8.    $title .= ' src="' . $this->plugin_path . $this->hatena_gifname . '"';
  9.    $title .= ' alt="このエントリをはてなブックマークに追加"';
  10.    $title .= ' title="このエントリをはてなブックマークに追加"';
  11.    $title .= ' width="16" height="12"';
  12.    $title .= ' style="border: 0;margin: 0;padding: 0;vertical-align: baseline;"';
  13.    //$title .= ' onmouseover="wpHatenaPopup()"';
  14.    $title .= '>';
  15.    $title .= '</a>';
  16.   
  17.    echo $title;
  18.   
  19.  }

こんな感じになっています。これを元に同じような adddelicious 関数を追加しちゃえば良さそうです。 コード中 “$this->haneta_url” と “$this->hatena_gifname”の部分が del.icio.us 用になりますので、変数の新設や初期化コードも追加します。とりあえず初期化コードはここでは省略して、adddelicious 関数だけつくってみましょう。

  1.  function adddelicious() {
  2.   
  3.    $title  = '<a';
  4.    $title .= ' href="' . $this->delicious_url . get_permalink() . '"';
  5.    $title .= ' target="_blank"';
  6.    $title .= '">';
  7.    $title .= '<img ';
  8.    $title .= ' src="' . $this->plugin_path . $this->delicious_gifname . '"';
  9.    $title .= ' alt="このエントリをdel.icio.usに追加"';
  10.    $title .= ' title="このエントリをdel.icio.usに追加"';
  11.    $title .= ' width="16" height="12"';
  12.    $title .= ' style="border: 0;margin: 0;padding: 0;vertical-align: baseline;"';
  13.    //$title .= ' onmouseover="wpHatenaPopup()"';
  14.    $title .= '>';
  15.    $title .= '</a>';
  16.   
  17.    echo $title;
  18.   
  19.  }

このような adddelicious() 関数を addHatena() 関数の下に”追加”してみました。addHatena() のほぼデットコピーで、URL の変数とリンクタグの alt/title 属性の日本語だけ書き換えたものです。簡単にできちゃいました。

あとはこの関数を使う方のテーマ内から「<?php $wph->adddelicious(); ?>」と呼び出してもらえば del.icio.us 用のリンクが追加できるようになりました。やぁめでたい。

この調子でどんどん同じような関数を増やしていけばいろいろなソーシャルブックマークに対応できます。しかし、なにか釈然としない部分がありますね。ちょっとしか違わない同じようなコードが大量にある・・・。

プログラムの神様はこういったところを見逃さず天罰を与えてきます。 😛

ここで Masayan さんより不具合の報告を頂きます。

wp-hatena.phpの87行目
$title .= ‘”>’;→”がダブり、target=”_blank””のようになる。

wp-hatena.phpの95行目
$title .= ‘>’; → $title .= ‘ />’; /で閉じないと怒られる。

はうぁ。。(大汗

  1.  $title .= ' target="_blank"';
  2.    $title .= '">';
  1.  $title .= '>';

た、たしかに・・・。どうもありがとうございます。

直さなきゃ!、と思ったときに修正する部分が大きく2ヶ所あることに気がつきます。addHatena() 関数と adddelicious() 関数 です。この2つはデットコピーで作ってしまったために不具合も増殖させてしまったわけです。もし、2つではなくもっとたくさんのソーシャルブックマークに対応していたら・・・と思うとガクガクブルブルです。

プログラムを書くときには いろいろなところに存在する”共通項”の部分をなるべく”まとめて”書くようにすると、このような時に修正するのが簡単になり、また不都合も減らすことが出来ます。

今回は”まとめる” ための手法として”関数”を使って、共通項をくくってみます。

はてなも del.icio.us も、そしておそらく他のソーシャルブックマークも同じようなタグを作成するので、ここの部分をまとめるために makeBookmarkURL という関数を新設します。各ブックマークでタグが変る部分、

  • alt/title の名称 – $sitename
  • URL – $url
  • 画像アイコンファイル名 – $iconfile
  • 画像の大きさ。- $width、$height

を、関数の”引数” として渡すようにします。引数というのはワードプロセッサなんかの差し込み印字に近いイメージです。では、makeBookmarkURL 関数のコードをみてみます。

  1.  function makeBookmarkURL($sitename, $url, $iconfile, $width, $height) {
  2.   
  3.    $tag  = '<a';
  4.    $tag .= ' href="' . $url . get_permalink() . '"';
  5.    $tag .= ' target="_blank"';
  6.    $tag .= '">';
  7.    $tag .= '<img';
  8.    $tag .= ' src="' . $this->plugin_path . $iconfile . '"';
  9.    $tag .= ' alt="このエントリを' . $sitename . 'に追加"';
  10.    $tag .= ' title="このエントリを' . $sitename . 'に追加"';
  11.    $tag .= ' width="' . $width . '" height="' . $height . '"';
  12.    $tag .= ' style="border: 0;margin: 0;padding: 0;margin-right: 8px;vertical-align: baseline;" ';
  13.    //$tag .= ' onmouseover="wpHatenaPopup()"';
  14.    $tag .= '>';
  15.    $tag .= '</a>';
  16.   
  17.    return $tag;
  18.   
  19.  }

最初の “makeBookmarkURL($sitename, $url, $iconfile, $width, $height)” 部分が “引数” を受け取る部分です。

最後の “return $tag;” というのはこの関数が呼ばれたら $tag の内容を呼び元に返しなさいという表記です。この場合、$sitename や $url 等々が差し込まれたブックマーク用の画像タグが戻ります。

では呼び元である addHatena()、adddelicious() 関数を心機一転、makeBookmarkURL() 関数を呼び出す形に変更します。 呼び出すときは、$sitename や $url 等々の情報を埋め込んだ書き方にします。

  1.  function addHatena() {
  2.   
  3.    echo
  4.        $this->makeBookmarkURL(
  5.            'はてなブックマーク',
  6.            'http://b.hatena.ne.jp/append?',
  7.            'hatena.gif',
  8.            16, 12
  9.        );
  10.   
  11.  }
  1.  function adddelicious() {
  2.   
  3.    echo
  4.        $this->makeBookmarkURL(
  5.            'del.icio.us',
  6.            'http://del.icio.us/post?url=',
  7.            'delicious.12px.gif',
  8.            12, 12
  9.        );
  10.   
  11.  }

ずいぶんすっきりしました。 呼び出し元と呼び出し先を見比べると “差し込み印字” のイメージが分かると思います。

では、Masayan さんからいただいたタグのミスを修正します。 makeBookmarkURL関数”だけ” 直せば はてなも del.icio.us も直るわけです。

  1.  function makeBookmarkURL($sitename, $url, $iconfile, $width, $height) {
  2.   
  3.    $tag  = '<a';
  4.    $tag .= ' href="' . $url . get_permalink() . '"';
  5.    $tag .= ' target="_blank"';
  6.    $tag .= '>';
  7.    $tag .= '<img';
  8.    $tag .= ' src="' . $this->plugin_path . $iconfile . '"';
  9.    $tag .= ' alt="このエントリを' . $sitename . 'に追加"';
  10.    $tag .= ' title="このエントリを' . $sitename . 'に追加"';
  11.    $tag .= ' width="' . $width . '" height="' . $height . '"';
  12.    $tag .= ' style="border: 0;margin: 0;padding: 0;margin-right: 8px;vertical-align: baseline;" ';
  13.    //$tag .= ' onmouseover="wpHatenaPopup()" ';
  14.    $tag .= '/>';
  15.    $tag .= '</a>';
  16.   
  17.    return $tag;
  18.   
  19.  }

また、たとえばタグが気に入らなかった場合もこの関数だけ修正すればすべてに反映できますね。

wp-hatena に限らず “関数” についてはほぼ全てのプログラムで使われる手法です。 このように共通部分をくくりだすことができる他、コードを処理単位に分けて書くことが出来るようになります。

プログラムはあっちこっちの関数を呼び出して動くことになるので、慣れないうちは流れを追うのが大変かもしれませんが、逆になれてしまえば必要のない関数は読む必要がない(何をする関数なのか予測がつく)ので非常に楽になると思います。 是非活用してみてください。

以上で長きにわたりましたプラグインノウハウシリーズは終了です。 今回サンプルにしていました wp-hatena をもう少し修正したものを下記で配布していますのでよければ参考にソースをどうぞ。

実は今回のエントリの del.icio.us 対応ソースだと、ブックマーク時に del.icio.us にタイトルが渡りません。この辺の対応もあわせてしています。

WordPress エントリをはてなブックマークに登録 – wp-hatena プラグイン正式版 – リリース

最後に。 とりとめのない文章を終わりまで読んで頂きましてありがとうございました。

2005/11/16 Wednesday 投稿時の月齢:14.7  月名:十五夜  潮汐:大潮 Moon:14.7[十五夜]今日の心技体 : 好調期低調期好調期

昨日のブログ更新がお休みだったわけ このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 17:51

一応、ほぼ毎日更新しているこのブログですが、たまにお休みすることがあります。 大抵は飲みに行って朝帰ってきたとかそんな感じの理由です。 🙂

で、昨日も実はお休みしていたのですが、ちょっといつもと理由が違いました。

仮免を明日に控え、もんもんとして書けなかった。orz

・・・ということで、今日仮免の試験を受けてきました。

仮免許試験は、9時20分受付開始。 しかし、前回の教習で不安を覚えたぼくは、8時に学校にいきコース(仮免なので場内試験)を上から眺めイメージトレーニング・・・。 がくがくぶるぶる。。

ほどなく9時20分近くなったので集合の教室へ。 はいってみると、いるわいるわ50名弱の受験者。 番号を見たら先頭の列だったのでそそくさと座る。

指導員の人が入ってきて試験の説明を始める。 まぁね。 座った瞬間にいやな予感はしていたのですが、やっぱりトップバッター。。 後部座席には2番手の人が座るとのこと。 実は、後部座席で人の運転をみて再勉強しようと思っていたのに、はかなく破れる夢。 いやな予感がする。

でもって車のところに集まり、後部座席担当のおに~ちゃんとともに乗り込む。 年の頃は25くらいかな。 学生さんではなさそう。 乗る前に、

緊張しますね~

といってくれた。 いい人だ。

で、出発準備していざ出発! クラッチ踏んだままでアクセルふんでみてらえらい吹き上がる。 ゼロヨンか!

実は車と言えば 24番ってかいた愛車ブルーバードしかしらないわけで・・・。(いつも同じ車なのです) しかし試験は別な車・・・。 なんかちょっと雰囲気が違う。

ここであせったひろまさくん。 本当は、ぼぉんぶぉんってやって感覚確かめようとしたけど怒られたら困るし・・・と思い、あせりつつそのまま発信。

したっけエンスト。orz (←北海道弁

もうだめぽ・・・。うしろのおに~ちゃんも動揺していたのが分かった。。 試験中止?中止? と思っていたら「落ち着いてがんばってください」 ということでまだ走れるらしい。。

もうこうなったら別の目標をたてて気分を紛らわすしかない。 

「検定車最速伝説」 

しかしすぐ坂道発進で再び停止。 ここで、先ほどのエンストが頭をよぎる。。 「またやったら。。」 しかし、kohaku さんに「アクセルは思い切って」といわれたのを思い出し、ぶぉ~んとなんとかクリア!

もうその後はいつもより速く走りました。 規定速度も40キロギリギリいっぱいまでだしました。 もうなんとでもなれ~(涙

なんとか場内試験を終え、後部座席のおに~ちゃんに「がんばってください」と言い残しとぼとぼとロビーへ。

さすがに50人近くいたので発表まで1時間30分ほど空き時間。 ロビーの大画面ワイドテレビで「みのさん」を楽しむ。 そのうちに館内放送で「結果発表をしますのでロビーのテレビの前に集まってください」と言われた。 テレビ?どこどこ? と思っていたらいきなり「みのさん」が “おもいっきり Windows” の画面に変る。 このテレビか!

合格。

良かった・・・(涙 後部座席のおに~ちゃんも合格だった。 みつけたので「だめだと思いました」なんて話ながら学科試験へ。

学科のほうは「効果測定器」という学内にあった模擬試験が出来る Windows の CAI システムで意地になって満点出るまでやっていたので問題なく終了。

また先ほどの「みのさん」テレビで発表があるということだったので、前で座って待つことにする。 ”後部座席のおに~ちゃん” も座っていたのでとなりに座ろうと思ったのですが、なにやらお仕事の電話をされているようだったので別の席に。

合格。

ようやく帰ってパソコンで遊ぼう~なんて気分になる。 合格者はぞろぞろと次の説明会場に移動。 ・・・動かない人がいる。

さっきのおに~ちゃん。 まだ仕事の電話中しているんか~、とおもっておに~ちゃんの受験番号をみたら、、ない。。

おに~ちゃん、結果に惚けながら電話している。

あんなに哀愁漂う後ろ姿をみたのは久しぶりでした。 近くに座っていたらなんて声をかけていいのか分からないところでした。。

というわけで、仮免なんとか合格でした。 次からは路上教習です。 まだまだ緊張は続く・・・。

2005/11/14 Monday 投稿時の月齢:12.9  月名:十三夜  潮汐:中潮 Moon:12.9[十三夜]今日の心技体 : 好調期低調期好調期

wp-hatena にみるプラグインの作成方 – 前編 – このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 23:11

今回から装いも新たに「wp-hatena にみるプラグインの作成方 – 前編 -」 ということで先日リリースした “WordPress エントリをはてなブックマークに登録 – wp-hatena プラグイン -” を元にコードを見ていきたいと思います。

前回はこちら、

WordPress プラグイン作成のノウハウ – 終編 –

これから始まる本エントリは、今までのお話が実際にはこんな感じになります、という趣旨がです。一応、サンプルにしている wp-hatena プラグインの動作も事前に見て頂いておくと分かりやすいかもしれません。

まずは簡単ですが wp-hatena の動作を書きます。

  • プラグイン有効化後、テーマ内に「<?php $wph->addHatene(); ?>」と書くと “エントリをはてなブックマークに登録するリンク画像” がサイトに表示される。
  • リンク画像は自分のサーバの 「http://[サーバ名:ブログ設置ディレクトリ]/wp-content/plugins/wp-hatena/append.gif」というファイルである
  • そのリンク先は、「http://b.hatena.ne.jp/append?」の後ろにエントリのURL をつけたものである

という感じです。

プログラムの内容を簡単に言えば、ユーザに呼び出してもらう関数(addHatene())を定義し、その中で上記2つの URL を生成して画面に返す、ということですね!。

では早速 wp-hatena のコードを一番上から説明していきたいと思います。

まずは WP にプラグイン情報を与えるおなじみのコメント部分です。

  1.  <?php
  2.  /*
  3.  Plugin Name: wp-hatena
  4.  Plugin URI: http://zone.maple4ever.net/blog/archives/439/
  5.  Description: エントリをはてなブックマークに追加するリンクタグを挿入します。
  6.  Author: hiromasa
  7.  Version: 0.8
  8.  Author URI: http://zone.maple4ever.net/blog/
  9.  Special Thanks: Castaway. (http://bless.babyblue.jp/wp/)
  10.  */

このコメントは、WP 管理画面のプラグイン一覧の情報とも対応しています。 今回は、Castaway。さんのサイトを参考に作らせて頂いたので「Special Thanks:」ということで WP 規格外の情報も入れています。

そしてこのプラグインはなにやらその後にもコメントが続いています。

  1.  /*  Copyright 2005 hiromasa  (email : webmaster@hiromasa.zone.ne.jp)
  2.  
  3.      This program is free software; you can redistribute it and/or modify
  4.      it under the terms of the GNU General Public License as published by
  5.      the Free Software Foundation; either version 2 of the License, or
  6.      (at your option) any later version.
  7.  
  8.      This program is distributed in the hope that it will be useful,
  9.      but WITHOUT ANY WARRANTY; without even the implied warranty of
  10.      MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSESee the
  11.      GNU General Public License for more details.
  12.  
  13.      You should have received a copy of the GNU General Public License
  14.      along with this program; if not, write to the Free Software
  15.      Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA
  16.  */

これは、このプラグインは GPL というライセンスの元配布されていますというコメントです。

WordPress 本体 は GPL というライセンスで配布されているプログラムです。でもって、GPL の決まりの中に「GPL にリンクして動くプログラムは GPLにしなければならない」というのがありますので、WP にリンクして動くこのプラグインも自動的に GPL で配布することになります。 このコメント部分はこのプログラムが GPL ですよということを宣言しているわけです。

中身は、

  • 著作者名
  • このプログラムは GPL で配布されているよ
  • このプログラムは有用だと思っているけど無保証だよ
  • ライセンスの全文は他にあると思うけどなかったら連絡ちょうだい

という感じでしょうか。詳しくは GPL 関連のサイトをみてみてください。 ソース上でライセンス宣言をしたい場合はこのような記述を使うようです。

[参考]

Writing a Plugin < WordPress Codex
Plugin File Structure

さてコードに戻りまして、コメントはもうちょっと続きます。

  1.  /******************************************************************************
  2.   * 使い方 :
  3.   *  プラグインを有効にした後 WP テーマ内の**エントリ位置**に、
  4.   *  <?php if(isset($wph)) $wph->addHatena(); ?>
  5.   *  を挿入してください。
  6.   *****************************************************************************/

ここは自分のコメントです。使い方やバージョン履歴を入れる方が多いようですね。この辺はお好みです。

では、いよいよ次からがプログラム本体です。

  1.  if(class_exists('WpHatena')) {
  2.   
  3.    $wph = & new WpHatena();
  4.    //add_action('wp_head', array(&$wph, 'addScript'));
  5.   
  6.  }

このプラグインは、前回説明した class を使って書いています。41行目がそのインスタンスの作成部分。で、42行目が hook への登録部分です。 wp_head というのは、WP が HTML の <head> 部分に出力するときに割り込むことが出来る hook です。今回の場合、具体的には 画像カーソルポップアップのJavaScript のファイルを差し込もうとしています。(この部分は未完成なのでコメントアウトされていたりします・・・)

wp-hatena は、使う方がテーマ内に手動でプラグインを呼び出してもらうコードを書いて頂く方式を使っています。ということで、基本 hook がないタイプのプラグインです。一応ここまでの流れがありますので、上記のコメントアウトしてある hook 登録は行われているものとして説明していきます。

さて、話題は上記コードに戻ります。 39 行目が今までに出てきていない記述です。

  1.  if(class_exists('WpHatena')) {

これは、WpHatena クラスが”存在したら” という PHP のコードになります。 下まで読むと WpHatena がちゃんと存在していたらプラグインを登録してね、ということになります。

今回は同じプラグインファイルに WpHatena クラスがあるので、定義が存在しないことはありえないわけですが、一応なにかの加減で消えてしまったときに、PHP からエラーが出ないように保護装置をいれているイメージです。

では、次のコードにいきましょう。ここからがプラグイン本体のコードになります。

  1.  class WpHatena {
  2.   
  3.    var $plugin_path;
  4.    var $hatena_url;
  5.    var $hatena_gifname;
  6.    var $popup_jsname;
  7.   
  8.    /**
  9.    * The Constructor
  10.    *
  11.    * @param none
  12.    * @return Object reference
  13.    */
  14.    function WpHatena() {
  15.       
  16.        $this->plugin_path  = get_settings('siteurl');
  17.        $this->plugin_path .= '/wp-content/plugins/wp-hatena/';
  18.        $this->hatena_gifname = 'append.gif';
  19.        $this->popup_jsname = 'popup.js';
  20.        $this->haneta_url = 'http://b.hatena.ne.jp/append?';
  21.       
  22.    }

55 行目~ 58行目までが WpHatena オブジェクトで扱うメンバ変数です。後編で書きました 一回だけ初期化したい変数をここで宣言しています。 具体的には、はてなの画像表示用のパスとファイル名、はてなブックマークへの URL、また head にだす JavaScript のファイル名を宣言しています。

そして、68 行目~ 72 行目までがこの変数の初期化コードです。WpHatena クラスのコンストラクタ内ですのでただ一回、

  1.  $wph = & new WpHatena();

の WP 初期化時にだけ呼び出されます。また、初期化した変数はプラグインが動き続けている期間、継続で使い続けることが出来ます。

変数中、一点だけ特殊な部分があって、

  1.  $this->plugin_path = get_settings('siteurl');

get_settings() という関数が呼び出されているのが分かります。 これは WP の組み込みの関数の一つでブログの設定を持ってこれる関数です。 ここでは、siteurl という自分のブログの URL の設定を img タグと script タグで使うためにもらってきています。

前述、

リンク画像は自分のサーバの 「http://[サーバ名:ブログ設置ディレクトリ]/wp-content/plugins/wp-hatena/append.gif」というファイルである

の「http://[サーバ名:ブログ設置ディレクトリ]」までを “get_settings(‘siteurl’);” でもってこれるわけです。

WP の組み込み関数は沢山あるようなのですが、まだドキュメント上も DRAFT の状態のようです。 ただ一つ言えるのは、大抵のことはあるということ…。 もし何かしたくなったら同じようなことをしているプラグインを見てみるのが一番早いかもしれません。 🙂

[参考]

Function Reference < WordPress Codex

次のコードは、使う方がテーマに「<?php $wph-addHatena(); ?>」と書いたときに呼び出される関数です。手動で呼び出してもらうだけなので、この関数は hook には登録されていません。

  1.  function addHatena() {
  2.     
  3.      $title  = '<a';
  4.      $title .= ' href="' . $this->haneta_url . get_permalink() . '"';
  5.      $title .= ' target="_blank"';
  6.      $title .= '">';
  7.      $title .= '<img ';
  8.      $title .= ' src="' . $this->plugin_path . $this->hatena_gifname . '"';
  9.      $title .= ' alt="このエントリをはてなブックマークに追加"';
  10.      $title .= ' title="このエントリをはてなブックマークに追加"';
  11.      $title .= ' width="16" height="12"';
  12.      $title .= ' style="border: 0;margin: 0;padding: 0;vertical-align: baseline;"';
  13.      //$title .= ' onmouseover="wpHatenaPopup()"';
  14.      $title .= '>';
  15.      $title .= '</a>';
  16.     
  17.      echo $title;
  18.     
  19.    }

普通に、変数を echo で出力しているだけです。 コンストラクタで初期化したメンバ変数は、$this->変数名 という書き方をすればアクセスできます。

関数中、また WP の組み込み関数が一つ出てきています。

  1.  $title.='href="'.$this->haneta_url.get_permalink().'"';

の、get_permalink() 関数です。 これは、エントリの URL をそのまんま返してくれる関数です。

そのリンク先は、「http://b.hatena.ne.jp/append?」の後ろにエントリのURL をつけたものである

ということで、そのまんま上記の URL を作成しているわけです。

関係ありませんが、関数中 $title なんていう変な変数名が使っているのは、このプラグインは実は the_title の hook だったなごりです。作った当初は、自動でタイトルの横に入ればいいな~なんて考えていたのですが、冷静に考えると自由な場所に入れられたほうが便利だな、と考え今の形(使う方にテーマから呼び出してもらう)になっています。

続きまして、最後のコードをみます。

  1.  function addScript() {
  2.     
  3.      echo '<script type="text/javascript"';
  4.      echo ' src="'. $this->plugin_path . $this->popup_jsname . '"';
  5.      echo '>';
  6.      echo '</script>';
  7.     
  8.    }

この addScript 関数は wp_head の hook に登録されている(はずだった)ものです。これは簡単で、ただたんに <script> を書き出しているだけです。

以上、wp-hatena のソースコードの説明でした。

おっとここで、kohaku さんchameleon さんから入電。 同じソーシャルブックマークの del.icio.us への対応要望をいただきました。(←ということにしてください(笑)

次回は、このプラグインを del.icio.us 対応に改造してみます。 そしていよいよ Masayan さんも登場しますのでおたのしみに…

あとあと、Otsukare さん、リンク頂いているのにとりとめなく長くなってごめんなさい。。

yutaka さん 言葉の説明が足りなくてごめんなさい。。 この辺は今度、PHP 単体でかいてみますね。

続く..

[続き..]

wp-hatena にみるプラグインの作成方 – 後編 –

2005/11/13 Sunday 投稿時の月齢:11.9  月名:十二日月  潮汐:中潮 Moon:11.9[十二日月]今日の心技体 : 好調期低調前不安定期好調期

WordPress プラグイン作成時のノウハウ – 後編 – このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 23:00

WordPress プラグイン作成時のノウハウ – 後編 – です。

前回はこちら、

WordPress プラグイン作成のノウハウ – 中編 –

いろいろ書いてしまいましたが、実は「中編」の知識だけで WP プラグインは書くことは可能です。 あとは hook のドキュメントを見て、”おお、こんなところに割り込めるのか。これを使えば、、ふふふ。” と思う気持ちが芽生えればもうプラグインマスターです。

たとえば、the_content というフィルター hook はエントリの本文を全て渡してきてくれるので、渡された本文の文字列の単語や語尾を置換し、札幌弁や岡山弁や博多弁(地域の選択に深い意味はございません(?)…)に変換してしまうプラグインの機構なんてのは、すぐつくれることでしょう。 😛

機構ができれば、あとはこの “置換する” といった部分を hook に登録した関数に、”機械の言葉” = ソースコードで書けば OK です。なにやら難しそうな雰囲気ですが、そこはそこ我らが PHP。これ以上ないくらい便利な関数が沢山用意されていますので、たとえば Google で “PHP 置換” なんてやりたいことを検索すれば参考になるサンプルソースがたくさん出てくることでしょう。あとは、プラグインとして機能するようにそのソースをあてはめれば良く、もしかすると PHP 知らなくてもプラグインかけちゃうかもしれません。 🙂

とりあえず前回の、「投稿時間に “☆” を無意味に付けるプラグイン」を有効化して 登録する hook や関数の中を書き換えていけば自然と概略が分かってくると思いますので、興味のある方は是非どうぞ!

さてさて、このようにして作っていったプラグイン。実はソース(機能)が大きくなっていくとちょっとした壁にあたります。

  • 作成した関数”名”が WordPress 本体や他のプラグインとかぶるんじゃないかと不安になってくる
  • 関数間で使い回したい変数や定数があるときに、グローバル変数や define を使わなくてはならず、これまた名前の重複が不安になる
  • 上記理由でグローバル変数を使いたくないから関数内で定数を定義すると、hook で呼ばれるたびに初期化しなくてはいけなくて何か釈然としない

ふまえて前回作った「投稿時間に “☆” を無意味に付けるプラグイン」をみてみます。

  1.  <?php
  2.  /*
  3.  Plugin Name: Star Time
  4.  Plugin URI: http://zone.maple4ever.net/blog/
  5.  Description: 投稿時間に "☆" を無意味に付けるプラグイン
  6.  Author: hiromasa
  7.  Version: 1.0
  8.  Author URI: http://zone.maple4ever.net/blog/
  9.  */
  10.  
  11.  /****************************************************
  12.   * WP の the_time hook に startime 関数を追加します。
  13.   ***************************************************/
  14.  add_filter('the_time', 'startime');
  15.  
  16.  /****************************************************
  17.   * startime 関数を定義します。
  18.   ***************************************************/
  19.  function startime($time) {
  20.     
  21.      $hosi = "";
  22.      $newtime = $hosi . $time . $hosi;
  23.     
  24.      return $newtime;
  25.     
  26.  }
  27.  ?>

この場合、

  • 関数名 startime が他と重複してはいけない
  • $hosi 変数(定数)を hook が呼ばれるたびに再定義している

ということになります。(え、$hosi は強引じゃないかって・・・、その通りです。orz サンプルということでお許しを…)

これを解決するのに PHP で用意されているオブジェクト指向用の記述(class)を使ってみます。

ソースを見たほうが早いので、同プラグインを class 化したソースをまず書きます。

  1.  <?php
  2.  /*
  3.  Plugin Name: Star Time Class 版
  4.  Plugin URI: http://zone.maple4ever.net/blog/
  5.  Description: 投稿時間に "☆" を無意味に付けるプラグイン
  6.  Author: hiromasa
  7.  Version: 1.0
  8.  Author URI: http://zone.maple4ever.net/blog/
  9.  */
  10.  
  11.  /****************************************************
  12.   * WP の the_time hook に StarTime オブを追加します。
  13.   ***************************************************/
  14.  /* StarTime のオブジェクト作成 */
  15.  $startime = & new StarTime();
  16.  /* hook にオブジェクトと関数を登録 */
  17.  add_filter('the_time', array(&$startime, 'addStar'));
  18.  
  19.  /****************************************************
  20.   * StarTime クラスを定義します。
  21.   ***************************************************/
  22.  class StarTime {
  23.     
  24.      var $hosi;
  25.     
  26.      function StarTime() {
  27.         
  28.          $this->hosi = "";
  29.         
  30.      }
  31.     
  32.      function addStar($time) {
  33.       
  34.        $newtime = $this->hosi . $time . $this->hosi;
  35.       
  36.        return $newtime;
  37.       
  38.      }
  39.  }
  40.  ?>

☆を出力する関数の定義部分(addStar)が class StarTime の中に入ったのが分かります。また、class の StarTime() 関数が新設され $hosi の “初期化” を行っています。

ではソースを上から見ていきます。とりあえずコメントはいいとして、hook の登録の部分が変りました。

  1.  /* StarTime のオブジェクト作成 */
  2.  $startime = & new StarTime();
  3.  /* hook にオブジェクトと関数を登録 */
  4.  add_filter('the_time', array(&$startime, 'addStar'));

まず、class StarTime のオブジェクトの作成(15行目)をしているのが分かります。次に、add_filter でそのインスタンスと hook したときに呼ばれる関数名(addStar)を登録しています(17行目)。インスタンスの関数を hook に登録するときはこのように array 形式で記述を使います。(なお $startime 変数の前に “&” を付けているのは PHP 4系互換のためです。5系ではデフォルト参照で渡るので必要ありません。)

記述方法が変っただけでやっていることは同じですね!

次に class の定義部分をみていきます。

  1.  class StarTime {
  2.     
  3.      var $hosi;
  4.     
  5.      function StarTime() {
  6.         
  7.          $this->hosi = "";
  8.         
  9.      }

24行目でメンバ変数として(ここでは)定数となる変数 $hosi を定義しています。

そして、26行目からの StarTime() がこのオブジェクトのコンストラクタです。 class 名と同じ名称の関数がコンストラクタになります。コンストラクタが呼び出されるタイミングは、オブジェクトが作成された時・・・ 15行目で「$startime = & new StarTime();」された時になります。 つまり、プラグイン内で一度だけでいい “初期設定”を行うタイミングをつくることができました。 ここでは、$hosi を “☆” に設定することでプラグインの生存期間は自由にこの変数を使えるということになります。

このように class 化することでまずは、

関数間で使い回したい変数や定数があるときに、グローバル変数や define を使わなくてはならず、これまた名前の重複が不安になる

上記理由でグローバル変数を使いたくないから関数内で定数を定義すると、hook で呼ばれるたびに初期化しなくてはいけなくて何か釈然としない

という問題点が解決できるわけです。

コードを再び追っていきます。

  1.  function addStar($time) {
  2.       
  3.        $newtime = $this->hosi . $time . $this->hosi;
  4.       
  5.        return $newtime;
  6.       
  7.      }
  8.  }
  9.  ?>

addStar 関数が hook から呼ばれる関数です。この関数”名”は StarTime クラス内でしか通用しない名前になります。 class 内であればいくつでも関数をつくって大丈夫です。 class 内でのみ有効な名前です。

ということで、

作成した関数”名”が WordPress 本体や他のプラグインとかぶるんじゃないかと不安になってくる

この問題も class 化することで解決することが出来ます。

もちろん WP とインターフェースしている以上、この “名称かぶり” の問題は依然として残っていて、気をつけなければならないのは、

  1.  $startime = & new StarTime();

の、class 名(StarTime) とインスタンス変数($startime) 名がかぶってはいけない名前です。まぁこればかりは WP とプラグインが繋がっている以上しょうがない部分ですので気をつけて名称を決めましょう。 🙂

以上まとめますと、大きめのプラグインは class 化すると、

  • コンストラクタ部分にプラグインの初期化コードを設けることが出来る
  • class を名前空間として使い他のプログラムとの関数/変数名の重複を考えなくて済むようになる

ということが出来るようになり、大分プログラムが書きやすくなります。

お気づきの方も多いと思いますが、今回サンプルにした Class 版とClass 版じゃない StarTime、実は名称のかぶりを気をつけるという観点だと、Class 版 “じゃないほう”が気をつける個数的に勝っています・・・、これを改悪と呼ぶ。。 サンプルは関数一個の小さいものですので、こういった場合には無理に class 化する必要はないということですね。 また、変数の初期化も強引なものでした。

では最後に、本当は今回のサンプルにするはずだった「wp-hatena」のソースのメイン部分を class 化したプラグインの例として記載します。 プログラム中、未完成でコメントアウトしている部分があるのですが、とりあえずあるものとしてみてください。

  1.  /******************************************************************************
  2.   * WpHatena function define.
  3.   *****************************************************************************/
  4.  if(class_exists('WpHatena')) {
  5.     
  6.      $wph = & new WpHatena();
  7.      // add_filter('wp_head', array(&$wph, 'addScript'));
  8.     
  9.  }
  10.  
  11.  /******************************************************************************
  12.   * WpHatena
  13.   *
  14.   * @author      hiromasa
  15.   * @version    1.0
  16.   *
  17.   *****************************************************************************/
  18.  class WpHatena {
  19.     
  20.      var $plugin_path;
  21.      var $hatena_url;
  22.      var $hatena_gifname;
  23.      var $popup_jsname;
  24.     
  25.      /**
  26.      * The Constructor
  27.      *
  28.      * @param none
  29.      * @return Object reference
  30.      */
  31.      function WpHatena() {
  32.         
  33.          $this->plugin_path  = get_settings('siteurl');
  34.          $this->plugin_path .= '/wp-content/plugins/wp-hatena/';
  35.          $this->hatena_gifname = 'append.gif';
  36.          $this->popup_jsname = 'popup.js';
  37.          $this->haneta_url = 'http://b.hatena.ne.jp/append?';
  38.         
  39.      }
  40.     
  41.      /**
  42.      * WP interface.
  43.      *
  44.      * @param none
  45.      * @return none (はてなブックマーク用のタグを echo)
  46.      */
  47.      function addHatena() {
  48.         
  49.          $title  = '<a';
  50.          $title .= ' href="' . $this->haneta_url . get_permalink() . '"';
  51.          $title .= ' target="_blank"';
  52.          $title .= '">';
  53.          $title .= '<img ';
  54.          $title .= ' src="' . $this->plugin_path . $this->hatena_gifname . '"';
  55.          $title .= ' alt="このエントリをはてなブックマークに追加"';
  56.          $title .= ' title="このエントリをはてなブックマークに追加"';
  57.          $title .= ' width="16" height="12"';
  58.          $title .= ' style="border: 0;margin: 0;padding: 0;vertical-align: baseline;"';
  59.          //$title .= ' onmouseover="wpHatenaPopup()"';
  60.          $title .= '>';
  61.          $title .= '</a>';
  62.         
  63.          echo $title;
  64.         
  65.      }
  66.     
  67.      /**
  68.      * WP filter interface.(wp_head)
  69.      *
  70.      * @param none
  71.      * @return none (リンクタグ用のポップアップ JavaScript を echo)
  72.      */
  73.      function addScript($content) {
  74.         
  75.          echo '<script type="text/javascript"';
  76.          echo ' src="'. $this->plugin_path . $this->popup_jsname . '"';
  77.          echo '>';
  78.          echo '</script>';
  79.         
  80.      }
  81.     
  82.  }
  83.  ?>

次回はようやく wp-hatena を使ったソースの細かい説明と、「del.icio.us」対応、そして Masayan さんからいただいた不具合報告(!)の対応をしてみたいと思います。

・・・え、後編なのにまだ続くのって・・・。 はい。。 続編に続く・・・。

[続き..]

wp-hatena にみるプラグインの作成方 – 第1章 –

WordPress プラグイン作成時のノウハウ – 中編 – このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 0:12

WordPress プラグイン作成時のノウハウ – 中編 – です。(諸事情により後編ではなく中編に…)

前回はこちら、

WordPress プラグイン作成のノウハウ – 前編 –

ではまず、wp-hatena のソースを見る前に、この世で一番簡単であろう hook を使うプラグインを書いてみます。 wp-hatena のほうは小技が少しはいっているため、ちょっと後回しにします。 🙂

ここでサンプルにするのは、驚愕の「投稿時間に “☆” を無意味に付けるプラグイン」。

以下がコードになります。

  1.  <?php
  2.  /*
  3.  Plugin Name: Star Time
  4.  Plugin URI: http://zone.maple4ever.net/blog/
  5.  Description: 投稿時間に "☆" を無意味に付けるプラグイン
  6.  Author: hiromasa
  7.  Version: 1.0
  8.  Author URI: http://zone.maple4ever.net/blog/
  9.  */
  10.  
  11.  /****************************************************
  12.   * WP の the_time hook に startime関数を追加します。
  13.   ***************************************************/
  14.  add_filter('the_time', 'startime');
  15.  
  16.  /****************************************************
  17.   * startime 関数を定義します。
  18.   ***************************************************/
  19.  function startime($time) {
  20.     
  21.      $hosi = "";
  22.      $newtime = $hosi . $time . $hosi;
  23.     
  24.      return $newtime;
  25.     
  26.  }
  27.  ?>

実行結果はこんな感じです。

結果

・・・。 まぁサンプルということでお許しを。 ☆の部分だけご確認下さい。

では気を取り直してソースを最初から見ていきましょう。 まずは先頭のコメント行です。

  1.  <?php
  2.  /*
  3.  Plugin Name: Star Time
  4.  Plugin URI: http://zone.maple4ever.net/blog/
  5.  Description: 投稿時間に "☆" を無意味に付けるプラグイン
  6.  Author: hiromasa
  7.  Version: 1.0
  8.  Author URI: http://zone.maple4ever.net/blog/
  9.  */

たかがコメント、されどコメント。 実は WordPress はこのコメント形式を見てプラグインを認識します。ということでこの形式を壊さないように必要な情報を埋め込んでいます。このコメント行さえあれば、とりあえず WordPress のプラグインとしては成立するわけです。(有効化してもなんにも起きませんが…)

次は、”hook を 登録” する部分です。

  1.  /****************************************************
  2.   * WP の the_time hook に startime 関数を追加します。
  3.   ***************************************************/
  4.  add_filter('the_time', 'startime');

ここでは、”投稿時間” の改変をしたかったので the_time という hook を利用しています。 また、”したいこと”が書いてある関数名(startime)を add_filter で指定します。

そして、”したいこと” が書いてある関数(startime)の定義です。ちなみに関数名は別で使っていないものであればなんでもかまいません。(かぶらないような名前で…)

  1.  /****************************************************
  2.   * startime 関数を定義します。
  3.   ***************************************************/
  4.  function startime($time) {
  5.     
  6.      $hosi = "";
  7.      $newtime = $hosi . $time . $hosi;
  8.     
  9.      return $newtime;
  10.     
  11.  }

function startime までは良いですが、その後の ($time) というのはなんでしょう? 実は WP の(フィルター)hook の多くは “現在までの処理結果” をこのように引数で渡してきます。 つまり、$time には投稿時間が入ってくることになります。($ではじまる変数の名前は適当につけて OK です)

ここでは投稿時間に☆をつけたいわけなので、$time を挟む形で☆をつけて・・・。

最後に、return $newtime; ということで WP に結果を返してあげます。ちなみに、この return をしなかった場合は、投稿時間が”からっぽ” になります。

たとえば、同じ the_time hook を使うプラグインがもう一個あった場合で優先順位がこのプラグインより低かった場合、次のプラグインの $time には “☆”付の投稿時間が渡されます。

「前編」で “数珠繋ぎ” といっていた実際の動きはこのあたりのことになるわけです。 おそらくこのプラグインの後ろにまわったプラグインは、投稿時間に☆なんかついてくることを想定していないので困ったことになるでしょう。。 こういうことを回避するため、このような後方に影響を与えそうなプラグインの場合は優先順位をありえないくらい後ろ(1000とか)に設定するというテクニックを使うことが多いです。

さて、このプラグインを導入すると、投稿時間が “☆投稿時間☆” となってサイトに表示されます。 the_time hook はサイト内の全ての投稿時間を表示されるときに呼び出されますので、このプラグインによってサイトは☆だらけの様相を呈してくるわけです。 🙂

ここまで読んでいると、WP から hook に登録した関数に “何が渡されてくるのか” という疑問が沸々とわいてくると思うのですが、この辺はドキュメントをみれば分かるようになっている…

Plugin API < WordPress Codex

ハズなのですが、結構まだ書いていない(TBD) 部分も多く、割と勘でやってみたり、他の方が作られたプラグインを参考にすることが多いです。 🙂

てなわけで、後編に続く…

[続き..]

WordPress プラグイン作成のノウハウ – 後編 –

2005/11/12 Saturday 投稿時の月齢:10.6  月名:十日余の月  潮汐:若潮 Moon:10.6[十日余の月]今日の心技体 : 好調期低調前不安定期好調期

WordPress プラグイン作成時のノウハウ – 前編 – このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 16:46

WordPress プラグイン作成のノウハウなんかを書いてみます。 偉そうなタイトルのわりにはたいしたこと無いので暇つぶしにどうぞ。 🙂

ちょうど短めでサンプルに丁度良いプラグイン、「WordPress エントリをはてなブックマークに登録 – wp-hatena プラグイン –」のソースを元に説明してみたいと思います。 また、kohaku さんより “del.icio.us 対応” のご要望もいただいておりましたので、このエントリでプログラムの説明といっしょに対応してみたいと思います。 🙂

なおなお、説明中にはぼくが便宜上 “勝手に作った言葉” が多数存在します。正式な呼び名については各ドキュメントをご参照下さい。

では、最初に WordPress プラグインの動作を書いてみます。

  1. 有効化されたプラグインは WP の初期化の段階で .php ファイルが読み込まれ実行される
  2. 通常、プラグインは初期化の段階で動いても何も出来ないので、この時点では WP に対して “hook の登録”、”関数の定義” だけを行い WP に処理を戻す
  3. 初期化が終わり動き出した WP は、適切な時期に “登録 hook の呼び出し”、
    またテーマ等に書いてあった “関数の呼び出し” を行いつつ処理を進める
  4. プラグインは WP から呼ばれたら適切に動作をして WP に処理を戻す
  5. プラグインの存在分くりかえし..

と、このような感じです。ポイントとなるのは、”hook の登録” の部分です。この WP の機能により、プラグインを有効にしただけでサイトの画面やデータベースの内容を追加したり修正したりできます。

イメージがわきにくいと思いますが、ドキュメントをみるとすぐ
分かります。

Plugin API < WordPress Codex

ページ中盤から、admin_footer やら comment_post やら、the_content やら the_title といった名称の羅列があると思います。これが WP に用意された hook になります。

プラグインはこの hook に対して機能を “追加定義” します。hook 名称を見れば一発で理解できます。

  • admin_footer であれば “管理画面のフッター出力時”
  • comment_post であれば “コメントが投稿された時”
  • the_content であれば “コンテンツ(エントリ)を出力する時”
  • the_title であれば “タイトル(エントリ名)を出力する時”

などなど自分が “働きたい場所” (hook)に、”動くときはついでにおれ(作ったプラグイン)を呼んでくれ” と定義するのがプラグインの”hook の登録” です。

hook には大きく、”データベース登録データを処理する” ものと”データはいじらずに画面上処理するもの” の二つがありますがここではとりあえず違いについての説明は省略します。

さて、この WP の hook ロジックにプラグインを登録するには WP で用意されている次の関数(Plug-in API)を使います。

add_action(‘hook_name’, ‘[関数名]’, [優先順位]);
add_filter(‘hook_name’, ‘[関数名]’, [優先順位]);

有効化しただけでなにかしらの変化が起きるプラグインは必ずこの2つの関数どちらかがあります。関数が2種類あるのは上で書きました、”データベース登録データを処理する” ものと”データはいじらずに画面上処理するもの”の差です。

引数にある [関数名] がプラグインのファイルのどこかに
定義されている function [関数名]() { で始まるブロック(関数)で、そのプラグインの動作の実体がかかれています。

誤解を恐れず言ってしまえば、プラグインを解析するときは、

  1. まずは、”add_” でプラグインファイルを検索
  2. hook の名前を見て “何のとき” に動くのかを確認
  3. [関数名]を確認
  4. “function [関数名]” で検索し、そこからプログラムを追う

ということになります。つかみさえ分かれば、あとは .php が分からなくてもきっと感覚でわかるでしょう。 🙂

別件、Plug-in API の引数に[優先順位] というのがあります。これは、hook の動く順を決めるパラメータです。プラグインは沢山ありますので当然同じ hook に複数のプラグインが登録されることは結構あります。また、WP 本体もこの hook ロジックで動いている部分があります。このようなときプラグインは同時に動かずに数珠つなぎに呼び出されていきます。この数珠の順番を明示的に指定するのが [優先順位] です。この数字が少ない方が先に動くようになります。省略時は、10 という値になり10 の中でプラグインは WP による登録順(つまり不定)で動くことになります。

もし、同じ hook をつかうプラグイン間で競合を起こした場合はこのパラメータを使って順番を変えるとうまくいくかもしれません。

さて、ここまでが hook を使うプラグインの説明でした。プラグイン的にはこちらが王道なわけですが、やりたいことによっては良い hook が無いかもしれません。また、画面を扱うプラグインではユーザが好きな位置になにかを挿入したがっているかもしれません。

そのようなときは、hook の登録をせずにやりたいことを書いた “関数”だけプラグインに書いておいて、使う人に、自分でテーマの中にその関数を呼び出すコードを書いてもらうという手があります。

今回のサンプルである「WordPress エントリをはてなブックマークに登録 – wp-hatena プラグイン -」は、”hook の登録” と “ユーザ用関数の登録” の両方をもつプラグインです。

後編では、実際のコードを使ってどのようにやるのかを説明したいと思います。あと、プラグインを書きやすくする小技がいくつかありますので、こちらも紹介。

おたのしみに…(←実は全部一度に書く時間が無くなった 🙂

[続き..]
WordPress プラグイン作成のノウハウ – 中編 –

WordPress エントリをはてなブックマークに登録 – wp-hatena プラグイン – リリース このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加

日記 - ひろまさ @ 1:19

せっかく “はてな” にアカウント登録したので・・・ということで、WordPress の各エントリを簡単に “はてなブックマーク” に追加できるイメタグを出力するプラグインを作ってみました。

ダウンロード

wp-hatena-ja_JP-UTF8.zip
wp-hatena-ja_JP-EUC-JP.zip
wp-hatena-ja_JP-Shift_JIS.zip

※バージョンがあがりましたので最新版は下記でダウンロードできます。

WordPress エントリをはてなブックマークに登録 – wp-hatena プラグイン正式版 – リリース

このサイトでも実働中です。 エントリ名の横に出力しています。

はてなブックマーク

お分かりの方も多いと思いますが、Castaway。さんのサイトを参考にさせて頂いてプラグインを作成しております。

はてなブックマーク用ボタンを追加@Castaway。さん

はてなブックマークを使い出したので、このBlogにもブックマークを追加するボタンやブックマークされたエントリを参照するボタンを追加してみました。

ありがとうございました。

このプラグインのインストール方法を書きます。

  • お使いのエンコードにあった、wp-hatena をダウンロード展開します。(”はてな” なのでi18n はしなかったのです..)
  • wp-content/plugins/ に wp-hatena ディレクトリごとアップロードします。 wp-content/plugins/wp-hatena/* にファイルが入るようにします。
  • プラグインを有効化します。
  • お使いのテーマの “エントリ表示部分” のどこかに以下のコードを挿入します。
  1.  <?php if(isset($wph)) $wph->addHatena(); ?>

以上でインストール完了です。 コードを挿入した部分に “B” 画像が表示されると思います。

コードを見て頂くと分かるのですが、Castaway。さんと同じように画像にマウスを当てると「はてなにエントリを追加する」というポップアップを JavaScript でだそうとしていました。 が、技術力不足でできませんでした。。プラグイン化のポイントだったのに・・・。

ヘッダに JavaScript を挿入するコードは残してありますので、分かる方は add_filter のコメントをハズして同梱の popup.js に実装してみてください。。 そしてぼくにください。 🙂

このサイトについて

このブログは引っ越しを行いコンテンツはフリーズしています。hiromasa.anotherへどうぞ。

Powerd By WordPress

We (Heart) WordPress

WordPressME Logo
WordPress Plugins

ブログ内検索

Todays Popular

WordPress Ring

はてなリング - WordPress -

情報

19 queries. 0.155 seconds.

このページの先頭へ