意外とないもんやなぁ、モバイルシュミレーター

    2015/11/02

またまたWordPressのテンプレートやらなんやらを弄り倒している。
今回の目的はWordPressブログのアクセスの半分を占めるスマホ対応だ。

広告

探してみてもなかなかないのだ、シュミレーター

モバイルからのアクセスをシュミレートしてPC上のブラウザで確認することをしたいのだがなかなかピッタシのモノが無い。
以前はFireMobileSumiratorというFF用のプラグインを使用していたが、どうもこれはガラケー用でスマホでは難しいようだ。

広告

スマホからのアクセスを解析するのには2つの要素

それはまず単純に画面の大きさなのだ。
これは極端に言えばブラウザをマウスでつまんで大きくしたり小さくしたりすれば実現可能だ。

しかしプリセットされたサイズというのがある。
例えば320×480(iPhone等)や768×1024(タブレット等)のある程度決まった大きさがあるのでこれを確実に見れる事が必要なのだ。
2つ目の要素はユーザーエージェントで、WordPressはこれを見てモバイルかどうかを判定している。
従ってユーザーエージェントをモバイル用に書き換えることが必要になる。

ブラウザーはFFD

ブラウザーは最近登場したFirefoxDevelopperEditionを使用している。
標準でも解析ツールが内蔵されているし、レスポンシブ画面もシュミレートできる。
しかし画面の大きさはシュミレートできてもWordPressがスマホと認識しないので、スマホとPCで出し分けているような事をしていると確認できないのだ。
そこでユーザーエージェントを書き換えるプラグインを入れてみた。

広告

その名もUserAgentSwitcher

という名前のプラグインなのだ、そのままの名前だ。
これらの組み合わせによりスマホからのアクセスならこれは表示する、もしくは表示しないというような制御を行っている場合にも対応できる。
使ってみてこりゃ便利なのだ。

↑ FFD+UserAgentSwitcherの組み合わせでiPhoneの大きさでエージェントもiPhone5Sのものに設定してシュミレートした画面、実機でも最終的には確認を行うがPC上で確認できるのはやはり便利で時間の節約になる

今回はこのへんで
では

広告

関連カテゴリー

関連するカテゴリーはこちら、是非チェックしてみて下さい。

気に入っていただけたら是非シェアお願いします!

  • このエントリーをはてなブックマークに追加
  • Pocket

コメントはお気軽にどうぞ

メールアドレスは公開されません。
*が付いている欄は必須項目です。

内容に問題なければ、下記の「OK!」ボタンを押してください。