Add a table of contents (TOC) to your blog posts

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • SaaSHub - Software Alternatives and Reviews
  • jekyll-toc

    Jekyll plugin which generates a table of contents.

  • Jekyll has the jekyll-toc plugin. I can vouch for this one, as I use it on an active website. It has excellent configuration options. It is one of the few I have seen where you can exclude individual headings within a page, so you can slim down the size of the table of contents.

  • eleventy 🕚⚡️

    A simpler site generator. Transforms a directory of templates (of varying types) into HTML.

  • Eleventy has the eleventy-plugin-toc plugin.

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
  • kramdown

    kramdown is a fast, pure Ruby Markdown superset converter, using a strict syntax definition and supporting several common extensions.

  • The Kramdown markdown parser-converter that is used by Jekyll, has the ability to generate a TOC. If all is want is a TOC, it does the job.

  • Jekyll

    :globe_with_meridians: Jekyll is a blog-aware static site generator in Ruby

  • Jekyll has the jekyll-toc plugin. I can vouch for this one, as I use it on an active website. It has excellent configuration options. It is one of the few I have seen where you can exclude individual headings within a page, so you can slim down the size of the table of contents.

  • Hugo

    The world’s fastest framework for building websites.

  • Hugo has built-in support for adding a TOC.

  • browser-compat-data

    This repository contains compatibility data for Web technologies as displayed on MDN

  • Elsewhere around the web, you may have seen a two column layout with the TOC in a sidebar. This is more common for documentation-centric websites like MDN web docs. They tend to hide the TOC for smaller screen sizes.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts