見出し画像

Table of contents ブロックを notion-block-renderer へ機能追加のお知らせ


Notionブロックをレンダリングするパッケージ notion-block-renderer を開発しています。

この度(2022-09-01)、ブロックタイプのなかの、目次に相当する table_of_contents も使えるように機能追加しました。

Notionの中では見出しブロックがある状態で、table of contents を使うと目次項目が自動生成されます。

notion-block-renderer では、table_of_contents がある場合、

  • 見出し1、見出し2、見出し3のブロックを探し、

  • それらのテキストを含めた目次を生成。

  • 各見出しブロックには id属性にブロックidを付与。

  • 目次の各項目は aタグになっており、href属性に上記idをセット。

以上によって、見出しブロックまでページ内リンクで飛ぶことができるようになります。

試しに以下では table_of_contents ブロックと見出しブロックでどのようになるかを載せておきます。

下記が Table of contents 。

下記がサンプルの見出し。

Heading1

Heading2

Heading3

Heading2


それぞれの目次項目をクリックすると該当の見出しまで飛ぶことができます。


  • ✍️ 僕のHP (www.takux.one)ではプログラミングコースのクーポン特典などを載せてます。

  • Twitter (@takuxone)ではプログラミング以外についてや、たまにクーポン情報もつぶやいたりしています。ツイッターでもお待ちしてますー。

https://www.takux.one
https://twitter.com/takumafujimoto


この記事が気に入ったらサポートをしてみませんか?