← Back to Guides
How-ToAdding a Table of Contents to Your Document
Published on 2026-02-22

Adding a Table of Contents to Your Document

Learn how to automatically generate a clickable Table of Contents from your Markdown headings for both HTML and PDF output.

A Table of Contents (TOC) is automatically generated from the heading structure of your Markdown document. This guide explains how it works, how to control it, and best practices for structuring your headings.

How Automatic TOC Generation Works

The editor scans your document for all headings (#, ##, ###, etc.) and builds a nested, clickable TOC from them. The TOC is inserted before the main content in the rendered HTML and PDF output.

Each heading becomes:

  1. A numbered entry in the TOC
  2. An anchor link — clicking the TOC entry jumps to that section

Enabling and Disabling the TOC

Use the TOC toggle in the preview toolbar to show or hide the Table of Contents. The toggle is persistent per document — your preference is saved automatically.

When the TOC is enabled:

  • It appears at the top of the preview panel
  • It is included in the exported PDF
  • Each heading is linked and navigable in the HTML share view

When disabled, the document body starts immediately without the TOC section.

Heading Hierarchy Best Practices

The TOC quality depends entirely on how well you structure your headings. Follow these rules:

Rule 1: Use Only One H1

The H1 heading (# Title) should be your document title and appear exactly once, at the top.

markdown
# My Document Title   ← Only one of these

## Introduction       ← Use H2 for sections
## Background
### Context           ← Use H3 for sub-sections
## Conclusion

Rule 2: Don’t Skip Heading Levels

Jumping from H2 to H4 confuses both readers and TOC generators:

markdown
<!-- Bad -->
## Section
#### Sub-sub-section   ← skipped H3

<!-- Good -->
## Section
### Sub-section
#### Detail

Rule 3: Keep Headings Concise

TOC entries should be short enough to read at a glance. Long headings wrap awkwardly in the TOC sidebar.

markdown
<!-- Too long -->
### A Detailed Explanation of All the Configuration Options Available

<!-- Better -->
### Configuration Options

Example: Well-Structured Document

markdown
# Q1 Financial Report

## Executive Summary

## Revenue Analysis
### Product Revenue
### Service Revenue
### YoY Comparison

## Cost Breakdown
### Operating Expenses
### Capital Expenditure

## Outlook and Recommendations

## Appendix
### Data Sources
### Methodology

This structure produces a clean, four-level TOC that is easy to navigate.

TOC in PDF Output

In the exported PDF, the TOC appears on its own section at the beginning of the document. Entries are styled to match the document theme, with dot leaders connecting the entry text to the page indicator in the HTML view.

Each heading generates a unique URL anchor derived from its text:

Heading Anchor
## Introduction #introduction
## Key Findings #key-findings
### Sub-section (1) #sub-section-1

Spaces become hyphens, special characters are stripped, and duplicate headings get a numeric suffix.

You can link directly to a section from within the same document:

markdown
See the [Conclusion](#conclusion) for a summary.