WordPress iPhone用のテーマを設定するプラグインの作り方

ちょっとしたサンプルを作成しながらの、WordPressプラグインの作り方チュートリアル。

プラグインの作り方

1. プラグインの名前を決める

まずはプラグインの名前を決めます。
他のプラグインと重複しない唯一の名前にしましょう。現在公開されているプラグイン名はこちらで検索→プラグイン/WordPressCodex日本語版

2. プラグインファイルを作成

プラグイン名に由来する名前のPHPファイルを作ります。
ファイルは必ず UTF-8 エンコードにします。

標準プラグイン情報の記述

プラグインファイルの先頭に、標準プラグイン情報を記述します。Plugin Name のみ必須です。
これを記述することで、WordPress にプラグインとして認識され、プラグイン管理画面に表示されます。

<?php
/*
Plugin Name: (プラグインの名前)
Plugin URI: (プラグインの説明と更新を示すページの URI)
Description: (プラグインの短い説明)
Version: (プラグインのバージョン番号。例: 1.0)
Author: (プラグイン作者の名前)
Author URI: (プラグイン作者の URI)
License: (ライセンス名の「スラッグ」 例: GPL2)
*/
?>

ライセンスの記述

標準プラグイン情報の次に、プラグインのライセンスを記述します。
多くのプラグインは WordPress と同じ GPL2、ないし GPL2 互換のライセンス (英文) を用いています。
GPL2 ライセンスを示すには、以下の行を記述します。
GPL は英文でのみ効力を持ちますので、プラグイン作者名もローマ字で記載しましょう。

<?php
/*  Copyright (作成年) (プラグイン作者名) (email : プラグイン作者のメールアドレス)

	This program is free software; you can redistribute it and/or modify
	it under the terms of the GNU General Public License, version 2, as
		published by the Free Software Foundation.

	This program is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
	GNU General Public License for more details.

	You should have received a copy of the GNU General Public License
	along with this program; if not, write to the Free Software
	Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
*/
?>

3. WordPress のプラグインディレクトリに配置

WordPress のプラグインディレクトリ「/wp-content/plugins」に配置します。
WordPressの管理画面からプラグインが認識されているのを確認してください。
そして有効化。

※公式プラグインディレクトリでホスティングしたければ

readme.txt ファイルを、定められた書式で作成して、プラグインに含める必要があります。
また、プラグインのコードは WordPress コーディング基準に従うことが推奨されます。
その他、推奨事項はいくつかあるので、詳しくは プラグインの作成/WordPressCodex日本語版 などを参照してください。

iPhone用のテーマを設定するプラグインを作る

概要

・通常のテーマとは別に、iPhone用のテーマを設定する。
・iPhoneでアクセスされた時、設定したiPhone用のテーマが適用される。

ファイル構成

 hijiri-itheme
 - hijiri-itheme.php (本体)
 - hijiri-itheme-option-menu.php (オプションページのテンプレート)

コード

> hijiri-itheme.php

<?php
/*
Plugin Name: hijiri iTheme
Plugin URI: http://hijiriworld.com/web/
Description: Select theme for iPhone
Version: 0.1
Author: hijiri
Author URI: http://hijiriworld.com/web/
*/

/*  Copyright 2012 hijiri

    This program is free software; you can redistribute it and/or modify
    it under the terms of the GNU General Public License, version 2, as
	published by the Free Software Foundation.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program; if not, write to the Free Software
    Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
*/

if (isset($_POST['submit'])) {
	$h_itheme = $_POST['h_itheme'];
	update_option('h_itheme', $h_itheme);
} else {
	$h_itheme = get_option('h_itheme');
}

if ((strpos($_SERVER['HTTP_USER_AGENT'], 'iPhone'))) {
	add_filter('stylesheet', 'get_h_itheme');
	add_filter('template', 'get_h_itheme');
}
function get_h_itheme() {
	$h_itheme = get_option('h_itheme');
	$themes = get_themes();
	foreach ($themes as $theme) {
		if ($theme['Name'] == $h_itheme) {
			return $theme['Stylesheet'];
		}
	}
}

