yunico's fluffy life

横着主婦の暮らしの詰め合わせ

当ブログにはPR広告を利用した記事があります

【はてなブログ】見出し内に改行を入れて、スッキリ表示させる方法

みなさんは【見出し】と【目次】
ブログを書く時に活用されていますか?☺

SEO対策にも見出しは大事だと言われているみたいですね。
これについては詳しくないので割愛しますが、見出しがあると単純に読みやすくなる気がするので私はよく使っています。

ボリュームたっぷりの記事を書く際は目次もあると、読みたい項目に直接飛ぶことができるので更に便利になると思います。

  • はてなブログでの見出しの付け方
  • 見出しの途中に改行を入れる方法
  • 目次を生成する方法


 

見出しの付け方

この記事ははてな記法を基準に書いています✎

見出しにしたい文の前に*(アスタリスク)を必要数つければ、その文が自動的に見出しとして表示されます。

* 大見出し
** 中見出し
*** 小見出し

▼編集画面の見出し欄から選択も可能◎

見出しの見え方(デフォルト)



大見出しはたまにズレ込む

【中見出し】と【小見出し】は文字があまり大きくならないので気にならないと思うのですが、大見出しは文字通りサイズが大きいため、(スマホでは特に)文章の長さによって中途半端なズレが生じることがあります。

このように長めの文を見出しにすると

私のスマホではレます。だけ下にいます。
この状態、気になりませんか!?😖

見出し内に改行を入れる方法

上記のようなズレ込みが気になる時は改行したい所に

<br>

という改行タグを記入します。

<br>以降の文章が見出しのまま、きれいに改行されました🙌🏻

キーボードでの改行ではできない

【*】の後ろに続く1文(マーカー部分)が見出しとして認識されます。
なので普段通りの改行をすると、それ以降の文字は見出しの対象から外れてしまいます。

shift+Enterの改行・Enterの段落替え
どちらもできなかったので改行タグを入力するしか方法はなさそうです。



パソコンやタブレットなら多少長い見出し文でも文字がズレ込むことはないと思いますが

「スマホでもスッキリ見せたい」
「ここで区切って読んでもらいたい」

と言う時に活用できますので、覚えておくとちょっぴり便利かもしれません☺

目次をつける

記事の中にいくつかの見出しが付いたら、目次をつけるのも簡単ですよ♪

目次の自動生成


目次を入れたい位置に[:contents]と記入するか、目次マーク(画像のマル部分)を押せば入力されます。

見出しになっている文が自動的に目次として生成されます。

目次のデザイン

当ブログの目次デザインは
www.kurasitotonoe.comこちらを参考にさせていただいています🎀


それでは、今回はこのへんで!
お読みいただき、ありがとうございます。
それではまたね🧸◌𓈒𓐍