plugin
Utilities

Easy Table of Contents

Table of Contents Plugin for Joomla

J4 J5 J6
5.0 v1.0
Easy Table of Contents

Long articles are easier to scan when readers can jump between sections. Easy Table of Contents builds that outline automatically from your headings, so you keep writing normally and the navigation stays in sync.

This demo page is intentionally longer than a short pitch. Scroll the page, use the TOC links, and watch the active section update when scroll-spy is enabled. That is the experience your visitors get on documentation, guides, and editorial content.

Getting Started

Install the plugin package, enable Content - Easy Table of Contents, then open any article that already uses H2 and H3 headings. With Auto Insert turned on, the TOC appears before the article body as soon as the heading count meets your minimum threshold.

If you prefer full control over placement, set Insert Position to None and drop {easy_toc} where you want the outline to appear. That is useful for lead paragraphs, callouts, or mid-article summaries.

Install the package

Download EasyTableOfContents_UNZIP.zip, unzip it, and install plg_content_easy_toc_1.0.1.zip from System > Install > Extensions. Enable the plugin, clear Joomla cache, and reload a long article.

No template override is required for the default experience. Assets load through the Web Asset Manager, and the markup is scoped under the jx-etoc root class so it stays isolated from most template styles.

Choose heading levels

Defaults cover H2 through H4, which matches most blog and documentation styles. Narrow the range for flat marketing pages, or widen it to H2 through H6 when you publish dense manuals.

Headings that should stay out of the outline can use the exclude class (default no-toc). That keeps decorative titles or repeated callout headings from cluttering the list.

Layouts and Themes

Easy TOC ships with five layouts so the same plugin can feel native in a sidebar, a docs hero, or a mobile-first article. Pair each layout with a theme to match your brand without writing custom CSS on day one.

Numbered outline

Numbered layout adds 1 / 1.1 style markers. It works especially well for tutorials, changelogs, and policy pages where readers refer to sections by number in support tickets or comments.

Nested headings inherit the numbering hierarchy automatically. You do not maintain a separate list in the article editor.

Cards on mobile

Cards layout uses larger tap targets and spaced rows. On phones, that makes jumping to a section faster than hunting through a dense nested list.

Compact and Flat layouts remain available when you want a quieter outline that still supports scroll-spy highlighting.

Behaviour That Helps Readers

Sticky mode keeps the TOC in view while the article scrolls on desktop. Combined with scroll-spy, the current section stays highlighted so readers always know where they are in a long guide.

Smooth scroll includes an offset setting for sticky site headers. If a jump lands slightly under your menu, increase Scroll Offset until the heading sits comfortably below the chrome.

Hidden from TOC

This heading uses the no-toc class on purpose. It appears in the article body, but it is skipped in the outline so demos can show exclusion without removing useful content.

Collapsible panels

Collapsible mode is handy on mobile or when the TOC is placed high on the page. Readers can open the outline when they need it and collapse it when they want more room for the article.

Shortcode Overrides

Global plugin settings define the default look. Per-article shortcodes let you demonstrate multiple styles on one site without changing the plugin configuration between page loads.

Examples:

{easy_toc layout="numbered" theme="bold" title="Contents"}
{easy_toc layout="compact" theme="minimal" sticky="1"}
{toc}

When a shortcode is present, Easy TOC replaces that token and does not also auto-insert a second outline at the top of the same article body.

Writing Tips for Better Outlines

Use clear, descriptive headings. Readers scan the TOC before they commit to the full article, so vague titles like "Overview" or "More info" waste the navigation.

Keep one idea per H2 and use H3 for supporting detail. That hierarchy is what nested layouts and numbered markers communicate at a glance.

Intro length

A short intro before the first H2 helps people understand the page goal. If you want the TOC after that intro, place the shortcode under the lead paragraphs instead of relying on auto insert.

Exclude sparingly

Reserve no-toc for headings that are decorative or duplicated. Over-excluding makes the outline feel incomplete and reduces trust in the navigation.

What Buyers Usually Configure First

Most sites start with Auto Insert, H2-H4, Classic theme, and scroll-spy enabled. From there, agencies often add sticky mode on documentation templates and numbered layout on knowledge-base categories.

Category and article filters are available when only selected sections of the site should show a TOC. That keeps marketing landing pages clean while long-form content stays navigable.

Mobile Menu

Login

Don't have an account yet? Register now!