はてなブログユーザーさんのブログを拝見すると、記事の冒頭部分に「目次」が付いていることがあります。直下に書いたようなそれです。
目次
目次は手書きでつけているのか？
皆さんがどうやって目次を付けているのかが不思議で不思議でたまりませんでした。HTML/CSSをほとんど知らないと仰っている方でも普通に記事に目次が書き込まれているので、知らないと謙遜しているだけで本当は知っているのではないかと疑ったこともありました。
手書きで見出しのhタグに対してclassを振ってアンカーリンク（ページ内ジャンプ）をしていると思っていたんです。いや、中には本当に手書きでアンカーリンクを付けている方もいるかもしれないですね。
はてなブログの記事内に目次をつける方法
そうやって悶々とするだけで1年近くも調べないままでいましたが、今週に入ってから何となく「はてなブログ 目次」で検索をかけたところ、すぐに見つかりました。それが上に貼った記事です。『はてなブログ開発ブログ』さんの「記事中の見出しから目次を自動的に作成する「目次記法」を追加しました」です。はてなブログのことははてなブログに聞け、ということですね。
これによると記事内の任意の場所に下記のように記述するだけです。前後には文字や空白を入れず1行で指定してください、と。記法は「見たまま」でも「はてな」でも「Markdown」でもどれでも良いですよ、と。
[:contents]
悩んだ日々は何だったのかというくらいにシンプルな方法です。実際には悩んだのは一瞬でほとんど放置していたんですけど。
はてなブログの記事内にソースコードを貼り付ける方法
上の「:contents」部分（実際は:contentsを[]で挟みます）のように、はてなブログの記事内にソースコードを貼り付ける場合はどうするのかということについては、『はてなブログ ヘルプ』の「［はてな記法］ソースコードを色付けして表示する（シンタックス・ハイライト）」に書かれていました。参考にさせていただきました。「:contents」をソースコードと呼ぶことが適当かどうかはよくわかっていないで書いています。
この記事が言いたいことは、貼ったソースコードに色付けをすることなのですが、本記事の場合はハイライトをせずにソースコードを貼る方法として参考にしました。
はてなブログの記事内にソースコードを貼る方法は、ソースコードを「>||」と「||<」で挟むだけ。こちらもシンプルでした。
しかし、こちらは幾つか気をつけなければいけない点があります。それは「>||」と「||<」はいずれも文頭に持ってくることと、「はてな記法」でのみ書き込める方法だということです。本記事ははてな記法で書いています。いつもは見たままです。
