How To Add A Sticky Table Of Contents With BetterDocs?

Mit BetterDocs, you can add a sticky Table Of Contents (TOC) to your Single Doc page in Shopify. If you use multiple headings (or heading tags) in your documentation, this knowledge base app will include the headings inside the TOC box that will stay afloat over the documentation page. The TOC allows your users to bounce back and forth between different sections in your document.

How To Add A Sticky Table Of Contents With BetterDocs? #

Follow the step-by-step guide below to learn how to add a sticky table of contents in single docs in just a few steps.

Note: You must have the BetterDocs for Shopify app installed on your store to add a sticky Table of Contents to your documents.

Step 1: Enable The Table Of Contents #

To enable and add a sticky TOC in your single documentation using BetterDocs, you need to first navigate to the ‘die Einstellungen’ tab from the app’s homepage. Then, click on the ‘Table Of Contents’ option from the side panel as shown below.

sticky table of content

Simply toggle to enable the ‘Table Of Contents (TOC)’ option. You can directly click on the ‘Save Changes’ button, or configure the other options that appear as you need.

sticky table of content

Step 2: Configure The Table Of Contents #

After you enable the TOC, you can add a suitable ‘TOC Title’ to it to match your documentation. You can also select which heading tags will be displayed on the TOC from the ‘TOC Supported Heading Tag’ option to highlight the necessary sections in your doc.

sticky table of content

You can also enable the toggle button to apply TOC hierarchy or display list numbers for the headings in the TOC. Make sure to toggle on the ‘Sticky TOC‘ option to create a make your Table Of Contents be available on your web page even as the reader scrolls through.

sticky table of content

And to make your documentation more accessible on all devices, you can make the Table Of Contents collapsible on small devices.

Step 3: Design The Table Of Contents #

Once you have enabled the TOC, you can design different aspects of the Table Of Contents to match your store’s branding. To do so, navigate to the DesignTable Of Contents. 

sticky table of content

Here, you will get two sections: Basic & TOC List Items. You can vary any of the options in these two sections, such as changing the Table Of Content width, the background color, title color, font size, etc. Find out more from this documentation.

sticky table of content

The Final Outcome Of The Sticky Table Of Contents #

This is how easily you can add and design a Table Of Content and configure it to make it sticky on Shopify using BetterDocs. It will instantly improve user experience by allowing them to navigate between sections. 

sticky table of contents

Still, facing difficulties? Feel free to contact our dedicated support team.

Unterstützt von BetterDocs