add_action('admin_menu', 'my_admin_menu');
function my_admin_menu() {
	add_theme_page('iPhone テーマ', 'iPhone テーマ', 'manage_options', basename(__FILE__), 'my_admin_page');
}
function my_admin_page() {
	include('hijiri-itheme-option-menu.php');
}
?>

> hijiri-itheme-option-menu.php

<?php if (isset($_POST['submit'])) : ?>

	<div class="updated">
		<p><?php _e('Options saved.' ); ?></p>
	</div>

<?php endif; ?>

<div class="wrap">
	
	<div id="icon-themes" class="icon32"></div>
	
	<h2>iPhone テーマ</h2>
	
	<p>
		<form name="h_itheme_form" method="post" action="<?php echo $_SERVER['REQUEST_URI']; ?>">
			<select name="h_itheme">
				<?php $h_itheme = get_option('h_itheme'); $themes = get_themes(); foreach ($themes as $theme) : ?>
					<?php if (($h_itheme == $theme['Name']) || (($h_itheme == '') && ($theme['Name'] == get_current_theme()))) : ?>
						<option value="<?php echo $theme['Name']; ?>" selected="selected"><?php echo $theme['Name']; ?></option>
					<?php else : ?>
						<option value="<?php echo $theme['Name']; ?>"><?php echo $theme['Name']; ?></option>
					<?php endif; ?>
				}
				<?php endforeach; ?>
			</select>
			<input type="submit" name="submit" class="button-primary" value="設定" />
		</form>
	</p>
	
</div>

解説

管理画面にオプションメニューとオプションページを追加

・オプションページのテンプレート hijiri-itheme-option-menu.php を作成。
・管理画面 > 概観 に「iPhone テーマ」というオプションメニューとオプションページを追加する関数を定義。
・admin_menu アクションにフック。

> hijiri-itheme.php [48-54]

add_action('admin_menu', 'my_admin_menu');
function my_admin_menu() {
	add_theme_page('iPhone テーマ', 'iPhone テーマ', 'manage_options', basename(__FILE__), 'my_admin_page');
}
function my_admin_page() {
	include('hijiri-itheme-option-menu.php');
}

add_theme_page – 外観メニューにサブメニューを登録する

iPhone用のテーマ名をオプション値として保存

・設定したiPhone用のテーマを WordPres データベースに保存しておくため、「h_itheme」という名前の独自オプションを作成
・オプション値の保存は update_option() 、取り出しは get_option()

> hijiri-itheme.php [27-32]

if (isset($_POST['submit'])) {
	$h_itheme = $_POST['h_itheme'];
	update_option('h_itheme', $h_itheme);
} else {
	$h_itheme = get_option('h_itheme');
}

add_option WordPress 設定機構/WordPress Codex 日本語版

iPhoneからのアクセス時にテーマを切り替える

・保存されているオプション値(h_itheme)から、iPhone用のテーマを適用する関数を定義
・$_SERVER[‘HTTP_USER_AGENT’] でエージェントを判別
・エージェントがiPhoneだった場合、stylesheet と template フィルターにフックして、テーマを切り替え。

> hijiri-itheme.php [34-46]

if ((strpos($_SERVER['HTTP_USER_AGENT'], 'iPhone'))) {
	add_filter('stylesheet', 'get_h_itheme');
	add_filter('template', 'get_h_itheme');
}
function get_h_itheme() {
	$h_itheme = get_option('h_itheme');
	$themes = get_themes();
	foreach ($themes as $theme) {
		if ($theme['Name'] == $h_itheme) {
			return $theme['Stylesheet'];
		}
	}
}

iPhone用のテーマを設定したら「設定を保存しました。」ダイアログを表示

> hijiri-itheme-option-menu.php

<?php if (isset($_POST['submit'])) : ?>

	<div class="updated">
		<p><?php _e('Options saved.' ); ?></p>
	</div>

<?php endif; ?>

コメントを残す