WordPressプラグイン「WPtouch」で、このサイトをスマホ対応にしました。WPtouchの導入前後で、スマートフォン画面にてどのような差異があるのかを試してみたくて導入してみた次第です。比較画像も載せていますので参考にしてみてください。
導入前後の比較
まず、WPtouch導入前にスマートフォンでアクセスした時の画面は以下のような感じです。
※左側の画像はトップページの上部、右側の画像は少しスクロールした部分です。
![]() |
![]() |
構造的にメニューが3行になってしまったり、SNSリンクが変な感じになったり、違和感があります。微妙な感じです。
では、次に、WPtouch導入後にスマートフォンでアクセスした時の画面は以下のような感じです。(WPtouchの設定はほぼデフォルトのままの場合です。)
※左側の画像はトップページの上部、右側の画像は少しスクロールした部分です。
![]() |
![]() |
おっ!スマホ用に最適化された感じがヒシヒシとします!
WPtouchの導入方法
通常のプラグイン導入方法と同じです。
# cd /usr/local/src # wget http://downloads.wordpress.org/plugin/wptouch.zip # unzip wptouch.zip # mv wptouch /(WordPress公開ディレクトリ)/wp-content/plugins/
この後、プラグイン管理画面でWPtouchを有効化します。
基本的には以上の操作で、スマホ対応が完了してしまいます。
WP Super Cache を利用している場合
WordPressプラグイン「WP Super Cache」を利用している場合は、「WPTouch plugin detected! Please go to the Supercache plugins page and enable the WPTouch helper plugin.」と表示されます。
以下の手順を実行すると、このメッセージは表示されなくなりました。
- WP Super Chache の設定画面で、「プラグイン」タブを表示します。
- WPTouch の「有効」ラジオボックスにチェックを入れて、「更新」ボタンをクリックする。
WPtouch設定
WPtouchの設定画面では、いくつか設定項目がありますので用途に合わせて設定変更する事が可能です。
私的には、設定画面で変更できる項目だけでは事足りない箇所もありましたので、個別ファイルでのカスタマイズを今後する形になりそうです。しかし、WPtouchは引き続き使ってみようかと考えています。