はてなブログをカスタマイズ #記事内に目次をつけたい 編
記事を書くのって大変だ！
と、早くも挫折の念と、数多のブログ主さんへの尊敬の念を抱いている今日この頃です。
さて、ブログを書くに当たって絶対欲しいと思ってた機能の１つ目次。
結局カテゴリだけでは賄えず、
知りたい情報を最初に一目で判別可能な便利な子、
目次について実装出来たのでそのまとめです。
※コチラもはてなブログ標準機能のみです。
◆目次の設定方法
作業数としては、２手順！
とても簡単、かつ修正や更新もしやすいので、
覚えておいて損は無い機能だと思います。
0.記事の構成(目次)を決める
構成とか、なにやらぽく書いてますが、記事の中身のグループ分けと順番決めですね……
グループ分けと順番決めする理由として、
・読みやすく(理解しやすく)する。
・完成した時の見直しで整理できる。
のが理由と思われます。(私はそう思ってます。)
だからといって私の記事が読みやすいとは言えませんが……
他の方々の記事を見てみても、多くの方が中身をグループ分けし分かりやすい順序で書いていて、勉強させてもらってました。
さて、記事の上手な書き方については専門では無いので、実装の話に移ります。
目次に関しては3段階まで階層化することが出来ます。
はてなブログでは上から、
・大見出し
・中見出し
・小見出し
としています。
実例として季節別オススメ果物について書いてみるとこんな感じですね。
果物とは (大見出し)
日本で入手可能な果物 (中見出し)
春 (小見出し)
夏 (小見出し)
秋 (小見出し)
冬 (小見出し)
日本で入手不可能な果物 (中見出し)
アフリカ (小見出し)
オーストラリア (小見出し)
果物じゃないけど果物みたいな野菜 (大見出し)
まとめ (大見出し)
実際に実装してみるとこんな感じです。
1.目次の項目を指定する
構成(目次)が出来たら、構成(目次)通りに [見出し] を設定をします。
それぞれの項目(タイトル、行)別に [見出し] の設定が必要です。
[見出し] を設定したい項目(タイトル、行の部分)を選択した状態で、
[見出し] の種類を選択します。
[見出し] の選択は記事作成画面の上部のリストから選択します。
記事作成上部の [見出し] をタップすると４種類のリストが開かれます。
ココから任意の見出しを選択してください。
種類は先述の上の３種類です。(標準は記事本文として扱われます。)
選択後、無事に文字サイズや文字の太さが変わっていれば成功です。
残りの [見出し] 候補も同じように設定しましょう。
2.目次を実装する
[見出し] の設定が終わったら、目次の実装です。
目次を実装したい箇所を選択し、
記事作成画面の上部の [目次] ボタンをタップする。(下記画像の上の赤丸部分です。)
これで完了です。
一見、記事作成画面上ではさみしく
[: contents]
としか書かれていませんが、公開された記事を見ると目次になっております。
※作成中に確認したい場合は [プレビュー] にてご確認下さい。
◆まとめ
無事目次が実装できました！
実装できたのですが、順番やグループ分け、考えすぎなのか難しいですね……
ただ、このブログは備忘録。
忘れた頃に見直しても、その頃はホント知識０になってたりするので、意外に何書いてるちんぷんかんぷんになってたりします。
そうならないよう、上手に目次をつけられるように精進して参ります。
さて、３記事連続でカスタマイズ記事を書きましたが、
これで自分がまとめる上で欲しいと思う機能を、あらかた実装できました。
・カテゴリーの設定と階層表示
・画像の張り付けとサイズの変更
・目次をつける (この記事)
これでようやくスタート地点に立った感じです。
これから頑張って参ります。
