twentytwelveとMobile Detectorによるスマホ対策

WordPressのバージョン3.5もいよいよ正式リリース間近（12月12日に日本語版がリリースされました）です。今回のバージョンの目玉のひとつは、標準テーマのTwenty Twelveですが、実は、WordPressの正式リリースを待たずして、Twenty Twelveを先行ダウンロードできるのです。

Twenty Twelveでは、PCやスマホなどのデバイスに応答して、表示を最適化するレスポンシブデザインが採用されています。このテーマをカスタマイズすれば、誰でも簡単にスマホ対応のテーマを作ることができるようになっています。

左のスクリーンショットは、このサイトのテーマをTwenty Twelveに変更して、iPhone4S上で表示したものです。

ご覧のとおり、シンプルで機能的なテーマなので、スマホやタブレットのことだけを考えるなら、このまま利用しても問題はないかもしれません。

ただし、これをPC用のテーマとしも使うとなると、少々話が違ってきます。ヘッダーにロゴを入れたり、ナビメニューの位置を変えたり、何かとPC用にカスタマイズしたくなります。カスタマイズの程度にもよりますが、場合によっては、スマホやタブレットでの表示が崩れることもある筈です。

また、PCで非レスポンシブデザインテーマを使っていて、これがとても気に入っている場合、レスポンシブ化のためだけに、Twenty Twelveをベースにテーマを書き換えるのかどうかという問題も起こるかもしれません。

そんなときお薦めしたいのが、Twenty TwelveとMobile Detectorというプラグインの組み合わせによるスマホ対策です。

Mobile Detectorのインストールと設定

WordPressにおける携帯対応の定番といえば、Ktai StyleとWPtouchというプラグインの組み合わせでしょう。WPtouchは今でも人気のあるプラグインのひとつですが、今回は、最もシンプルなスマホ対策をということで、Mobile Detectorというプラグインを使用することにします。

Mobile Detectorは、WordPressの管理画面上のプラグインメニューから新規追加をクリックし、Mobile Detectorで検索できます。

後は、「いますぐインストール」リンクをクリックすれば、インストールが始まり、Mobile Detectorが有効化されます。

設定メニュー中にMobile Detectorという項目が追加されていると思うので、これをクリックします。