Table of Contents WordPress Block

Table of Contents

This document is part of the WordPress block reference and is intended for developers.

Summarize your post with a list of headings. Add HTML anchors to Heading blocks to link them here.

This block is experimental and only available with the Gutenberg plugin.

Last updated

March 13, 2025

Category: Design

For developers

View source on GitHub

Block Grammar & Markup

<!-- wp:table-of-contents {"headings":[{"content":"Heading text","level":2,"link":"#heading-id-1"},{"content":"A sub-heading","level":3,"link":"#heading-id-2"}]} -->
<nav class="wp-block-table-of-contents"><ol><li><a class="wp-block-table-of-contents__entry" href="#heading-id-1">Heading text</a><ol><li><a class="wp-block-table-of-contents__entry" href="#heading-id-2">A sub-heading</a></li></ol></li></ol></nav>
<!-- /wp:table-of-contents -->

Block Attributes

Optional. Type: Object.

Attributes provide the structured data needs of a block. They can exist in different forms when they are serialized, but they are declared together under a common interface.

Documentation

{
  "headings": {
    "type": "array",
    "items": {
      "type": "object"
    },
    "default": []
  },
  "onlyIncludeCurrentPage": {
    "type": "boolean",
    "default": false
  }
}

Block Supports

Optional. Type: Object.

A set of options that enables or disables block controls in the editor, for example gradient colors or padding.

Documentation

{
  "html": false,
  "color": {
    "text": true,
    "background": true,
    "gradients": true,
    "link": true
  },
  "spacing": {
    "margin": true,
    "padding": true
  },
  "typography": {
    "fontSize": true,
    "lineHeight": true,
    "__experimentalFontFamily": true,
    "__experimentalFontWeight": true,
    "__experimentalFontStyle": true,
    "__experimentalTextTransform": true,
    "__experimentalTextDecoration": true,
    "__experimentalLetterSpacing": true,
    "__experimentalDefaultControls": {
      "fontSize": true
    }
  },
  "interactivity": {
    "clientNavigation": true
  },
  "__experimentalBorder": {
    "radius": true,
    "color": true,
    "width": true,
    "style": true,
    "__experimentalDefaultControls": {
      "radius": true,
      "color": true,
      "width": true,
      "style": true
    }
  }
}

View blocks per attribute or block support:

Block Attributes