【旧刊】WordPressテーマ制作のみを取り扱った別冊電子書籍がAmazon Unlimitedでお楽しみ頂けます!!
Amazon Unlimited内で 田中勇輔 で検索してください。

☓ 閉じる

8Mar2012

[WordPress] WPtouchカスタマイズ時の注意点

wptouchカスタマイズのポイント
当サイトでも使っているWordPressスマホ対応プラグイン[WPtouch]を使う際のポイントをいくつかご紹介します。

WPtouchは自動でスマートフォン用のサイトを生成してくれる必需プラグインですが、自動で生成される分、ミスがあると何週間も気づかないまま過ごしてしまいます。(←自分の事。。。)

僕も先月、WPtouch更新の際にgoogle analyticsトラッキングコードを設置するのを忘れたまま、アホな顔して3週間も過ごしてしまいました(・へ・)

超メジャープラグインですので個々のカスタマイズ方法は当サイト以外のすばらしいブログに任せて、今回は”注意点”に絞って紹介します。

1. デザイン変更時のポイント

1.1. テーマフォルダの構造

WPtouchのテーマフォルダを見てみると「default」という初期テーマ1つしかありません。

【テーマフォルダの位置】
/wp-content/plugins/wptouch/themes/default/

このdefaultを変更して使用してもいいのですが、それだとWPtouchの更新時にテーマが書き換えられてしまいます。

それを防ぐためにオリジナルのテーマフォルダを作成します。

1.2. オリジナルテーマフォルダの作成

全てをゼロから作る人はそういないと思います。

defaultテーマをコピーして複製しましょう^^

複製したテーマフォルダ名を変更します。
ここでは例として「tys_theme」とします。

/wptouch/themes/default/
/wptouch/themes/tys_theme/

これでオリジナルテーマフォルダが完成!

オリジナルテーマフォルダをカスタマイズしましょう!

1.3. 使用するテーマを指定する

作成したテーマを閲覧の際に読みこませるには、以下のファイルを変更します。

wp-content/plugins/wptouch/wptouch.php

650行目付近にある以下のソースを変更します

function get_stylesheet( $stylesheet ) {
		if ($this->applemobile && $this->desired_view == 'mobile') {
			return 'default';
		} else {
			return $stylesheet;
		}
	}
		  
	function get_template( $template ) {
		$this->bnc_filter_iphone();
		if ($this->applemobile && $this->desired_view === 'mobile') {
			return 'default';
		} else {	   
			return $template;
		}
	}

defaultフォルダを参照している部分を、さきほど作成したオリジナルフォルダ名に変えます

function get_stylesheet( $stylesheet ) {
		if ($this->applemobile && $this->desired_view == 'mobile') {
			return 'tys_theme';
		} else {
			return $stylesheet;
		}
	}
		  
	function get_template( $template ) {
		$this->bnc_filter_iphone();
		if ($this->applemobile && $this->desired_view === 'mobile') {
			return 'tys_theme';
		} else {	   
			return $template;
		}
	}

これで完成!

2. analytcisタグ設置のポイント

2.1. WPtouch設定画面から設置

WordPress管理パネル – 設定 – WPtouch

で表示されるWPtouchの設定画面で、analyticsのタグを設置できます。

WPtouchにanalyticsタグを設置

ここに記入したタグはbodyの最下部に設置されます。
googleが推奨するhead閉じタグ直前に設置したい場合は、次項で説明する手動での設置になります。

2.2. header.php内に手動で設置

以下のファイルを変更します。

wp-content/plugins/wptouch/themes/core/core-header.php

</head> の直前にanalyticsトラッキングコードを設置します。

この方法を使用する場合は重大な注意点がひとつ。

WPtouch自体を更新(バージョンアップ)する際に、このファイルは上書きされます。

僕もこれを忘れていて、先月、3週間にもわたってWPtouchのアクセスログが0になっていました><

みなさんも気をつけて下さい。

関連記事