そうだ！Bloggerの記事に目次を付けよう！

見出し要素が複数あるような記事の場合、目次を付けることによって記事の見通しを良くして、ユーザの使い勝手が良くなるのではないかと思いました。

そこで、Bloggerの記事に目次を自動的に付与するようなシステムを考えてみました。

コンセプトは以下のとおりです。

1. 個別の記事に目次を設定しなくても、自動的にすべての記事に目次を付与できる。
2. 見出し要素から自動的に目次を収集し、各見出しへのリンク付きの見出しを作成する。

自動的にすべての記事に見出しを付与する方法として、動的に JavaScript でページを解析して目次を生成することを思いつきました。



次回より実際に実装方法を検討していきます。

「Bloggerの記事に目次をJavaScriptで自動的に付与する」シリーズ

• そうだ！Bloggerの記事に目次を付けよう！
• 記事の要素の調査 - 準備編(1) - Bloggerの記事に目次をJavaScriptで自動的に付与する
• ページを開いたときに自動的に目次を付与する - 準備編(2) - Bloggerの記事に目次をJavaScriptで自動的に付与する
• 記事のページにのみ目次を付与する - 準備編(3) - Bloggerの記事に目次をJavaScriptで自動的に付与する
• とりあえず目次というテキストを挿入してみる(テスト環境) - 実践編(1) - Bloggerの記事に目次をJavaScriptで自動的に付与する
• とりあえず目次というテキストを挿入してみる(実際の環境) - 実践編(2) - Bloggerの記事に目次をJavaScriptで自動的に付与する
• とりあえず見出しを列挙してみる(テスト環境) - 実践編(3) - Bloggerの記事に目次をJavaScriptで自動的に付与する
• とりあえず見出しを列挙してみる(実際の環境) - 実践編(4) - Bloggerの記事に目次をJavaScriptで自動的に付与する
• 見出しにアンカーを付与し、目次から見出しへジャンプできるようにする(テスト環境) - 実践編(5) - Bloggerの記事に目次をJavaScriptで自動的に付与する
• 見出しにアンカーを付与し、目次から見出しへジャンプできるようにする(実際の環境) - 実践編(6) - Bloggerの記事に目次をJavaScriptで自動的に付与する
• シリーズ完結 - 最適化済みサンプル配布 - Bloggerの記事に目次をJavaScriptで自動的に付与する