スマートフォン対応しました

このサイト、イマドキのブログなら当然スマホも対応してて当然と思うかもしれませんが、
レンタルブログでもなけりゃ標準でそんなの入っておりません。

レンタルサーバ借りて、Wordpressを設置してるだけですからね。

プラグインとかで騙し騙し「一応見える」状態にしてたんですが、
やっと、思った形でちゃんと表示できるようにしました。

出来上がったのがこんな感じです。

2013-03-11 18.42.46

スッキリシンプル。地味とも言う!

もともとは、WPtouchっていうプラグイン使って表示してたんですけど、イマイチ使いづらくてですね。

それが、ミク蔵さんのブログ(Blogger)をスマホで開いた時、なんて使いやすいんだ!と思って、
似たような感じにしたい!と思い、スマホ版テーマを探し始めました。

2013-03-12 09.59.51

こんな感じです。勝手にスクショを拝借w

「似たような」とは言え、全く同じようにするわけでもないので、まずは目標を整理。

  1. 軽い
  2. メニューを(プルダウンじゃなくて)全部そのままぶちまけて表示
  3. 日付・タイトル・本分の抜粋がすこし表示される (本文直接表示しない)
  4. その記事部分全体をタップしてその記事へ飛べる
  5. スッキリしてる (出来たら色調がライトグレー)
  6. レスポンシブデザインじゃない
  7. 軽い

以上の 7つ 6つです。
まあ、主に「軽いこと」ですね。

そして、現状で手っ取り早く可能な、Wordpressをスマホ対応にする方法を列挙します。

  1. WPtouch等、フルオートでスマホ版表示になるプラグインを導入する
    →軽いけど、テーマは固定の事が多いので、好みの表示にならず、見づらい。
  2. レスポンシブデザインの、PCでもスマホでも丁度いい自動調整テーマを全体で利用する
    →PC版と共通のファイルを読み込むので重い
  3. スマホ振り分けプラグインで、スマホを専用テーマに飛ばす
    これ!

おおまかにこの3通りです。

そのうち、今回は「3」の方法でスマホ対応にしました。
具体的には、Multi Device Switcherなるプラグインで、User-Agentで振り分けてるだけです。
(似たようなUA振り分けプラグインはいくつもありますが、日本製なのでなんとなくコレ。)

これ!って書いてるわりに、そのスマホ専用テーマを使う人は少ないです。
理由は簡単。フリーで配布されてるテーマが少ないから。
作れる人ならいいですけど、そこまで気合い入れてやるようなことでもないですしね。時間かかるし。

それが今回やっと、使えそうなテーマを見つけたので、早速導入してみたんですよ。

そのテーマがこちら。

Generic jQuery Mobile WordPress Theme

なんか、jQueryで、タップしたらぐるぐるまわってパッ!って感じです。
スマートですね?(説明がスマートじゃねえよ)

当然ですがそのままでは使えず、日本語化したり記事抜粋が表示されるように改造しちゃいましたが、
お陰様でほぼ完全に思った通りの表示をしてくれるようになりました。
WPtouchやらWordpress.com標準のmini-elevenテーマよりもよっぽどスマートになった気がします。

GPLライセンスですし、改変したファイルを一応ここに置いておきますけど、
短時間で適当かつ乱暴にえいやっ!と弄ったので何か少し間違ってる気がします。

generic-jquerymobile-1.2.0-jpn

使って何か起きても私は知りません。中のテキストファイルでも見ながら適宜いじってください。
もしかしたらこのサイト専用の表示が残りっぱなしになってるかもしれません。

このスマートフォン全盛期に、もうちょっとこう、スマートにスマートフォンに対応する方法が増えると嬉しいですねー。

スマートって言いたいだけかもしれないですね。

スポンサーリンク

シェアする

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

フォローする

スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。