ブログ・エス技研

当ブログは引越しをしました。10秒後に自動で転送しますが、転送されない場合は、http://blog.s-giken.net/ をご覧ください。
ブログ・エス技研 TOP  >  スポンサー広告 >  WordPress >  WordPressで WPtouchを入れてモバイルテーマを「OFF」にしたら元に戻れなくなった

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
[ --年--月--日 --:-- ] カテゴリ:スポンサー広告 | TB(-) | CM(-)

WordPressで WPtouchを入れてモバイルテーマを「OFF」にしたら元に戻れなくなった

WordPressでスマホ対応を行うため、WPtouch Mobile Pluginを設置しました。
そして、モバイルページには確認のために公開ページを表示したところ、ページの一番下には「モバイルテーマ」の「ON/OFF」を切り替えるボタンがありました。

ボタンがあれば押してみるのが心情だと思うのですが、私も何も考えずにその「OFF」のボタンを押してみたのです。
そうすると、モバイルページから PC用のページに切り替わり、そして....「モバイルテーマ」の切り替えスイッチが表示されなくなり、元に戻ることができなくなったのでありました。

テンプレートを非表示にしてみても、再度ナビゲーションを消してみても、フッターを消してみても表示されないのです。

最初は、Chromeの Developer Toolsで疑似的にスマホ環境を作っていましたので、ほかの環境ではどうなのか、とFireFoxの FireMobileSimulatorで表示させてみると最初はボタンは表示されるが、やはり一度「OFF」を押すと次から表示されなくなる。
実機でやってみても同じ。
そして、Mobilizerをインストールして....と徐々に表示できる環境が減っていくという恐怖...動作検証ができなくなると開発に支障が出てくる...
と思いさすがに根本的な解決策を探さないわけにはいかず、調べてみることにしました。

そうすると意外にあっさりと解決策が見つかりました。
下記サイトが参考になります。

http://9ensan.com/blog/wordpress/wptouch-pc-iphone-button/

それくらい同じような問題を抱えているか方が多いということですね。


-------------------------------
<?php 
if (function_exists('wptouch_switch')) {
  wptouch_switch();
  remove_action( 'wp_footer', 'wptouch_switch' );
}
?>
-------------------------------

この表記をフッターの下に編集すれば OKです。

テンプレートファイルで「get_footer();」を記述している下に編集する方法でも OKですが、この方法ではすべてのテンプレートに編集していく必要がありますので、私は「footer.php」の一番下、「</html>」タグの下に編集することで対応をしました。

上記サイトにも書かれていますが、「wp_footer」が存在しないと表示処理自体が実行されないので、ページの上部などに表示させるということは難しいようです。



ちなみに、スマホの確認環境を構築するためのシミュレーター情報を載せておきます。

「FireMobileSimulator」
 http://firemobilesimulator.org/

もともとは、FireFox用のプラグインだったために Fire...という名称ですが、現在は Chrome版もあります。
非常に便利なのですが、機能を ONにすると、すべてのウインドウ、タブが共通して同様の設定した環境に代わってしまうため、これを使う場合には、確認は FireFoxを使うが、開発用のブラウザは chromeを使う、といった複数のブラウザを利用して開発を行うようなことになるでしょう。


「Google Developer Tools」
 http://www.submit.ne.jp/1199
 http://tech.nitoyon.com/ja/blog/2013/04/23/chrome-responsive-debug/

Google Chromeに標準搭載されているツールを使うという方法です。
Chromeを使っている場合は、特に新たにツールをインストールせずに使えるため、日頃開発に使っていないパソコンなどでも使える可能性が高いため、使い方を覚えておいて損はないでしょう。
また、FireMobileSimulatorと違い、タブごとに設定されますので、複数のタブごとに環境を切り替えて見比べる、といった使い方もできますので、こちらの方が重宝する場面もあるでしょう。
ただ、上記の 2つ目のサイトにもありますが、完全にエミュレートできるわけではないことには注意が必要でしょう。


「Mobilizer」
 http://www.springbox.com/mobilizer/

これは、ブラウザにプラグインを入れて使うタイプのものではなく、独立したアプリケーションのシミュレーターです。
インストールの方法も使い方も簡単ですが、インストールに際しては、「.air」拡張子の AIRのアプリケーションであるため、下記のサイトを参考にしながら AIRをインストールしてから使う必要があります。
 http://naruhiko1111.com/1635.html
関連記事
スポンサーサイト
[ 2013年08月22日 21:44 ] カテゴリ:WordPress | TB(0) | CM(0)
コメントの投稿












管理者にだけ表示を許可する
トラックバック
この記事のトラックバックURL

プロフィール

エス技研

Author:エス技研
性別:男性
職業:Web系エンジニア
エンジニアになって 15年ほど経ちますが、その途中で 5年ほどディレクタ、マネジメントを中心とした業務を行っていたためにやや現場を離れていましたが、転職をきっかけに 2012年に現場に復帰し、新たな技術を楽しみながら勉強しています。
メインの環境は LAMP環境です。

FC2ブログランキング
FC2カウンター
FC2拍手ランキング
GoogleAdWords
カレンダー
05 | 2017/06 | 07
- - - - 1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 -
検索フォーム
ブロとも申請フォーム
QRコード
QR
フリーエリア


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。