hiromasa.zone : o)

ブログ - 日々の雑多なメモを日付順に記載しています。

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 PURPOSE.  See 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 にみるプラグインの作成方 – 後編 –

2 Comments

Trackback

  1. From: インタラクティブCG開発チーム | - 2008/10/21 Tuesday Daytime (Pingback)

    […] wp-hatena にみるプラグインの作成方 […]

  2. From: ブログ開発用メモ - 2008/11/26 Wednesday Daytime (Pingback)

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

Comment

このサイトはコンテンツをフリーズしました。トラックバック・コメントは閉じられています。

新しいサイトは、

hiromasa.another :o)

です。 :-)

最新の投稿へ

このサイトについて

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

Powerd By WordPress

We (Heart) WordPress

WordPressME Logo
WordPress Plugins

ブログ内検索

Todays Popular

WordPress Ring

はてなリング - WordPress -

情報

31 queries. 0.116 seconds.

webmaster@hiromasa.zone.ne.jp
このページの先頭へ