{"id":5159,"date":"2022-03-24T15:11:15","date_gmt":"2022-03-24T09:11:15","guid":{"rendered":"https:\/\/betterdocs.co\/?post_type=docs&p=5159"},"modified":"2024-11-17T17:07:00","modified_gmt":"2024-11-17T11:07:00","password":"","slug":"sticky-table-of-contents-with-betterdocs","status":"publish","type":"docs","link":"https:\/\/betterdocs.co\/it\/docs\/sticky-table-of-contents-with-betterdocs\/","title":{"rendered":"How To Add A Sticky Table Of Contents With BetterDocs?"},"content":{"rendered":"

Con BetterDocs<\/strong><\/a>, you can add a Sticky Table Of Contents (TOC)<\/strong> 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 Table of Contents 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.<\/p>\n\n\n\n

How To Add A Sticky Table Of Contents With BetterDocs For Shopify?<\/strong><\/h2>\n\n\n\n

Follow the step-by-step guide below to learn how to add a sticky table of content in single docs in just a few steps.\u00a0<\/p>\n\n\n\n

Nota: <\/em><\/strong>You must have BetterDocs for Shopify<\/em> <\/em><\/strong>installed and activated<\/em><\/strong><\/a> on your store to create the documents.<\/em><\/p>\n\n\n\n

Step 1: Enable The Table Of Contents<\/strong><\/h3>\n\n\n\n

To enable and add a Table Of Contents in your single documentation using BetterDocs, you need to first navigate to the 'Impostazioni'<\/strong> tab from the app\u2019s homepage. Then, click on the \u2018Table Of Contents\u2019 <\/strong>option from the side panel. <\/p>\n\n\n\n

\"How<\/figure>\n\n\n\n

Now, \u2018Turn On\u2019<\/strong> the \u2018Table Of Contents\u2019<\/strong> button to show the table of contents on the document page. <\/p>\n\n\n\n

\"\"
<\/figcaption><\/figure>\n\n\n\n

Afterward, you can adjust the \u2018Content offset\u2019 <\/strong>and \u2018TOC supported heading tags<\/strong>\u2018 and click on the \u2018Save\u2019 <\/strong>button again.<\/p>\n\n\n\n

\"\"
<\/figcaption><\/figure>\n\n\n\n

Step 2: Configure The Table Of Contents<\/strong><\/h3>\n\n\n\n

To configure the TOC, go to the \u2018Design your TOC page<\/strong>\u2019 section and press on the \u2018Design now<\/strong>\u2019 option.<\/p>\n\n\n\n

\"\"
<\/figcaption><\/figure>\n\n\n\n

Now, navigate to the left sidebar and select the \u2018Basic design<\/strong>\u2019. From here you can toggle the on or off the \u2018Enable toc hierarchy<\/strong>\u2019, \u2018Toc list number<\/strong>\u2019, and  \u2018Enable sticky toc<\/strong>\u2019 options.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

You can customize the \u2018Sticky toc width<\/strong>\u2019, \u2018Sticky toc margin top<\/strong>\u2019, \u2018Background color<\/strong>\u2019, \u2018Content area padding<\/strong>\u2019 etc and click on the \u2018Save<\/strong>\u2019 button to make the Table of content more stunning.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Step 3: Advanced Control to Design The Table Of Contents<\/strong><\/h3>\n\n\n\n

Once you have enabled the TOC, you can design different aspects of the Table Of Contents to match your store\u2019s branding. To do so, click on the \u2018Design\u2019<\/strong> \u2192 \u2018List Item\u2019<\/strong> to customize them.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Now go to the right side and customize \u2018Title font-size\u2019, \u2018List item font-size\u2019, \u2018TOC margin\u2019 <\/strong>and more options to design the TOC as your to your preferences. After customizing just hit on the \u2018Save\u2019 <\/strong> pulsante. <\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

This is how easily you can add, configure, and design a Sticky<\/strong> Table Of Content <\/strong>on your Shopify account using BetterDocs.<\/p>\n\n\n\n

Still, facing difficulties? Feel free to contact our dedicated support team<\/strong><\/a>.<\/p>","protected":false},"excerpt":{"rendered":"

Learn how to easily add a sticky Table Of content on your Documentation page to help users navigate easily. <\/p>","protected":false},"author":16,"featured_media":12369,"template":"","meta":{"_eb_attr":"","inline_featured_image":false,"_eb_data_table":"","_analytify_skip_tracking":false,"footnotes":""},"doc_category":[309],"doc_tag":[10,230,14,23,69,54,53],"knowledge_base":[283],"class_list":["post-5159","docs","type-docs","status-publish","has-post-thumbnail","hentry","doc_category-configurations","doc_tag-betterdocs","doc_tag-betterdocs-knowledgebase-gutenberg","doc_tag-configuration","doc_tag-customize","doc_tag-single-doc","doc_tag-sticky-table-of-content","doc_tag-table-of-content","knowledge_base-shopify"],"year_month":"2026-04","word_count":405,"total_views":"7303","reactions":{"happy":"2","normal":"2","sad":"4"},"author_info":{"name":"Tasnia","author_nicename":"tasnia","author_url":"https:\/\/betterdocs.co\/it\/author\/tasnia\/"},"doc_category_info":[{"term_name":"Configurations","term_url":"https:\/\/betterdocs.co\/it\/docs\/shopify\/configurations\/"}],"doc_tag_info":[{"term_name":"betterdocs","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/betterdocs\/"},{"term_name":"BetterDocs Knowledgebase Gutenberg","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/betterdocs-knowledgebase-gutenberg\/"},{"term_name":"configuration","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/configuration\/"},{"term_name":"customize","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/customize\/"},{"term_name":"Single Doc","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/single-doc\/"},{"term_name":"Sticky Table of Content","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/sticky-table-of-content\/"},{"term_name":"Table of Content","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/table-of-content\/"}],"knowledge_base_info":[{"term_name":"Shopify","term_url":"https:\/\/betterdocs.co\/it\/docs\/shopify\/","term_slug":"shopify"}],"knowledge_base_slug":["shopify"],"_links":{"self":[{"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/docs\/5159","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/users\/16"}],"version-history":[{"count":16,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/docs\/5159\/revisions"}],"predecessor-version":[{"id":13114,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/docs\/5159\/revisions\/13114"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/media\/12369"}],"wp:attachment":[{"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/media?parent=5159"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/doc_category?post=5159"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/doc_tag?post=5159"},{"taxonomy":"knowledge_base","embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/knowledge_base?post=5159"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}