WordCamp Yokohama 公式サイトの作り方 – プラグイン編 (1)

コメントを残す

WordCamp Yokohama 公式サイトが、ようやく公開されました。
この公式サイト構築にあたり、専用プラグインを作ったり、既存のプラグインのカスタマイズを行ったりしたので、ざっくりと紹介させていただきます。
公式サイトのテーマに付いては、きっとおでこんのサイトで解説してくれると思うよ。

このサイトを構築するにあたり、WordPress コアソースに手を入れたりはしていません。
素のままの WordPress 2.9.2 に公開されているプラグインを追加したり、新規でプラグインを作成したりして構築されています。

WordCamp Yokohama 公式サイトを構築した際、使ったプラグインは以下の15個です。

まずは、既存プラグインの紹介から

Akismet

コメントSPAM対策用プラグイン WordPress をインストールすると付いてきます。
使用するには WordPress.com に登録して API キーを取得する必要があります。

Contact Form 7

Contact Form 7WordPress サイトにお問い合わせフォームを追加するプラグインです。
類似のプラグインは数あれど、その中でも一番メジャーなプラグイン。
お問い合わせページで使用しています。

WP FollowMe plugin

WP FollowMeTwitter アカウントへの Follow Me バッジを表示するためのプラグインです。
Follow Me バッジは Flash で実装されているため iPhone, Android, BlackBerry では、これを表示しないように以下のコードをプラグイン冒頭に追加しました。

$ua = $_SERVER{'HTTP_USER_AGENT'};
if ( preg_match('/(blackberry[0-9]+|\(ip([oa]d|hone);|android)/i', $ua) ) {
	return FALSE;
}

Google Maps Anywhere

Google Maps Anywhere拙作の Google Maps 連携プラグインです。
最新バージョンでは、マイマップにも対応しています。
# ただし、マイマップの使い方がイマイチ面倒なので、バージョンアップしてもうちょっと簡単に使えるようにしようと思ってます。
アクセス・会場案内ページで使用しています。

Head Cleaner

Head Cleaner拙作の WordPress サイト高速化用プラグイン。
WordPress サイトの <head> の中身と、フッタ領域を整形しなおします。
YSlow で良いランクを取れるように CSS と JavaScript を結合したり、自動で再配置したりしてくれるます。
導入するだけで YSlow ランクが一つくらいは上昇しますよ。

Ktai Style

WordCamp Yokohama 2010WordPress を携帯電話からアクセスされた時、携帯電話用に最適化されたテーマを表示させる定番プラグインです。
今回は、Ktai Style 作者のゆりこさんが、専用のテーマを作りこんでくださいました。

Maintenance Mode Plugin

WordCamp Yokohamaメンテナンス中、読者によるサイトへのアクセスをブロックし、お知らせページを表示するプラグインです。
ログインしている登録ユーザーは、通常通りサイト・管理画面を見ることができます。
日本語リソースは WordPress Plugins/JSeries から入手できます。
WordPress Plugins/JSeries » Maintenance Mode 日本語リソース

RandomText

Random text登録してあるテキストをランダムで表示するウィジェットプラグインです。
サイドバーのスポンサー表示とスピーカー表示に使われています。

Twitter Hash Tag Widget

指定した Twitter のハッシュタグ検索結果を表示するためのウィジェットプラグインです。
サイドバーに WordCamp Yokohama のハッシュタグ #wcYokohama の検索結果を表示するために使われています。

WordPress.com Stats

WordPress のアクセス解析用プラグイン、これも定番ですね。
使用するには、Akismet と同様に WordPress.com に登録して API キーを取得する必要があります。

WP-Cycle Plugin

jQueryのスライドショー表示プラグインJQuery Cycleを使用して、スライドショー表示をするためのプラグインです。
トップページで使用しています。
今回は、最初に WordPress ロゴを表示し、その後ランダムでスライドショー表示させる(しかも、その写真セットの中には最初のWPロゴを含めない！)という我侭仕様に対応するために、JavaScript部分を以下のように書き換えています。

jQuery(function($) {
	setTimeout( function(){
		$("#<?php echo $wp_cycle_settings&#91;'div'&#93;; ?>").fadeOut(<?php echo (int)(($wp_cycle_settings&#91;'delay'&#93; * 1000) / 3); ?>, function(){
			$('img:first', $(this)).remove();
			$(this)
				.fadeIn(<?php echo (int)(($wp_cycle_settings&#91;'delay'&#93; * 1000) / 3); ?>)
				.cycle({ 
				    fx: '<?php echo $wp_cycle_settings&#91;'effect'&#93;; ?>',
				    timeout: <?php echo ($wp_cycle_settings&#91;'delay'&#93; * 1000); ?>,
				    speed: <?php echo ($wp_cycle_settings&#91;'duration'&#93; * 1000); ?>,
				    pause: 1,
				    random: 1,
				    fit: 1
				});
		});
	},
	<?php echo (int)(($wp_cycle_settings&#91;'delay'&#93; * 1000) / 3); ?>
	);
});

jQuery.cycle が動作する前に一枚目のWPロゴを remove しているわけです。

WP Multibyte Patch

WordPress のマルチバイト文字の取り扱いに関する不具合の累積的修正と強化を行うプラグインです。
WordPress 日本語版をインストールすると付いてきます。
有効化していない人は、有効化すると幸せになりますよ。

WPtouch: Mobile Plugin + Theme for WordPress

iPhone, Android 等からアクセスされた時、スマートフォン用に最適化されたテーマを表示させる定番プラグインです。
今回は、自サイトで WPTouch 用の独自テーマを配布したりもしているEternal-tearsさんが、専用のテーマを作りこんでくださいました。

公式サイト用に新規作成したプラグイン Custom Profile, Custom Register については、次回解説します。

[4/28 12:30 追記]
おでさんが WordCamp Yokohama 公式サイトで使用したプラグインのうち彼が選択したプラグインについて、自サイトで解説してくれました。
WordCamp 公式サイトに使った7個のプラグインとテーマ | Odysseygate.com

コメントを残す

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。