[WP] プラグインを試す

[069] カスタムフィールドテンプレートの便利な機能色々

WordPressのプラグイン「カスタムフィールドテンプレート(Custom Field Template)」は投稿するときカスタムフィールドの入力を支援する、とても有名なプラグインです。

WordCampNagoya2010 のライトニングトークで作成者の宮下さんがされた「Custom Field Template プラグインの使い方」(右図)の便利な機能を、遅ればせながら試してみました。
WordCampNagoya2010 発表についてはこちら


続きを読む

[064] WordPressプラグイン鬼太鼓を試してみた

WordBench埼玉での発表で、マルチサイトの子テーマの最新投稿をまとめて親サイトに表示してくれる便利なプラグイン「鬼太鼓(oni daiko)」の発表が作者の@webnist さんありましたので試してみました。

鬼太鼓のインストールと設定

鬼太鼓は公式プラグインとして登録されているので、プラグイン新規登録画面で「oni daiko」で検索して、インストールします。そして、最新投稿をまとめて表示したいブログで有効化します。

すると、管理メニューの下に鬼太鼓が表示され、ここから基本設定で以下の設定が可能になります。

続きを読む

[063] 子サイトに独自ドメイン(マルチサイト)

WordPressを勉強するコミュニティであるWordBenchのひとつ「WordBench埼玉」に参加しました。

WordPress3.0からWordPress MUを統合して導入されたマルチサイトがテーマで、マルチサイトのURLで様々な独自ドメインに設定できるプラグイン「WordPress MU Doman Mapping」のインストールや設定方法について発表があったのでローカル環境で試してみました。

マルチサイトではサブドメイン型で登録するとURLはサブドメイン名のみ設定できます。WordBench埼玉で発表のあったプラグイン「WordPress MU Doman Mapping」では、好きなURLを登録できるようになるという、とても便利なプラグインです。

まずはプラグイン「WordPress MU Doman Mapping」をインストールして有効化します。



すると、Domain mapping database table が作成されます。
そして、特別管理者のサブメニューに「Domain Mapping」と「Domains」が追加され、開くと指示が表示されるので実行します。

  1. プラグインフォルダの sunshine.php ファイルを wp-content にコピー
  2. wp-config.php にdefine( ‘SUNRISE’, ‘on’ ); を追加



続きを読む

[050] 関連する投稿へのリンクを表示する

関連する投稿のリンクを表示させたいと思い、プラグイン 「WordPress Related Post for Japanese」をインストールしました。インストールしたのはずいぶん前で、どのような関連記事が表示されるのかと様子を見ていたのですが、非常にいい感じで関連する記事を表示してくれています。ありがとうございます。

WordPress Related Post for Japanese
WordPress Plugins/JSeries で見つけました hiromasa さん作成のプラグインです。
WordPress Plugins/JSeries

Yahoo! Japan が提供する日本語形態素解析APIを利用して投稿の下に「関連する記事」へのリンクを付与してくれているそうです。
続きを読む

[038] Twitterのハッシュタグも表示

Twitterのハッシュタグも表示できるように、Twitetrを表示するウィジェットを更新してみた。右下のサイドバーにハッシュタグ #wordpressjp のTwitterタイムラインを3件表示させてみました。

TwitterのハッシュタグのRSSをどうやって取得すればよいか調べていたら、以下のように search.rss とするとできることが判明!Twitetr は色々できるな~。
http://search.twitter.com/search.rss?q=#wordpressjp

さて、これを取得して表示できるようにウィジェットを更新した。ついでにユーザ名やハッシュタグをウィジェット設定画面から記入できるようにしてみた。

続きを読む

[037] Twitter 表示ウィジェットを作る

Tweetable を導入して表示してみたのに続いて、Twitter を表示するウィジェットを自分で作ってみた。サイドバーに Tweetable(上)と自作(下)をふたつ表示させてみたが、なんとかうまくいったようだ。

作成方法は Twitter のRSSを取得して、それを simplexml_load_file でパースして表示するというもの。表示するCSS設定はTweetableのものを流用してみた。

まずは WP_Widget を継承する wp_widget_twitter クラスを定義した。

