Ofton-Kingdom

布団の中で全てを完結したい。そんなブログ

Ofton-Kingdom

デザインをいろいろいじったお話

今日雨すごいですね

 

というわけで今日は(今日も)ずっとパソコン弄ってました。

そんでもってそろそろこのブログのデザインをカスタマイズしようかな~と思いCSSを弄る弄る。

 

お借りしているデザインテーマ「Brooklyn」はシンプルイズベスト・しかも白黒がとってもクール!って感じでそのままでもすごく使いやすいんですが、見出しとか色とかわたしの好きなものに変えてみたかったんですね。

 

でもわたしにはCSSの書き方なんてわかんね~~~~!!!のでパクり地獄になりました(正直)

 

というか、有志の方々が公開しているデザイン例・CSS例に頼らないと何書けばいいか分からないので、

存分に利用させてもらうぜ!!ってことですね。

 

そんなことしてたら二日分の時間消えてましたね。

ほかに…やること…あるやろ…

 

以下、やったこと一覧です。

 

 

 

色を変えるぞ!

わたしの好きな色は青です。

そしておふとんは触ると冷たくて心地よく、しばらく入っているとあったかくなるのが大好きなんです。

なので温かみのある青にしたいな。

tsukuruiroiro.hatenablog.com

迷いましたが「少しレトロな落ち着いた青」にしてみようと思います。

これを参考に色つけていこう。

 

タイトルの文字色変えたいんだけど!

探せど探せど「画像の設定」ばっかりで文字色変えるところが見つからない。

今のところヘッダー画像つける算段つかないから文字色だけ変えたい…。

www.style-yry.com

 

ありました。

しかもこのサイトは他にも「サイドバー」「グローバルヘッダ」「投稿年月日」「フッター」などなどの色の変え方が載っています。うれしい!!

というわけでガツンと変えました。

 

おや、サイドバーに関してはおかしなことになってました。

どうやらデザインテーマで設定してあるものと競合してわけわかんないことになってます。別のサイトも探してみよう。

 

サイドバー見出しの吹き出しを消すぞ!

mmorley.hatenablog.com

 

ありました。

吹き出しを消すだけでなく、見出しの背景色の変え方、吹き出しの部分の色変えなど詳しく載っています。うれしい!!

でも今回はザックリ消しちゃいたいので消すだけにしましょう。ザクッ。

 

 

 

見出しを変えるか~~

見出しのタグ入れりゃいいだけだと思ってたんですが、サイドバー見出しと同じで元のデザインと競合してわけわかんないことになってます。

じゃあ見出しをリセットしてから書き足せばいいわけですね。

www.ikemenmusuko.net

おっとお

はてなブログは大見出しがh3タグらしいです。記事部分のh2は使われてないんだとか。なんで?

SEOのことは全然わからないけどわたしも単に気持ち悪いので記述しておきます。

 

記述したら真っ黒なh2見出しが出てきました。

「Brooklyn」はh3~h5見出しだけじゃなくh2見出しもしっかりデザインしてあるんですね。

しかし真っ黒見出しはちょっと目に悪い気がするのでデザイン変えちゃいます。

まずはリセットですね。

affiliate-couple.hatenablog.com

見出しが消えました。

あ、h2タグ(大見出し)のやつは文字色が白なので何も見えない…

 

saruwakakun.com

さくさくとコピペして記述。

 

ページトップへ戻るボタンつけてみるか!!

これかっこいい思って前々からつけたかったのでつけます(正直)

nohack-nolife.hatenablog.com

色だけ変えて記述して設置!!

 

お、かっこよくなったんじゃない?

個性が出たような気がしますね。書いてるときすごく楽しかったです。

カスタマイズ例がたくさんあるっていうのは「Brooklyn」が愛されてる証ですね。

ここまでできるのも先人たちの例があってこそ。ありがとうございます。

 

カスタマイズしたらまたカスタマイズしたくなりました。

終わりが見えない…

 

そのうちやりたいね

背景色変えたい

なんか白だと目が痛い…

最初に参考にしたカラーテーマに沿えばいいんですけど、また目次のやつとかぶるんですよ。後日でいいかな…

 

続きを読むボタンも色変えたい

変えたいんだけどうまくいかなかったんですよね。

「Brooklyn」のデザインが気に入ってるのでボタンの形状を変えずに色だけ変えようとしたんですが、一部記事だと枠線が黒のまんまで青にならない…ってのが気持ち悪くて断念しました。

直し方わかんなーいので今度じっくり手術してやるよ…

 

グローバルメニューいる?

まだ記事多くないしいっか…って思って放置してます。これ永遠に設置しないやつだわ