WordPressのスタイルシートをいじって、横幅サイズを微調整してみる

現在、ブログテーマには

DeepJaggy-threeColumnというものを使っている

Stingerを3カラムにしてみたよ!「DeepJaggy-threeColumn」リリース!【Stingerカスタマイズ】

これはWordPressの定番テーマである「Stinger3」を元に、3カラムに改変したもの

2カラムのStinger3を3カラム化するのは、本当は面倒くさいプログラムをイジらなければならないのだけれど

このテーマを導入すれば、はじめから3カラムが利用できて簡単だ

私は、前のブログから、3カラムを使っていて、慣れている&お気に入りの構成で、とても気に入って使わせて頂いているテーマだ

だが、レフトカラムの幅が狭いのが前から、気になっていたので今回、微調整してみた

設定をいじくる場所

設定の変更は

外観→テーマの編集→スタイルシート(sytyle.css)

文章内検索にて「基本構造」

そこから下の項目がどうやら、サイト幅の決めている項目らしい

sitehaba-zu標準のサイト幅は

全体が1140px内に収まるように設定され

レフトが175px

メイン(記事部分)が550px

ライトが336px

になっていた

合計すると1140pxにならんけど、そこはわかんね(おい)

けど、ここをいじると、ちゃんと反映されるはようなので、調整してみる

ピクセルサイズをいくらにするか

参考:サイトデザインの横幅の基準はこれだ!お役立ち記事まとめ&事例9選で何ピクセルかもう迷わない | プロモニスタ

こちらのサイトによると8の倍数が良いとのことだ

とりあえず、人気ブログのサイト幅調べによると、大きくても1200pxらしい

これを目安に、今までは1140pxなので、サイト幅を1200pxに60px増やすよう変更、その分をレフトカラムに振り分けてみた

結果

メイン:1200px

レフト:235px

メイン:550px

ライト:336px

にしてみた

SnapCrab_NoName_2015-7-4_14-9-57_No-00

ん~、サイトの構成バランスが悪くならずに

かつ、レフトカラムの存在感も増してるし、なかなかいいんじゃないかしら

とりあえず、この構成でしばらく、様子を見てみようかと思う

コメント

タイトルとURLをコピーしました