cr8vstacks

<p><a href="https://cr8vstacks.com/dev-playground/cr8vstacks-table-of-contents/" rel="nofollow ugc">Official Plugin Homepage & Demo</a></p>
<p>Cr8vstacks Table of Contents automatically generates a polished, accessible table of contents for WordPress posts and pages. It builds links from your headings, adds stable anchors where needed, and gives readers a clearer way to move through long-form content.</p>
<p>The plugin includes four frontend layouts: Manuscript, Soft Editorial, Brutalist, and Minimalist. Each layout has its own header treatment, body structure, child-heading styling, reading progress style, and Hide/Show button design.</p>
<p>Cr8vstacks Table of Contents is built for Gutenberg and classic publishing workflows. It works with Block Editor headings, adds a Block Editor sidebar for per-post controls, includes a Classic Editor meta box, supports Quick Edit, and can be placed manually with the <code>[wptw_toc]</code> shortcode.</p>
<p>For SEO and content navigation, the plugin outputs crawlable anchor links and structured on-page navigation. This can help readers and search engines understand long articles, but it does not replace a dedicated SEO plugin for metadata, schema, sitemaps, or content scoring.</p>
<h4>Key Features</h4>
<ul>
<li>Auto-generates a TOC from selected heading levels, H2 through H6.</li>
<li>Preserves existing heading IDs when possible.</li>
<li>Adds generated anchors for headings that need them.</li>
<li>Configurable placement before the first heading, after the first paragraph, or shortcode only.</li>
<li>Four selectable layouts: Manuscript, Soft Editorial, Brutalist, and Minimalist.</li>
<li>Live dashboard preview using the same frontend stylesheet.</li>
<li>Color presets plus individual controls for card, header, links, numbers, progress, toggle, and back-to-top colors.</li>
<li>Typography controls for font stack, link size, child size, label size, reading time size, number size, label spacing, label transform, and border radius.</li>
<li>Reading time estimate with configurable words per minute.</li>
<li>Scroll reading progress indicator that matches the active layout.</li>
<li>Active-section highlighting and read/done states.</li>
<li>Sticky TOC header with configurable top offset.</li>
<li>Optional hierarchical numbering.</li>
<li>Optional back-to-top button.</li>
<li>Per-post controls for disabling the TOC, title, state, placement, numbers, sticky header, and reading time.</li>
<li>No remote font files are loaded; font choices use local or theme-available font stacks.</li>
<li>Frontend behavior does not require jQuery.</li>
</ul>
<h4>Layouts</h4>
<ul>
<li>Manuscript: dark editorial chapter style with timeline markers, amber progress, and depth-aware child links.</li>
<li>Soft Editorial: clean card layout with guided sections, completed-state checkmarks, and nested child rows.</li>
<li>Brutalist: bold dark layout with darker header, offset border extension, squared controls, and high-contrast active rows.</li>
<li>Minimalist: original clean light card layout for a simple classic TOC.</li>
</ul>
<h4>Gutenberg, Elementor And Per-Post Controls</h4>
<p>Cr8vstacks Table of Contents supports headings created in the WordPress Block Editor and Elementor page builder. The Block Editor sidebar and Elementor Page Settings panel let editors override TOC settings per post/page (such as disabling the TOC) without changing global defaults.</p>
<p>Per-post controls are also available in the Classic Editor meta box and Quick Edit. Manual placement is available through the Shortcode block or Elementor shortcode widget with <code>[wptw_toc]</code>.</p>
<h4>Design Controls</h4>
<p>The settings dashboard includes Visibility, Headings, Layouts, Display, Colours, Typography, and Advanced tabs. The live preview updates before saving so site owners can test layouts, color presets, typography, display options, progress indicators, and visibility behavior.</p>
<p>The Default color preset restores each layout’s native palette. Light, Dark, Ocean, Forest, and Rose presets can be customized through the same color controls.</p>
<h4>SEO And Content Navigation</h4>
<p>The plugin can help SEO indirectly by creating crawlable heading anchor links and clearer internal jump navigation for long-form content. Better structure can improve scanability and reader engagement. It does not manage meta titles, descriptions, schema, XML sitemaps, or keyword analysis.</p>
<h3>Shortcode</h3>
<p>Use <code>[wptw_toc]</code> anywhere in your content when Position is set to “shortcode only”. Layout, color, typography, display, and per-post settings still apply.</p>


Cr8vstacks Table of Contents

Customizable table of contents with layouts, live preview, active tracking, reading time, sticky headers, and per-post controls.

Marcin Pietrzak

<p>Reading Position Indicator adds a stylish horizontal progress bar alongside your content, showing readers how far they’ve scrolled. It enhances user engagement by providing a clear visual cue of reading progress, ideal for blogs, articles, and long-form content.</p>
<p><strong>Features</strong><br />
* Horizontal progress bar displayed on posts and pages.<br />
* Customizable colors, opacity, rounded edges, and gradients.<br />
* Lightweight and performance optimized.<br />
* Easy setup with no coding required.<br />
* Translation ready.<br />
* Compatible with most WordPress themes.</p>
<p>Thank you <a href="http://pankajparashar.com/" rel="nofollow ugc">Pankaj Parashar</a> for your article on CSS-TRICKS about <a href="https://css-tricks.com/reading-position-indicator/" rel="nofollow ugc">Reading Position Indicator</a></p>


Reading Position Indicator

Add reading position indicator on page top.

Cr8vstacks Table of Contents vs Reading Position Indicator