はてなブログ公式テーマのEverGreenカスタム

ちょっとブログデザイン変えました。

レスポンシブにした方がいいのかな～と思って。（スマホとかでも横スクロールが出ないと噂のデザイン）

テーマは公式のEverGreenにしたんだけど、ちょっといじりました。

変更点と参考にしたサイト紹介しとくので、誰かの何かの役に立つといい。

• 2カラムにした

1カラムがなぜかめちゃくちゃ嫌なので、2カラムにしました。

blog.rokuzeudon.com

ここに書いてる通りにして最初上手くいかなかったんですけど、原因はデザインCSSの所にある

@import url("/css/theme/evergreen/evergreen.css");

の上にタグ入れちゃったのが悪かったっぽいです。

このタグでブログデザイン全体のCSSを呼び出してるっぽいから、基本も言わずに応用言っちゃったみたいな感じになったっぽい。

• 全体の文字サイズを変更した

なんか文字でかいかなと思ったので変更。

www.tarappism.com

無料ユーザーだからタイトル下とかいじれないので、気持ち小さめに17pxに設定しておきました。

• タイトル文字サイズを変更した

 なんかタイトルの文字サイズでかくね？と思ったので変更q.hatena.ne.jp

こっちを入れました。30でかすぎだったんで17に。

.entry-title {
    font-size: 30pt;
}

結局、デザインCSSの欄は

/* <system section="theme" selected="evergreen"> */
@import url("/css/theme/evergreen/evergreen.css");
#main{
float: left;
max-width: 600px;
margin: 0 30px 0 40px;
}
@media screen and (max-width: 1084px) {
    #main {
    float:none;
    max-width: 800px;
    margin: 0 auto;
    }
}
    .page-archive #main{

    margin: 0 20px 0 40px;

    }
    @media screen and (max-width: 1084px) {
        .page-archive #main{
        margin: 0px auto 100px;
        }
    }
    .entry-content {
font-size:17px;
}
.entry-title {
    font-size: 20pt;
}
    
/* </system> */

みたいな感じになりました。

難しいカスタムじゃないけど、全然わからない人がいるかもしれないのと、覚書的に。