れもレモネード!

"When life gives you lemons,make lemonade"

【ハウツー】はてなブログデザインテーマのカスタマイズの基本のやり方【初心者向け】

【ハウツー】はてなブログデザインテーマのカスタマイズの基本のやり方【初心者向け】
【ハウツー】はてなブログデザインテーマのカスタマイズの基本のやり方【初心者向け】


はてなブログでは、ダウンロードしたブログテーマを自分でカスタマイズすることが可能です。


自分のダウンロードしたブログテーマにない機能は、CSSを書いてどんどん追加していくことができます。


じゃあ、すでにあるものに変更を加えたいときは…?


  • H1、H2の色を変えたいとき。
  • 2カラムを1カラムに変えたいとき。
  • パンくずリストのデザインを変えたいとき。etc...


はてなブログにダウンロードしたブログテーマに変更を加えたいときの方法をまとめました



スポンサードリンク





スポンサードリンク



経緯

はてなブログをカスタマイズしていたが、ブログデザインにCSSを追加する方法はわかるけど、ブログデザインのCSSを改変する方法が分からない


結論

はてなブログの「デザインCSS」に、ダウンロードしたブログテーマのCSSを丸ごとコピペしてから、書き換えを行う。


やり方

私が使っている「Haruni」のブログテーマを使って説明します。

Haruni

Haruni
Haruni


手順

ダッシュボード画面を開く。

「デザイン」を選択する。

「デザイン」を選択する。
「デザイン」を選択する。


カスタマイズ画面を開いて、「デザインCSS」を選択する。
「カスタマイズ」の「デザインCSS」を選択する。
「カスタマイズ」の「デザインCSS」を選択する。

「デザインCSS」を選択する。
「デザインCSS」を選択する。


デザインCSSの「@import」の後ろに書いてあるアドレスをコピーし、リンクを開く。
アドレスをコピーする。
アドレスをコピーする。


出てきた文章のすべてをコピーする。(ctrl+A → ctrl+C)
リンクを開くと出てくる文章
リンクを開くと出てくる文章


デザインCSSに戻り、最初に書いてあった文章は削除し、コピーした文章をそのまま貼り付ける。(ctrl+V)
「デザインCSS」に戻り、貼り付ける。
「デザインCSS」に戻り、貼り付ける。

コピペしたデザインCSSの改変したい部分の記述を変更する。



まとめ

さて、ブログデザインの変更はできたでしょうか。

私は最初、ブログデザインのCSSを「コピー&ペーストする」ということが全く分からなかったので、本当に苦労しました…。

はてなブログ初心者の方で、同じように困っている方のお役に立てれば幸いです。




スポンサードリンク