class wp_widget_twitter extends WP_Widget {
   function wp_widget_twitter() {
      $widget_ops = array( 'classname' => 'widget_twitter', 'description' => __( "wiget for display twitter" ) );
      $this->WP_Widget('widget_twitter', __('widget_twitter'), $widget_ops);
   }



さらに関数 widget ($args, $instance) でウィジェットに表示する仕組みをコーディングした。

続きを読む

[036] Tweetable でTwitter表示

Twitterをウィジェット表示したいと思い探してみたところプラグインが色々あり、Tweetable を試してみた。

導入手順は以下のサイトに詳しく書いたものを参考にさせてもらい、とても助かった。
Twitter連携用プラグインTweetableが便利すぎる!

Twitter のアプリ登録での入力内容は Tweetable の説明(英語)をよく読む必要があったが、導入手順にしたがって登録をおこなったところ、問題なく導入できた。

<Tweetable の導入時の説明(英語)>
You do not need to upload an icon. It’s entirely optional, and chances are nobody will see it.

  1. Enter your blog’s name in the Application Name field.
    あなたのブログ名をアプリケーション名に記入する
  2. Put a brief description of your blog in the Description box. Just a few words to identify the application.
    あなたのブログの簡潔な表現をアプリケーションの説明に入力する
  3. Your blog’s URL should go in the Application Website field. (E.g. http://www.webmaster-source.com.)
    アプリケーションウェブサイトURLにあなたのブログのURLを入力する
  4. Leave the Application Type as Browser.
    アプリケーションの種類をブラウザアプリケーションにする
  5. In the Callback URL field, paste http://experiment.street-square.com/xxxxxxxx
    コールバックURLに(表示されたURL)を張り付ける
  6. Set Default Access type as Read & Write.
    Default Access type に Read & Write を設定する
  7. Press the Save button, then come back here and continue the setup wizard.
    保存ボタンを押して、ここに戻りセットアップウィザードを続ける

次は管理画面の右メニューのTwitter>settings から Tweetable を設定する。今回は表示のみで使用しようと考えているので、Auto-Tweet Posts のチェックボックスをはずして保存した。

さらに、外観>ウィジェットからTweetable を選んでサイドバーにセットして表示させるとともに(Title Number of Tweets Show を2に変更)、表示形式を他のウィジェットにそろえた。
  1. main_css.css でスタイルを変更
    .tweetable_latest_tweets li のlist-style:none を削除
    .tweetable_latest_tweets のマージンを変更 margin: 6px 6px 0 1.3em;
  2. tweetable.php で ol を ul に変更

CSS設定で「border-bottom:1px dashed #9a9898;」とすると破線を下線として引けるのは気付かなかった。これは便利なので使わせてもらおう。

[032] ショートコードを試す

WordCamp Yokohama で Wokamoto さんの発表をせっかく見たので、紹介されていたショートコードについても試してみる。

ショートコードのハンドラ関数を、wokamoto さんの発表で紹介されたコードを少し変更して Twiiter のように URL を記載するとリンクが自動的に張られるようにしてみた。

shortcode_atts( $defaults_array, $atts ) は欠けている属性にデフォルト値を付与し、ショートコードで認識されない属性をすべて取り除いてくれる、とても便利なヘルプ関数です。また、extract はPHP関数で配列を変数にインポートしてくれます。
(出典)ショートコードAPI – WordPress Codex 日本語版

function custom_shortcode_url($atts, $content = null) {
  extract(shortcode_atts(array(
    'href' => $content ,
    'title' => '' ,
  ), $atts));
  $href  = esc_attr($href);
  $title = esc_attr($title);
  if(!empty($title)) {
    $code ='<a href='.$href.' title='.$title.'>'. $content.'</a>';
  } else {
    $code ='<a href='.$href.'>'.$content.'</a>';
  }
  return $code;
}
add_shortcode("url", "custom_shortcode_url");



↓試しに[URL]http://experiment.street-square.com/[/URL] と書いてみたら、確かにリンクを自動で張ることができている。
http://experiment.street-square.com/

[031] プラガブルファンクション

プラグインの作成をおこなうにあたり、まず WordCamp Yokohama で Wokamoto さんが紹介して下さったプラガブルファンクションについて復習してみた。

プラガブルファンクションとはプラグインで定義することで置換可能なプラグインで、次のように定義されているとのことでしたので調べてみた。

  1. wp-includes/pluggable.php で定義されている

    → pluggable.php は有効なプラグインの読み込み終了後に読み込まれる
  2. if ( !function_exists(‘関数名’) ) : ~ endif; の間で定義される

    → 関数が存在する場合は読み込まない(プラグインの関数の方が有効となる)

<wp-includes/pluggable.php>
if ( !function_exists('wp_get_current_user') ) :
/**
 * Retrieve the current user object.
 *
 * @since 2.0.3
 *
 * @return WP_User Current user WP_User object
 */
function wp_get_current_user() {
	global $current_user;

	get_currentuserinfo();

	return $current_user;
}
endif;




実際に wp-includes/pluggable.php に定義されていたのは以下の 40個の関数でした。さて、どれを置換してプラグインを作成しよう・・・。

続きを読む

[027] iphone でプラグイン作成

Wordbench東京では雨だったので重いノートパソコンを持っていかなかったが、実はワークショップ形式だった(告知の記載をきちんと読んでいなかった・・・)。

そこで、iphone+ロリポップ(+ムームードメイン+イーモバイル)でコーディングすると、快適だったので紹介。

今回はサイトからテンプレート(zip形式)をダウンロード&編集し、WordPressにプラグインとして登録する。

ロリポップ!FTPではファイルを編集できるので、iphone でできない下記の2点ができれば開発ができる。
(1) zipファイルをダウンロードできない
(2) FTPでファイルをアップロードできない

そこで、AppStore から GoodReader for iphone(115円)をインストールして以下のように使用。

  1. iphoneではダウンロードできないzipファイルをダウンロード
    WebDownloads>Enter URL で該当URLを入力
  2. FIPでロリポップに接続してzipファイルをアップロード
    WebDownloads>Connect to Servers>FTP Server で設定&アップロード
    (1) Readable Title : アプリ上での表示名
    (2) URL-address : ロリポップのFTPサーバ名
    (3) User : ロリポップのユーザ名
    (4) ロリポップのパスワード
    (5) Encodeing : UTF-8
  3. ロリポップ!FIPでzip ファイルを解凍
  4. ロリポップ!FIPで plugin-template.php ファイルを開いて iphone で編集

WordBench東京の発表にしたがい、iphone で以下のようなプラグインを作成した。
(1) 画面左下に「copyright ©2010 all right reserved.」と表示される
(2) 投稿文の「ワードブレス ワードプレス」は「ワードブレス WordPress」と表示される

続きを読む

[024] プラグイン作成でクラスを活用

WordPress で公開されているプラグインの多くはクラスを用いて実装されている。WordBench東京ではプラグイン開発の発表があり、最後にCLASSについても言及していただいたので紹介する。(※以下は、発表を聞いたうえでの私の理解に基づいた記載になります)

右図はWordBench東京のページにリンクしていて、そこから発表資料がダウンロードできる。


  1. 子クラスは親クラスを継承することで、親クラスの機能を拡張して活用することができる。
  2. 親クラスのメソッドや変数をオーバーライド(上書き)することができる
  3. クラス名->メソッド(関数)、クラス名->変数 と指定して呼び出すので名前空間を汚さない
    関数名や変数名の重複の恐れを排除できる
  4. コンストラクタでインスタンスを生成する(実体化する)
    ※コンストラクタの方法はPHP4 から PHP5 で変更されている

親クラス: クラス宣言して親クラスを定義する
class sample_class_base {
	
	var $hoge = 'hoge';

	function override() {
		return 'base';
	}
	
	function base() {
		return 'base';
	}
	
	function get( $var ) {
		if ( isset( $this->$var ) ) {
			return $this->$var;
		}
	}
}


Copyright 2010 Prime Strategy co.,ltd.

子クラス:親クラスを継承し、関数や変数を拡張し、コンストラクトしている。
/*
Plugin Name: plugin extend sample
Plugin URI: http://www.example.com/sample-plugin/
Version: 1.0.0
Description: plugin description
Author: author name
Author URI: http://www.example.com/
Text Domain: sample_plugin
Domain Path: /language
*/

require_once( dirname( __FILE__ ) . '/plugin-class-base.php' );

class plugin_extend_sample extends sample_class_base {
	
	function __construct() {
		add_action( 'wp_footer', array( &$this, 'footer_hook' ) );
	}
	
	function plugin_extend_sample() {
		$this->__construct();
	}
	
	function override() {
		return 'extend';	
	}
	
	function footer_hook() {
		var_dump( $this->override() );

		var_dump( $this->base() );

		var_dump( $this->get( 'hoge' ) );
	}
	
	function the_content() {
	}
}

$plugin_extend_sample = new plugin_extend_sample();


Copyright 2010 Prime Strategy co.,ltd.

[023] フィルターフックとアクションフック

WordBench東京が台場区民センターで開催され、アクションフィルターとアクションフックについて発表があったので、その仕組みについて紹介する。

フィルターフックとアクションフックは apply_filter や do_action が定義された箇所で実行する処理を add_filter と add_action で追加して実行させる仕組み。前者は戻り値があり、後者は戻り値がない点で異なる(※当サイトにはフィルターフックとアクションフックを使ったった記事があります)

フィルターフック
add_flier で定義した関数を apply_filter で呼び出す。

<add_filter:wp-includes/plugin.php>
add_filter ではグローバル変数 $wp_filter にアクションフィルターやアクションフックの情報を登録している。

function add_filter($tag, $function_to_add, $priority = 10, $accepted_args = 1) {
	global $wp_filter, $merged_filters;

	$idx = _wp_filter_build_unique_id($tag, $function_to_add, $priority);
	$wp_filter = array('function' => $function_to_add, 'accepted_args' => $accepted_args);
	unset( $merged_filters );
	return true;
}


$tag :アクション名(初期値なし)
$function : 呼び出す関数名(初期値なし)
$priority : 呼び出す優先順位(小さいと優先順位が高い、初期値10)
$accepted_args :パラメーターの数(初期値1)

アクションフック
add_action で定義した関数を、do_action で呼び出す。

<add_action:wp-includes/plugin.php>
add_action は add_filter に処理をさせて、自身は処理をしていない。
function add_action($tag, $function_to_add, $priority = 10, $accepted_args = 1) {
	return add_filter($tag, $function_to_add, $priority, $accepted_args);
}



このため、add_action で定義した結果も add_filter で定義した結果も両方、$wp_filter が保持することになる。これについては、のちほど当記事に詳細を追記する。

[016] カスタム投稿タイプとCustom Field Template


カスタム投稿タイプでカスタムフィールドを定義したものの、やはり便利な Custom Field Template を使いたいということで試してみた。

カスタムフィールドテンプレートの設定で投稿タイプに「投稿」を選ぶと、カスタムポストタイプにカスタム投稿タイプ名を入れてもカスタムフィールドには表示されない。そこで投稿タイプを「両方」のままにすると無事、登録したカスタムフィールドが表示された(右図)。

カスタム投稿タイプの定義にて作成した①「東京風景‐属性」と、CustomFieldTemplateで設定した②「カスタムフィールドテンプレート」というふたつのカスタムフィールドが表示されている。カスタムフィールドテンプレートは③の通り、複数のテンプレートを設定し、選択して使用することができる。う~む、設定のショートコードといいすごくよくできている!!

実際にデータベースに登録されていることも確認できたので、カスタム投稿タイプの表示画面など、工夫しながら色々試してみよう。

[008] welcart を試してみた

カスタムフィールド、、カスタムタクソノミーを組み合せたカスタム投稿タイプ作りで煮詰まり、
約半月のあいだブログを更新できなかったので、まずはプログラミング実習室で教えてもらった
welcart(プラグイン)の実践してみた。とても、よくできているな~。でも、まだまだ設定しなきゃいけないことがありそう・・・。

  • プラグイン welcart をインストール
  • テーマを welcart に変更
  • 商品マスタを登録 → 結果はこちら

プログラミング実習室ではこちらでお試しさせていただいた
http://skyshop.jp/
maki.skyshop.jp (アカウント作成し、商品登録した結果)

[003] カスタムタクソノミー(Custom Taxonomy)

カスタムタクソノミーの登録プラグイン「Custom Post Type UI」を導入して、お知らせ、お薦め、サンを管理するカスタムタクソノミー「information」を作成。すると、投稿のサブメニューに「通知」が表示されるようになったので、「通知」にお知らせ、お薦めを追加した。

投稿画面に表示される「通知」ボックスの「+Add New 通知」ボタンからも登録が可能だが、こちらは名前とslugが同じで説明は登録できない(投稿のサブメニューから編集できる)

こんどは、タクソノミーの一覧画面を作ってみよう。