wordpressスマホ対応サイト・wpプラグイン・検索体験最適化・SNS・ 動画・bgmやテーマ曲を駆使して、リアルビジネスへの集客を達成するためのコラム!

   

wordpress屋のマルチメディアコンテンツ制作読んどけ☆コラム

『レスポンシブレイアウトwp』がプラグイン(wptouch mobile plugin)エラーで、スマートフォンで上手く表示しなかったときの対策

      2018/04/04

こんにちは、管理人@SS_mshpです。

今回は、サイトなどを使ってコンテンツを発信するのに役立つかもしれない、wordpress&レスポンシブレイアウトねたを取り上げます。
201601031
画像はいつものおやじギャグです。この技術を採用するにあたって、やや引っ掛かったところもあるんで対策もしてみました。

サイトのレスポンシブレイアウトって?

web業界で使われる用語です。今までは、スマートフォン用ページ・PC用ページと、表示デバイスに合わせて複数のURLがありました。しかし、更新や検索へのインデックス、解析、htaccessで振り分けなどと、いろいろな手間がかかることから『ひとつのページ(URL)を表示デバイスに合わせてレイアウト変動させる』という技術が生まれました。これがレスポンシブレイアウトです。

しかし、管理人ミスりました。スマートフォンが上手く表示しません、原因は?

wordpressテーマ『スティンガー5(レスポンシブ対応)』をカスタマイズして使用しており、スマートフォン版も横幅変動して表示するはずですが・・・・
201601032
なぜか上手く表示しません。このままでは、スマートフォンでアクセスした方が『壊れたのか?』ってなり、ページから離脱してしまいます

原因、プラグイン(wptouch mobile plugin)の干渉によるエラー

原因を調査したところによると、テーマ配布ページに『プラグインの干渉によるエラーが出る場合があります』とのこと。以前のテーマのときに、適当にいれていたプラグインがあったので、いろいろoffにして表示チェックしたところ・・・
201601033
どうやらこれが干渉して、レスポンシブ機能が働かなかったようです。コレをoffにしたところ・・・

201601034
スマートフォンでアクセス時も、横幅を変動し、ひとつのURLでうまく表示できました。

ちなみに、PCアクセス時は
201601035
このように、右サイドカラムが入って横幅を広めに表示します(スマートフォンの方向け)。
スマートフォン時は、この右サイドカラムが下に下りて、縦長になります。

あとがき・まとめ

おそらくこのサイトを見に来てくださってる方は(メインで扱ってる内容により)、何らかのwebでの発信活動・音楽発信活動をされてる方が多いかと思います。webサイトを使って、PCユーザー/スマートフォンユーザー、どちらにもコンテンツを届けやすく、また、更新などの管理もしやすくなるんで、レスポンシブレイアウトサイトも、ぜひ検討してみてください。
プラグインでエラーになることもあるけど、他に『php /if構文で、スマホやpcで別々にスタイルシート出す』『メディアクエリの横幅で判定して表示を切り替える』という方法もありますので、サイトにあった方法で実装しましょう。

*お問い合わせフォームページに移動します。webリニューアル・ロゴ・記事・wordpress化などでお力添えできます。

■LINEできいてみる(アカウントがある方)

(タップ・またはqrでアプリを起動してください。回答できる内容には限りがありますが、なにか課題解決のきっかけができるかもしれません。)


【カテゴリ】 - サイトエラー対策と復旧(wp/php/css) 【タグ】 -

  関連記事

【wpプラグイン】コンタクトフォーム7の自動返信設定と、なぜか発生した文字化けの対処

今回は、wordpressで定番・便利な問い合わせフォームのプラグインを …

【PHPファイル改造でWPテーマ不具合修正】Clarina(親llorix-one-lite)で、ブログ更新情報タイトルが二回出るのを直す

今回は、管理人のつくったフリー曲サイトで、表示が微妙になっていた部分を、 …

【WordPress4.9.7でのエラー検出】子テーマでindex.phpやCSSヘッダが無いときの『テーマが壊れています』表示への対策

今回は、2018年7月6日に出た、WordPressの新バージョン4.9 …

ワードプレスSTINGERでアドセンスコードが入らない~『テキストドロップ』勘違いと、対処方法

今回は、このサイトにもつかわれているツール『ワードプレス』での、アドセン …

ワードプレスで画面真っ白で積んだとき、データベースから記事データを抜いて復旧

今回は、ワードプレスで、画面真っ白でどうしようもなくなったときの復旧方法 …

スクロール後に変な位置に移動するタイトルをcssのpositionで直す(wp rootstrapテーマ)

今回は、管理人がワードプレスサイト作ってる時に、要素が変な位置に移動して …

【wordpress】PHPのバージョンっていきなり変えて大丈夫?不安なら公開前にローカルでテストしよう

今回は、WPに使われてるプログラムPHPのバージョンを変更する際に、事前 …

【wordpress/PHPエラー原因】Parse error: syntax errorで画面真っ白は、プラグインorサーバーのPHPバージョン

今回はwordpressサイトでよくある『プラグインがParse err …

CSSの『Expected RBRACE 』エラーって何なの?(ワードプレス4.9で判明)

今回は、ワードプレスを新バージョンにしたら判明した、変なCSSエラーがで …

ワードプレステーマインストール時に、エラーで画面真っ白を復旧させた方法

今回は、管理人がメインで使ってるweb製作ツールワードプレスで、たまに発 …