「WPtouch」を卒業して「WPtap Mobile Detector」でiPhoneなどモバイル端末用テーマを表示

ゴールデンウィーク中にサイトレイアウトを見直し、スマートフォンの表示をこれまで利用してきたプラグイン「WPtouch」からスマホ表示に最適化したテーマに変更しました。


「WPtouch」は、プラグインをインストールして有効化するだけで容易にスマホ表示へ対応出来ることから便利に使っていたのですが、人気プラグインのためどこのサイトも同じような表示となってしまうことや、本格的にカスタマイズしようとすると、それなりにソースを書き換える必要があるため、それなら別のテーマを使っても同じだよなと言うことで卒業を決めました。

WPtap Mobile Detectorで、指定したデバイスからのみ表示テーマを切り替え

「WPtouch」卒業を後押ししてくれたのは「WPtap Mobile Detector」というWordPressプラグインでした。このプラグインは、デバイス毎に表示テーマを選べるという便利な代物で、PC、iPhone、iPad、Android、Windows Phoneなど表示させたいテーマを個別に選択できるんです。更新間隔が空いていますが、WP 3.5.1でも問題無く使えます。便利です。

インストール方法は簡単で、WordPressのダッシュボードからプラグイン新規追加画面を選んで「WPtap Mobile Detector」を検索するとプラグインが出てきますので、インストールして有効化するだけ。後は設定画面から端末毎にテーマを選べばOK。

しかし1点だけつまづいたポイントがありました。

iOS端末はiPhone/iPodとiPadが分かれているのですが、Android端末に関しては選択項目がありません。タブレットとスマホでは画面サイズも違うので、分けれたら良いんだけどと思って検索し、参考にさせていただいたのがこちら。「ウェブという選択肢」さんの「WPtap Mobile DetectorでAndroid携帯とAndroidタブレットの表示を分ける良い方法」という記事で、割り振りの方法が掲載されていました。ありがとうございます。

Mobile Device name:にはAndroid-mo
Mobile Device agent:にはAndroid.*Mobileを指定

これを追加して指定しておけば、Androidのスマホとタブレットの振り分けができるようです。

モバイル表示用テーマを探す

Renova_WordpressTheme

さて、肝心のモバイル表示用テーマですが、今回は「Renova」というテーマを利用することにしました。PCにも対応しているテーマですが、これを当サイトのモバイル表示用にアレンジさせていただいて、あらかた形になったのでテーマフォルダにアップ。まだ調整箇所は残っていますが、アイキャッチ画像も入り、ある程度いい感じになりました。

WPtouchをオフにしてモバイルテーマを切り替え

IMG_6479
テーマをアップしたら、いよいよWPtouchを停止します。今までありがとう。そして、WPtap Mobile Detectorから端末毎に表示させたいテーマを選択していき移行は完了です。

share

耳で聴く読書 Audible

Audible (オーディブル) は、プロのナレーターや声優、著名人の朗読で本を聴ける、Amazonグループのボイスブック (オーディオブック) サービス。人気作家のベストセラーから名作まで、ビジネス書・自己啓発書・現代文学・ライトノベル・洋書などなど約 40 万冊がラインナップ。

初回 30 日間は無料で体験。コインが1枚付与され、好きなオーディオブック1冊と交換可能。毎月入れ替わるボーナスタイトル1冊も受け取れます。また聴き放題のポッドキャストも。

月額 1,500 円の有料会員になれば「好きなオーディオブック1冊と交換できるコイン」「無料でもらえる月替りのボーナスタイトル1冊」「聴き放題のポッドキャスト」を自由に楽しめます。

本は、聴こう。Audibleで最初の1冊を無料で体験。

Audible

Comments are closed.