Getting started

After installing Joli Table of Contents, you will be redirected to the settings page.

To get started, the most important settings that you need to focus on are the following:

Headings overflow

GENERAL > TABLE OF CONTENTS > Headings overflow

This option defines whether or not the heading will wrap or will be truncated on a single line if the length of the heading exceeds the width of the actual table of contents.

Truncated headings
Wrapped headings

Headings full row clickable

GENERAL > TABLE OF CONTENTS > Headings full row clickable

This option allows a heading to be clicked on its full width OR on its text only.

Activate this option for more convenience or if you have some background effects.

Clickable area: Full row (red) vs Text link only (yellow)

Table of contents title

GENERAL > TABLE OF CONTENTS HEADER > Table of contents title

Customize the Table of contents title to your liking or your language.

Table of contents toggle


Choose from different toggle styles : Animated icon / Icon / Text

Depending on the option you choose, you can select either the text or the icon that you want.

Toggle icon
Toggle text


GENERAL > NUMERATION > Numeration type

The numeration option will prefix automatically each heading with a number.

You can choose between decimal numbers, roman numbers, hexadecimal or even binary (why not!).

Also, the Numeration display option lets you choose to display the current level only or the parents level also.

No numeration
Decimal, single
Decimal, full

Headings processing depth


By default, all the headings are picked up from H2 to H6.

If you wish to have the Table of contents pick up on H2 & H3 headings only, you need to deselect H4, H5, & H6.

H2 & H3 headings selected

Choose the default theme


Choose a base theme for your website from the available items in the list.

You can override its presets in the STYLE tab.

Further customization


In order to customize more in details the Table of contents, you can override any of the current theme’s preset from the available options.

The Styles are categorized according to the structure of the Table of contents. Hover on the “Visualise” info icon to see what part of the TOC the section is styling.

Changing any setting will result in overriding the selected theme’s defaults, if applicable.

Switching from theme to theme with exisiting styling options could result in unexpected visual effects.

Was this page helpful?