Since the release of the v2.7.0 of Joli Table Of Contents, it is now possible to add an icon next to the table of contents Title.
This new feature is based on SVG icons and aims to improve the overall look of the table of contents.
Why use an icon for your table of contents ?
Your table of contents is an essential navigation tool, but why not make it more visually engaging? With the new TOC Title Icon feature, you can add a custom icon next to your TOC title, making it stand out instantly. This simple yet powerful addition enhances the visual appeal of your TOC, catching your readers’ attention and improving the overall readability of your content.
Beyond aesthetics, using an icon helps create a more cohesive and branded look for your blog. Whether you choose a stylish symbol, a brand-related icon, or a fun visual cue, this feature allows you to personalize your TOC to match your website’s theme and personality.
A well-placed icon can also make your content feel more structured and professional, encouraging visitors to engage with your posts.
Try the TOC Title Icon feature today and give your table of contents a fresh, eye-catching touch!
How to insert and customize an icon ?
From the settings switch on the Use title icon option, under the GENERAL > TABLE OF CONTENTS HEADER section.
Once switched on, the Title icon setting will show up, letting you pick an icon.
To further customize the icon, you can adjust its size, stroke width (to make it look more or less thick), and color.
How to use a custom icon ?
If you prefer to use a custom image or a custom SVG as a Table of contents title icon, you can leverage the new joli_toc_title_icon filter hook.
This way, you could easily insert your brand logo or a custom multi-colored SVG.