• 締切済み

WORDPRESSのテーマの幅を固定したい

WORDPRESSのテーマの幅を固定したいのですが、以下のテンプレートを使用しブラウザの幅を狭めた場合にレイアウトが変わってしまいます。 http://wordpress.org/themes/magazine-basic こちらのサイトよりプレビューを行いサンプルを表示し、ブラウザの枠を狭めると、レイアウトが縦一列のものに変更されてしまします。実はこの仕様に気付かずにかなりのカスタマイズしてしまったので、可能な限りこのテーマの幅を固定する方法を知りたいです。WEBに詳しい方いましたら、お手数ですがご教示ください。

みんなの回答

回答No.2

再回答です。 style.cssをTeraPadなど編集可能なエディタ(UTF-8N(BOMなし) 改行LFが指定保存できるもの)で開き、「折り返しなし」にして68行目を参照してください。 .w640{max-width:640px} とあるのを、 /*.w640{max-width:640px}*/ とコメントアウトしてください。 コメントアウトしたstyle.cssを、サーバー上のstyle.cssに上書きしてください。 タブレットでは多少見づらくなるでしょうが、スマホとPCでは問題ないはずです。 一応、やってみて確認しました。

回答No.1

縮めるとカラムが落ちて一列になるのを「レスポンシブデザイン」と言います。 そのテンプレートがレスポンシブデザインを採用しているために起きる動作です。 何故、レスポンシブデザインか? タブレットやスマホで読みやすくするためです。 もちろん、PCでも小窓に表示して閲覧する場合に、いちいちスライダーを動かさなくて済みます。 それを前提に作られたテンプレートです。 どうしても固定したいなら、CSSを編集しましょう。 手っ取り早く固定するなら、スマホ用とタブレット用のmax-widthを100pxとか、ありえないぐらい小さくしちゃいます。そうすると、それより大きい横幅は、PC用のレイアウトになります。 ただし、そんなことをするのはお勧めできません。

falcon_jun
質問者

お礼

回答ありがとうございます。 今回レイアウトを一列にしたくなかった理由が、解像度幅800のパソコン表示の場合にレイアウト崩れが起きてしまうのを防ぎたかったからなんです。 CSSに怪しい記述?(<meta name="viewport" content="100px, initial-scale=1.0" />)があったので削除してみたのですが、それでも一列表示にされてしまします。 CSSをもう少し勉強してみます。 回答ありがとうございました。

関連するQ&A