wptouchのスマートフォン表示がうまく出来ない、機能しない場合は｢W3-Total-Cache｣の設定を確認しよう!

作成日：2014-8-25

wordpressのブログをスマートフォンに対応する場合wptouchプラグインを利用する場合が多い。wptouchとW3-Total-Cacheプラグインを併用した場合に、うまく表示出来ない/機能しない等の症状が発生します。

wptouchはブログを簡単にスマートフォン表示するため定番のプラグインです。一方W3-Totoal-CacheはWordpress(ワードプレス）で作成されたブログを高速に表示するためのキャッシュプラグインですが、wptouchはW3-Total-Cache上では動きませんので、wptouchを除外設定しないとうまく表示できない/機能しない等の表示障害が発生します。たとえば、

スマートフォンにPCの画面が表示される
Javascript,CSSの設定動作がおかしい　等々

これらは、wptouchがうまくキャッシュ表示に対応出来ていないためで、W3-Total-Cacheにスルー表示するように除外設定をしなければなりません。

実行環境

本説明は以下のバージョンでおこなっています。これ以外のバージョンでは画面表示等が異なることがありますのでご注意ください。

wptouch(wptouch mobile plugin) Ver3.4.5
w3-total-cache Ver 0.9.3

wptouchを除外設定する

これらの症状を解消するためには、ユーザーエージェントで判別してスマートフォン表示かどうかを判断し、スマートフォン表示の場合にはW3-Total-Cacheは使用しないようにします。W3-Total-Cacheに設定する項目は以下の

PageCache
UserAgentGroup

になります。

PageCacheにユーザーエージェントを設定

上記の画面のとおり、管理画面の左のメニューから[Performance]>[PageCache]と選択し、Rejected user agentsにユーザーエージェントを入力します。入力するユーザーエージェントは後述します。

入力するユーザーエージェント

Rejected user agentsには以下の項目を入力します。

acer s100
android
archos5
bada
blackberry9500
blackberry9530
blackberry9550
blackberry 9800
cupcake
docomo ht-03a
dream
froyo
googlebot-mobile
htc hero
htc magic
htc_dream
htc_magic
iemobile/7.0
incognito
ipad
iphone
ipod
kindle
lg-gw620
liquid build
maemo
mot-mb200
mot-mb300
nexus one
opera mini
s8000
samsung-s8000
series60.*webkit
series60/5.0
sonyericssone10
sonyericssonu20
sonyericssonx10
t-mobile mytouch 3g
t-mobile opal
tattoo
webmate
webos