つい最近、はてなブログの見出し(h1からh6までのタグ)にid属性が付与されるようになった。
ということは、見出しへのリンクを作って共有できる。ただ普通に暮らしていると、このリンクを生成するためにDeveloper Toolsを表示して見出しのidを入手してURLにhash fragmentを設定して… という手順になってしまいやや煩雑。GitHubのMarkdownのように、hoverしたらリンクアイコンが表示されて見出しのリンクに飛べる、となっていたい。
ということで、自分のブログで同じことができるようにしてみた。以下の記事で試せる。
以下のコードを 設定 > 詳細設定 > headに要素を追加 に貼って保存することで利用できる。テーマによってデザインなどは変える必要があるかもしれない。各々の環境にあったようにカスタムされたい。あとレスポンシブ環境では試していない。
リンクアイコンはFont Awesomeから持ってきていて、アイコンSVGのライセンスはCC BY 4.0なので留意されたい。
他の部分はMITライセンスとした。
過去(おそらく8月中旬より前?)の記事については再度保存しないとidが挿入されないようなのでこちらも注意されたい。新しく書く記事については問題なく挿入されている。
長い記事を書いて見出しをつけたときに便利です。よければご利用ください。
