Mai Table of Contents

Add a table of contents to the beginning of your posts or pages to improve readability. The table is auto-created from your heading structure so readers can jump to the section they want easily.

Learn how to install plugins here.

How To Automatically Display Table Of Contents

View Dashboard > Mai Theme > Table of Contents.
Enable the auto-display on any post types you want.

How To Manually Display Table Of Contents

Edit a post or page that has a lot of headings and structure that would benefit from a table of contents.
Add a Mai Table of Contents block wherever you'd like it to display in your content.

If you are auto-displaying the table of contents you can still manually add a Mai Table of Contents block in your content. That will override the auto-display and only one TOC will be displayed. This gives you precise control over the TOC location on specific posts while still allowing it to be automatically added to other posts.

Settings

Post Types

Automatically display the table of contents at the beginning of the selected post types.

Style

The design style for the table of contents.

Load Open/Closed

Whether to load the table of contents open or closed by default.

Minimum Headings

The table of contents will only display if the content has at least this many h2 headings.

Code Snippets

If you did some trickery and have a TOC somewhere besides the default locations, you may need to run a filter to let the plugin know. This may happen if you put a TOC in the Sidebar or other custom locations.

/**
 * Tell Mai Table of Contents that we have a custom TOC.
 * 
 * @param bool $has_custom Whether or not we have a custom TOC.
 * @param int  $post_id    The post ID.
 * 
 * @return bool
 */
add_filter( 'mai_table_of_contents_has_custom', function( $has_custom, $post_id ) {
	// Bail if already has a custom TOC.
	if ( $has_custom ) {
		return $has_custom;
	}

	// Bail if not the post type we want.
	if ( 'post' !== get_post_type( $post_id ) ) {
		return $has_custom;
	}

	// Yes, we have a custom TOC.
	return true;

}, 10, 2 );