少しずつブログのデザインを変えているのですが、みなさんお気づきでしょうか。今回は、ちょっとしたブロガーらしく、アイキャッチもデカデカと入れてみました。
初心者でも出来た！の前にトラブル発生！？【はてなブログカスタマイズ 見出し編】
この記事を書く理由
ブログをカスタマイズする方法はググれば、山ほど出てくるのでそちらを参考にしてもらった方が確実なのですが、わたしがこの記事を書く理由は２つあります。
- コピペするだけなのに反映しなかった。
- 自分の覚書。
コピペするだけだから簡単！と書かれていても、手間取った経験を披露いたします。
UnderShirtを使用
このブログのテーマはUnderShirtを使用しています。UnderShirtはカスタマイズしやすい装飾の少ないデザインでカスタマイズの仕方によってはだいぶ印象が変わります。
今回のカスタマイズ
カスタマイズ前（デフォルト）
大見出し
カスタマイズ後
カスタマイズ前（デフォルト）
中見出し
カスタマイズ後
デザインはこちらのサイトを参考にさせていただきました。
コピペの仕方はこちらのサイトを参考にさせていただきました。
コピペしても反映しない
カスタマイズのやり方も分かったし、いざ挑戦！してみたのですが、デザインCSSにコピペしても反映しない…
まったくデザイン変わりませ～ん。何度やっても同じだった(-_-;)
ググっていろいろ調べてみました。
デザインを参考にさせていただいた「サルワカ」さんの記事も参考にして「検証」なるものもやってみました…が
初心者にはチンプンカンプン！わけわかめ状態。
CSSで同じ部分に対して複数のスタイル指定をしてしまっていて、優先順位が下がっているので優先順位を上げてみるとか、!importantをつけてみるとかetc.いろいろ対処法が載っていましたが、よくわからんし、それらしきCSSも無くなんか違うな～っと。
コピペ１分で完了！のはずが、数時間格闘。ちかれた💦
んで、結局基本に戻って考えてみたのです。
わたしの使用テーマはUnderShirt。デフォルトは無装飾だった。CSSは重複してない。
では何がワルさしてるの～？？
と、またググってたら、デザインCSSを他にも使用している場合、貼りつける順番も関係しているらしいという情報をGetしまして（どこのサイトかは忘れてしまいました。）、ピーンときました。
グローバルメニューを設置するのに、デザインCSSいじってました。（これもコピペするだけのやつです。）
多分、犯人はお前だ～ということで
早速、順番の入れ替え。
もともと書き込んであったCSSの下に見出しのCSSを挿入して、グローバルメニューのCSSは後にしました。
結果は成功です。
あ～ちかれた💦
ほんまにコピペ１分で完了だったわ…
まとめ
デザインCSSを他に使用している場合、 デザインCSSに記述する順番も見直すべし。
おわりに
テーマによってはデフォルトでも見出しが装飾されているものもあるので、テーマを変えるのもひとつの手段ですが、むやみにテーマを変えるとSEOによろしくないのと、グローバルメニューのCSSが消えてしまうことがイヤで見出しをカスタマイズしました。
今後も少しずつ、他の部分をカスタマイズしていきたいと思っております。
読んだよんの印にクリックお願いします
