前回からの続き。あれからひと月ほど経って、新しい外観のテーマにも慣れてしまったところで、そろそろMac、iPhone、iPadとそれぞれのデバイス毎に見映えを切り替えて行きたい。以前はレスポンシブ・ウェブ・デザインを軽く勉強してみようと、１つのテーマ内でCSSを切り替えてみましたが、今度はもう少しストレスを軽減したいというか、「iPhone用のテーマを作るのならその事だけ考えたい」というような、それぞれのデバイス毎に専用のテーマを作成する場合を試してみます。

　そこで、ブログにアクセスしてくるデバイスを見分けて、それ専用のテーマに自動切替えしてくれるプラグイン『Any Mobile Theme Switcher』をインストールしてみました。使い方は簡単、デバイス毎にリストアップされたテーマを指定するだけ。

　ちなみに自分はすっかり忘れていて最初「？」ってなったんですが、使用するstyle.cssの冒頭のTheme Nameにちゃんと個別の名称を明記しておくこと。すると、その名前がリストに挙がってきます。コピペするとこの部分を書き換えるのを忘れるんですよねえ。

縦置きと横置きも切替え

　まずはflfl.meを公開しているServersMan@VPSのWordPress3.9.2にインストールして、iPad用にテーマを調整しました。ポートレイトとランドスケープそれぞれを微調整したいので、そこはCSS内で切替え。以前、丸一日迷走したコチラの記事が思い出されます。まだバランスが悪い気もするけれど、それは引き続き時間の空いた時に調整するとして、ひとまず作業完了。

flipflipflip.comの方で不具合発生

　flfl.meで問題なくスムーズに作業が終えられたので、その流れでこの「まわるフリフリのフリ」も同様に切替えてみようと思いました。そこでまず同プラグインをインストールしてみたところ、設定画面が「真っ白」に。
　WordPress 3.1.4 と最新バージョンのプラグインの相性の悪さには慣れてしまったので、今回の『Any Mobile Theme Switcher』も現行のバージョン1.6からどんどん下げて行きます。どんどん下げて、下げて、さらに下げて、ようやく設定画面が正常に表示されたのは…

バージョン0.7

　…いやあ、下げましたな。まあ別に最新版でなくても、iPad用のテーマに切り替わってくれればそれで問題ない。まずflfl.me用に作成したCSSからポートレイト用の記述部分をコピーして調整、意図通りに表示することを確認後、ランドスケープ用のCSSを組もうとしたところで不具合に気付きました。ランドスケープ用CSSに全く反応しないのです。

　flfl.meでは問題ないstyle.cssを丸ごとコピーしてきてもダメ。全く原因が思い付かないので、同じ動作をするプラグインである『WPtap Mobile Detector』も試してみたのですが、残念ながら同様の不具合。仕方ないので、現状ではiPad縦置き用にCSSを調整し、横向きにした場合はそのままの比率で拡大表示するに留めました。文字デカい。そしてiPhone用には、今回作成したiPadポートレイト用の表示を使うように指定しました。

WordPress 3.1.4 は確かに古い、けどしかし

　flfl.meで上手く動作しているから、ここ「まわるフリフリのフリ」も同じ動作環境であれば問題は解消されるんではないかと思います（自分の凡ミスである可能性も捨てきれないのだけれど）。アップデートすると不具合の起きるプラグインも３個くらいあって、さて今後どうするか考えてみたのですが、そもそもWordPressのバージョンを上げられるようにレンタルサーバーを変更しなければいけない…まずはそこから始める必要があるわけで…つづく。

2014-11-09 ＞ VPS＆WordPress引っ越しメモ