見出しの文字数が多すぎて見づらくなってしまうのが悩みのaoikaraです。仕事でもブログでも、無駄に長々と書いてしまいます。今後の課題ですね。
というわけで今回はそんな…
はてなブログの見出しをカスタマイズ
がテーマです。
大見出しはこれ
中見出しはこれ
小見出しはこれ
↑上に表示されているのが見出しです。この中で私は大見出しと中見出しをカスタマイズしています。見られない人向けに一応画像も載せておきます。
↑こんな風に見えているはず！カスタマイズしていないと、ただの大きな太い文字にしかならないので、カラーをつけたりした方が見やすいと思います。そこで、カスタマイズの方法をとあるサイトを参考にしながらご紹介します。
デザインCSSで見出しのコードをカスタマイズ
シロマティ (id:shiromatakumi)さんの「NO TITLE」というブログを参考に、見出しをカスタマイズいたしました。
こちらの記事ですね。本当にありがとうございます。私のブログの場合…
- 大見出し：見出しタイプ6
- 中見出し：見出しタイプ4
を採用させていただいてます。
見出しコードを貼る場所
先ほどのシロマティさんの記事にあるコードは「デザインCSS」に入力します。「デザイン」＞「カスタマイズ（スパナマーク）」＞「デザインCSS」でコードが入力できる画面にたどり着きますよ。画像付きで解説！
デザインを選択すると、左側にサイドバーが登場します。そして3つのマークが表示されるので、真ん中のカスタマイズをクリックしましょう。スパナのようなマークのやつです。
いろんな項目が表示されるのですが、その中の一番下に「デザインCSS」があるので、そこをクリックして選択。
すると下にコードが表示されます。ここをクリックすることで、コードを入力する画面になるので、そこに見出しのコードを入力しましょう。
これでコードの入力は完了です。
大見出し・中見出し・小見出しにカスタマイズする方法
シロマティさんの記事では、コードが基本的に大見出し用になっています。それを中見出し用や小見出し用にする方法があるんです。先ほど紹介したシロマティさんの記事の中でも解説されています。
大見出しのコードで「h3」となっている部分を、中見出しでは「h4」、小見出しでは「h5」に変更すればOK。一覧だとこんな感じ。
- 大見出し：h3
- 中見出し：h4
- 小見出し：h5
数字を変えるだけなので簡単ですよ～。
というわけで今回は以上です。だいぶ前から見出しは変わっていたので、今更感のある記事でしたね。でも、シロマティさんの見出しのカスタマイズはかなり豊富だったので、ご紹介できて良かったです。
もっともっとブログ頑張ります！
良かったらポチッとください。
励みになります。
aoikara
▼お仕事のご依頼はこちらまで
