Resources
Desktop app
Marketplace
Community
Developers
Wallpapers
Meetups
Company
Security
Careers
Report
Status
Legal
Blog
Creators
Program
Payouts
Experts
Awards
Events
Brand
Compare
Squarespace
Wordpress
Unbounce
Webflow
Figma
Wix
Solutions
Figma to HTML
Website builder
Portfolio maker
Landing pages
UI/UX design
No-code
Socials
Instagram
X Twitter
YouTube
LinkedIn
Threads
TikTok
    Framer
    EnterprisePricing
    Enterprise
    Pricing
    Marketplace
    TemplatesPluginsComponents
    Templates
    Plugins
    Components
    Component preview thumbnail
    MarketplaceComponents

    Table of Contents

    Dynamic table of contents that adapts based on blog content with fully customizable styling.

    Nabeel
    Nabeel
    Creator
    1mo ago
    Updated
    25
    Installs
    Nabeel
    Nabeel
    Creator
    1mo ago
    Updated
    25
    Installs

    Make it with Workshop

    Build your own component with AI


    About

    Easy to install CMS richtext table of contents. No need for complex overrides and customs. Just copy paste and customize. Customize text styling, indentation, spacing and y-offset.

    This component a part of the 400+ components, layouts, templates, UI Kits and code overrides from SegmentUI PRO. Click here to see the full library

    Instructions

    Instruction Video
    1. Copy the component to the designer CMS details page

    2. Connect the richtext to the component

    3. By default, all headings of the page will be displayed

    4. To only show the headings of the rich text, add a section ID to the rich text layer

    5. Paste the same ID to the the component

    6. Customise the look

    7. Preview to see the change

    How it Works

    You can set which section to create a table of contents for, adjust colors for normal, active, and hover states, and control spacing and indentation. You can choose which heading levels to show and customize fonts for each level. There's also an option to set an offset for smooth scrolling.

    Support

    For any queries, refunds and help setting up the component, contact hello@segmentui.com

    Support
    About ComponentsRefund PolicyContact Creator

    More Components

    See All →
    Thumbnail for CMS Time to Read, a Framer Marketplace template by Nabeel.
    CMS Time to Read
    $14
    Nabeel
    Thumbnail for Parallax Scroll Grid, a Framer Marketplace template by TaktForm.
    Parallax Scroll Grid
    $6
    TaktForm
    Thumbnail for Simple QR Code, a Framer Marketplace template by Robin Louw.
    Simple QR Code
    Free
    Robin Louw
    Thumbnail for Morphing Text, a Framer Marketplace template by THE DESIGN FUTURIST.
    Morphing Text
    $5
    THE DESIGN FUTURIST
    Thumbnail for Pong Loader, a Framer Marketplace template by Branderest Studio.
    Pong Loader
    $5
    Branderest Studio
    Thumbnail for AutoRedirect, a Framer Marketplace template by Kadir Can Tüfek.
    AutoRedirect
    $5
    Kadir Can Tüfek
    Thumbnail for Word Blur, a Framer Marketplace template by Kevin James.
    Word Blur
    Free
    Kevin James
    Thumbnail for Magnetic Shapes, a Framer Marketplace template by Vaibhav Khulbe.
    Magnetic Shapes
    Free
    Vaibhav Khulbe

    More from Nabeel

    See All →
    Thumbnail for Scramble Text Cycle, a Framer Marketplace component by Nabeel.
    Scramble Text Cycle
    component · $4
    Nabeel
    Thumbnail for Download Page as PDF, a Framer Marketplace component by Nabeel.
    Download Page as PDF
    component · $4
    Nabeel
    Thumbnail for Framer Slides, a Framer Marketplace component by Nabeel.
    Framer Slides
    component · $14
    Nabeel
    Thumbnail for Advanced Slider, a Framer Marketplace component by Nabeel.
    Advanced Slider
    component · $4
    Nabeel
    Thumbnail for Advanced Video Play, a Framer Marketplace component by Nabeel.
    Advanced Video Play
    component · $9
    Nabeel
    Thumbnail for Dismiss Once Banner, a Framer Marketplace component by Nabeel.
    Dismiss Once Banner
    component · $14
    Nabeel
    Thumbnail for CSV to Framer Table, a Framer Marketplace component by Nabeel.
    CSV to Framer Table
    component · $14
    Nabeel
    Thumbnail for Animated Glow, a Framer Marketplace component by Nabeel.
    Animated Glow
    component · $4
    Nabeel