A powerful, lightweight Gutenberg block that automatically generates a linked, navigable table of contents from your post headings.

Moses Cursor Ssebunya

Mocursor Smart TOC is a lightweight, feature-packed Gutenberg block that automatically generates a linked table of contents from the headings in your posts and pages. Simply drop it into your content — it just works. Also available as a <code>[mctoc]</code> shortcode for classic editor users.
The block is fully dynamic, accessible, lightweight, and theme-aware. It uses WordPress design tokens and CSS custom properties so it inherits your theme’s colors, fonts, and spacing automatically.
<h4>Shortcode Support</h4>
The Mocursor Smart TOC block is also available as a <code>[mctoc]</code> shortcode for use in the classic editor, widgets, or theme templates.
Basic usage:
<pre><code>[mctoc]
</code></pre>
With options:
<pre><code>[mctoc title="On This Page" include_h2="true" include_h3="true" include_h4="false" numbering="nested" collapsed="true" sticky="true" offset="100" skip="1" exclude_headings="Related Posts,Comments" back_to_top="true"]
</code></pre>
Available shortcode attributes:
<ul>
<li><code>title</code> — TOC heading text (default: “Table of Contents”)</li>
<li><code>include_h2</code> — Include H2 headings: “true” or “false” (default: “true”)</li>
<li><code>include_h3</code> — Include H3 headings: “true” or “false” (default: “true”)</li>
<li><code>include_h4</code> — Include H4 headings: “true” or “false” (default: “true”)</li>
<li><code>exclude_headings</code> — Comma-separated heading texts to exclude</li>
<li><code>numbering</code> — Numbering style: “none”, “decimal”, or “nested” (default: “none”)</li>
<li><code>collapsed</code> — Start collapsed: “true” or “false” (default: “false”)</li>
<li><code>sticky</code> — Enable sticky mode: “true” or “false” (default: “false”)</li>
<li><code>offset</code> — Scroll offset in pixels for fixed headers (default: 80)</li>
<li><code>skip</code> — Number of headings to skip from the start (default: 0)</li>
<li><code>back_to_top</code> — Show “Back to Top” link: “true” or “false” (default: “false”)</li>
</ul>
<h4>Ideal Use Cases</h4>
Mocursor Smart TOC is perfect for:
<ul>
<li>Long-form blog posts — Help readers navigate 2,000+ word articles with ease.</li>
<li>Documentation and knowledge bases — Technical docs, how-to guides, and reference pages.</li>
<li>Online courses and tutorials — Give learners a clear roadmap of every lesson section.</li>
<li>Legal, policy, and compliance pages — Terms of service, privacy policies, and similar documents.</li>
<li>Product and feature pages — Long product descriptions with multiple sections.</li>
<li>Recipe and travel blogs — Readers can jump to the section they care about.</li>
<li>Wiki-style internal sites — Any WordPress site used as an internal wiki or resource library.</li>
<li>Accessibility-focused sites — The TOC gives keyboard and screen reader users a reliable way to navigate.</li>
<li>Classic editor users — The shortcode works perfectly in the classic editor.</li>
</ul>
<h4>Why Choose Mocursor Smart TOC?</h4>
<ol>
<li>Zero configuration needed — Drop the block in and it works immediately.</li>
<li>100% Gutenberg-native + Shortcode — Built as a real Gutenberg block with a classic shortcode fallback.</li>
<li>Dynamic and always up to date — Server-rendered, always matches the current content.</li>
<li>Incredibly lightweight — No JavaScript frameworks. Pure vanilla JS for all interactivity.</li>
<li>Deeply customizable — Rich inspector controls for heading levels, numbering, collapsibility, sticky mode, and more.</li>
<li>Accessible by default — Proper ARIA attributes, keyboard navigation, semantic HTML, and focus management.</li>
<li>Theme-aware — Uses WordPress design tokens and CSS custom properties.</li>
<li>No lock-in — Deactivate the plugin and your content is untouched.</li>
<li>Privacy-friendly — No external requests, no tracking, no analytics, no cookies.</li>
<li>Open source — Licensed under GPLv2.</li>
</ol>
<h4>Block Features</h4>
<ul>
<li>Automatic heading detection for H2, H3, and H4</li>
<li>Heading level filtering with individual checkboxes</li>
<li>Exclude specific headings by text</li>
<li>Skip first N headings option</li>
<li>Three numbering styles: None, Decimal, Nested</li>
<li>Collapsible TOC with configurable default state</li>
<li>Smooth scrolling with configurable offset</li>
<li>Active heading highlight via IntersectionObserver</li>
<li>Back to Top link</li>
<li>Sticky mode</li>
<li>Live editor preview</li>
<li>Full block editor design controls (colors, typography, spacing, borders)</li>
<li>Shortcode support with full attribute control</li>
</ul>
<h4>How to Use</h4>
Method 1: Block Editor
<ol>
<li>Install and activate the plugin.</li>
<li>Open any post or page in the block editor.</li>
<li>Click the block inserter (+), search for “Mocursor Smart TOC”, and insert the block.</li>
<li>Customize via the block settings sidebar.</li>
<li>Publish — the TOC renders with smooth scrolling and active heading tracking.</li>
</ol>
Method 2: Shortcode
<ol>
<li>In any post, page, or widget, type <code>[mctoc]</code>.</li>
<li>Optionally add attributes: <code>[mctoc title="Contents" numbering="decimal" collapsed="true"]</code>.</li>
</ol>
Method 3: PHP Template
<pre><code><?php echo do_shortcode( '[mctoc title="Page Contents" numbering="nested"]' ); ?>
</code></pre>
Tips:
<ul>
<li>Place the TOC inside a Group block with a max-width for a contained look.</li>
<li>Enable sticky mode for sidebar layouts.</li>
<li>Use the shortcode in classic editor widgets or template files.</li>
</ul>

Mocursor Smart TOC


Nice plugin. Works well and it is easy to integrate. I would love to see an option to align the toc on the page. Currently it is in the middle, but it would be nice to be able to align it left or right.


Alternatives to Mocursor Smart TOC

Top alternatives