ButterCMS Logo

Advanced tables and table of contents: build better long-form content in ButterCMS

Published on
Updated on
4 min read
Butter Updates

ButterCMS now includes advanced tables and an automatic table of contents in the WYSIWYG editor. The table of contents is generated from the headings already in your content, covers heading levels H1 through H3, and rebuilds with one click whenever those headings change. Tables get an upgrade too, including automatic row numbering and a richer set of editing controls.

Until now, tables offered only basic controls, so editors kept layouts simple to avoid fighting the tool. And there was no way to generate a table of contents at all: teams typed the list by hand, wired up anchor links, and then watched the whole thing drift out of date the first time someone renamed a heading.

What's new in ButterCMS

  • Insert a table of contents generated from your headings, down to H3.
  • Refresh the table of contents with one click after you add, remove, or rename headings.
  • Number table rows automatically with the new row numbering control.
  • Edit tables with more capable tools than the previous basic controls.
  • Get finer control over lists with the enhanced list options.

All of it lives in the WYSIWYG toolbar, and the new buttons are available in the schema builder's custom toolbar picker, so you can decide per field which ones your editors see.

See it in action

The workflow is short:

  1. Structure your content with headings, the way you already do.
  2. Click Table of Contents in the toolbar. Butter inserts a linked TOC built from your H1, H2, and H3 headings.
  3. Keep writing. When your headings change later, click Update Table of Contents and the list rebuilds to match.

Row numbering works the same way. It sits inside the table tools and toggles on with one click, and the numbers stay correct as you add or reorder rows.

There is nothing to configure and nothing to migrate. The buttons show up in the editor as soon as the release ships, and existing content is untouched.

How this helps your team work faster

  • Inserting a TOC takes one click instead of hand-typing a list and its anchor links.
  • Renaming a heading no longer breaks navigation. Click Update and the TOC matches again.
  • Row numbers maintain themselves, so nobody renumbers a 40-row table after inserting one row in the middle.
  • Editors stop dumbing down table layouts to avoid the old, limited controls.

Who benefits

Content managers and marketers

If you publish long guides, documentation, or comparison posts, the table of contents removes the most fragile part of the job. You write with headings as usual, insert the TOC, and click Update when the structure changes. No more hunting for the anchor link that broke.

Teams that publish long-form content

A guide with a working table of contents is easier to navigate and looks finished. You get that without anyone on the team maintaining anchor lists by hand.

What developers should know

Nothing changes in the Content API. Tables and the table of contents are authored in the editor and delivered as standard HTML, the same as the rest of your WYSIWYG content. The TOC entries are plain anchor links to the headings in the same field. If your site renders WYSIWYG fields today, it already renders these. There is no new endpoint and no migration to run.

What the table of contents is not

A few boundaries worth knowing before you rely on it:

  • It is generated from headings, not curated by hand. To reorder entries, reorder your headings.
  • It includes headings H1 through H3. H4 and deeper are left out.
  • It does not refresh itself on publish. After changing headings, click Update Table of Contents to bring the list back in sync.

Availability

Advanced tables and the table of contents are editor capabilities, not plan-gated features, so they are available on every plan. Any user who can edit content in a WYSIWYG field can use them.

What's next

This is phase two of the WYSIWYG editor upgrade, following editor templates. Coming next: a built-in spellchecker, then writer productivity tools.

If you're on ButterCMS today, open your longest post, click Table of Contents, and delete the hand-built list you've been maintaining. Not a customer yet? Sign up for a free trial and try it on your first guide.



Author

Spent years writing backend code before moving into product, and kept one foot in the codebase. Now I work out what customers need and then get it built.