【はてなブログ 目次】はてなブログで目次をつけるのは驚くほど簡単！
はてなブログでブログを楽しんでいるかた、もっと見栄えよくしたい！目次で見やすくしたい！とお思いなら、方法は簡単です。
筆者自身も目次を入れた方が見やすいと思いながらも、やり方が分からず、なんだかやけに難しく解釈してしまって手こずっていたのですが、こんなに簡単だったんだ！と解決したのでシェアしたいと思いましたので、お困りの方がいたらお役に立てていただけたらと思います。
WordPressを利用する方なら、プラグインを入れて設定をして…となかなか手間がかかります。（その分カスタマイズができるので嬉しいですが）
しかし、はてなブログなら、その書いている画面そのまま、ポチポチっとするだけで目次が挿入できてしまいます！
このページの目次です↓
このように表示するだけで、目的の文章までワンクリックで飛べるので、読んでくださる方への配慮になり、書いている自身にもわかりやすくまとめることができ、見栄えもよくなりますね。
目次を入れるために気にかけること
では、どのように表示させるのか？
まず、いつも通り文章を書いていきます。
そこで気をつけるのは、文章の「見出し」です。
例えば、このページで言う
この太字の部分「目次を入れるために気にかけること」です。
この太字の部分を目次の見出しに使おう、というように段落を分けて書いていくことで目次の意味が生きてきます。
ここに気を配って書いていけば、文章自体が見やすくなり、目次を利用してさらにまとまるのでおすすめです。
目次の入れ方
では、早速目次を挿入してみましょう。
上記で作った「見出し」をドラッグで選択しましょう。
選択できたら、
ツールバーの「見出し」をクリックしましょう。
大見出し
中見出し
標準
とありますので、どれかを選ぶのですが
大見出しは、１番大きな見出しになるので通常文章の１番初めに設定されるかと思いますが、今回は「中見出し」で統一していこうと思います。
ここを選択すると、HTML編集では<h4> </h4>のタグが付けられています。
これでこの一文を見出しに設定することができました。
次に、
目次を挿入したい箇所にカーソルを合わせてから、ツールバーの目次のアイコンをクリック。
このページの上部に表示している目次は、編集画面ではこの[:contents]と表記されます。
いかがでしたか？
少し難しく感じてしまった方へ、ステップに分けて簡単説明です。
簡単説明
１. 見出しにしたい一文を選択する。
２. ツールバーの「見出し」から「中見出し」をクリック
３. 目次を挿入したい箇所にカーソルを合わせたら、ツールバーから目次のアイコンをクリック。挿入したい箇所に[:contents]が表示されたらOK
プレビューで確認してみましょう。
慣れてしまえば、なんてことない作業でポチポチっと何クリックかで終わってしまいます。
これだけで、ブログが見やすくまとめられるので是非覚えて使ってみて下さい！
ちなみに、この目次もCSSを書き加えればカスタマイズができるので、そちらも追って記事にしていきたいと思います。
