この記事は最後に更新してから1年以上経過しています。

スマートフォン向けの振り分けを自前で行う

実際のところプラグインでいいんだどね

説明

PC向けのサイトをスマートフォン対応する場合、WPtouchやktai styleに代表されるスマートフォン対応のテンプレート切り替えプラグインを使用するのが一般的。そういったプラグインはテンプレート切り替え以外の機能も備えており、そういった機能は必ずしも必要ではない。そんなわけで、ここでは超シンプルなスマートフォン向けのテンプレート切り替えを実現する方法を紹介する。

template_includeフィルターを活用

テンプレートの振り分けを自身でコントロールする方法としては、template_includeフィルターを利用するのが手っ取り早い。具体的には、テーマ内のfunctions.phpにて、 add_filter関数を利用する。 
add_filter( 'template_include', 'mytheme_template_include' );

function mytheme_template_include( $template ) {
	if ( is_smart_phone() ) {
		$template_sp = str_replace( '.php', '-sp.php', $template );
		if ( file_exists( $template_sp ) )
			$template = $template_sp;
	}
	return $template;
}
このtemplate_includeフィルターはindex.phpやsingle.phpといったテンプレートファイルの振り分けを行う直前に実行されるフィルターで、フィルター関数（ここではmytheme_template_include関数）のパラメータ$templateには最終的にWordPressシステムが選択したテンプレートファイルのフルパス名が格納されてくる。is_smart_phone関数はユーザーエージェントからスマートフォン判定するローカル関数で（内容は後述）、スマートフォンの場合にテンプレートファイル名を'index.php'から'index-sp.php'のように変更している。 あとはPC向けテンプレートと同じように○○-sp.phpを準備すれば、ユーザーエージェントがスマートフォンの場合は○○-sp.phpのテンプレートファイルが切り替えられる。なお、該当する○○-sp.phpが存在しない場合は○○.phpになる。

スマートフォン判定

WordPressにはグローバル変数 $is_iphoneがあるが、Androidスマートフォンが対象にならないため、独自のスマートフォン判定を行うis_smart_phone関数を定義する。 
function is_smart_phone() {
	return preg_match( '/android.+mobile/i', $_SERVER['HTTP_USER_AGENT'] ) ||
		preg_match( '/iphone/i', $_SERVER['HTTP_USER_AGENT'] );
}
ここではiPhoneとAndroidスマートフォンならtrueを、それ以外はfalseを返す。Windows PhoneやBlackBerryスマートフォンなどを含める場合は、適宜それらの条件を追加する必要がある。またAndroidスマートフォン・タブレットの一部にはイレギュラーが存在するため、それらも正しく振り分けたい場合は個別に対応しなければならない。 テーマのスマートフォン対応をコンパクトに実現する方法は、ざっとこんな感じになる。スマートフォン向け、タブレット向けなど、サイトの目的に応じて自由にテンプレートファイルを振り分けたい場合は、こういった方法を選択してもいいのではないだろうか。

最終更新 : 2012年01月23日 19:54

関連

お勧め

the_archive_description（2018年5月27日 更新）

void the_archive_description( [ string $before = '' [ , string $after = '' ] ] )
アーカイブページの説明を表示する。

wp_localize_script（2018年5月27日 更新）

bool wp_localize_script( string $handle, string $object_name, array $l10n )
スクリプト向けの変数を追加する。

wp_is_site_protected_by_basic_auth（2021年2月5日 更新）

bool wp_is_site_protected_by_basic_auth( [ string $context = '' ] )
サイトがベーシック認証で保護されているか調べる。

get_post_time（2018年5月27日 更新）

mixed get_post_time( [ string $d = 'U' [ , bool $gmt = false [ , mixed $post = null [ , bool $translate = false ] ] ] ] )
パラメータ$dで指定されたフォーマットに従って投稿データの投稿時刻を取得する。

get_page_by_title（2018年5月31日 更新）

mixed get_page_by_title( string $page_title [ , string $output = OBJECT [ , string|array $post_type = 'page' ] ] )
指定されたタイトルの投稿情報を取得する。