Simplicity2のカスタマイザーの項目に「完全レスポンシブ化」という機能がありますが
なんだか分からないのでオフのままずっとやってきて(笑)
最近やっとデザインが安定してきたので、これまでわからなかった部分の勉強を始めたので
ずっと引っ掛かっていた「完全レスポンシブ化」について調べてみた
⇒よく分からない！(笑)
とりあえず、試してみた（オンにしてみた）
レイアウトが崩れたー(笑)
なんなのか、モバイル表示にしてみて、意味が分かりました。
モバイル表示とPCでの表示でデザインを変えているのですが、モバイル表示にしてもPCと同じ表示のまま…
完全レスポンシブ化にすると、モバイルになってもPCの時と同じ表示のままになるのですね。
※PCと同じ表示で、幅だけが狭くなっていく(レスポンシブ表示)になるわけですね。
幅が狭くなるとサイドバーウィジェットは下に移動していきます。
↓
多分、Simplicity2では、基本的にはユーザーエージェントを取得してデバイスの判定をしているのではないかと思いますが。
そして、モバイル端末でアクセスしてきた場合は「テーマの編集」の「mobile.css」に書かれたスタイルを適用してくれる。
しかし、完全レスポンシブ化してしまうとモバイル機器の識別と切り替え(「mobile.css」)が無効になるようですね。
(※代わりに「responsive.css」が有効になる模様)
と言う事は、「mobile.css」を使わずにメディアクエリーを使って「style.css」に書き込んでしまえば、完全レスポンシブ化する事ができますね。
レスポンシブデザインの作り方については前に書いたのでそちらを参考にしてください。
完全レスポンシブ化のメリットってあまり感じられなかったのですが、最近知りました、WordPressのプラグインでキャッシュを利用して表示を高速にするモノがありますが、完全レスポンシブ化にしていない場合、問題が置きてしまうようですね。(PCでアクセスしてもモバイル表示のキャッシュが表示される等)
https://wp-simplicity.com/simplicity-and-cache-plugin/
実は、Simplicity2を使い始めた時、「mobile.css」の存在を知らず(笑)
メディアクエリーを使って完全レスポンシブデザインで作ってしまっていたのを思い出しました(笑)
なので、その頃、「完全レスポンシブ化」のオプションをオンにしてもオフにしても、デザインが変わらないので、何が違うのか分からんかったわけですね(^_^;)
その後、「mobile.css」の存在を知り、メディアクエリーをやめてそちらを使うようになったら、そのほうが楽ですね～
と言う事で、今は「mobile.css」でのデザインを前提に改造を続けてきてしまっておりますので、当面このままで行くつもりです。
アクセスが増大して重くなってしまうようになったら、「mobile.css」の内容をメディアクエリー化すればいいだけだと思いますので、それほど難しい話でもないような気がしますが、そうすると分かりにくくなりますからね。「mobile.css」に分かれていたほうが楽ですね。
まぁアクセスの少ない過疎な状況で居るうちは、キャッシュ系の機能はすべてオフで行く予定。。。
コメント