How to Add Smooth Scrolling Effect to Elementor Table of Contents?

Key Takeaways

  • The Plus Addons for Elementor includes a Table Of Content widget that enables smooth scrolling.
  • Users can control scrolling speed for responsive devices through the Smooth Duration section.
  • The Scroll Offset section allows users to set a specific pixel value for scrolling from the heading.
Table Of Content

Do you want to smoothly scroll to the content when clicking on a heading of the Elementor table of contents? By implementing smooth scrolling, you can enhance the overall aesthetic of a page and create a more seamless navigation experience for your users.

With the Table Of Content widget from The Plus Addons for Elementor, you can easily add smooth scrolling to the table of contents in Elementor.

To check the complete feature overview documentation of The Plus Addons for Elementor Table Of Content widget, click here.

Requirement  – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.

To do this, add the Table Of Content widget to the page and follow the steps.

1. Select the appropriate style and tags from the Layout tab.

2. Then enable the Smooth Scroll toggle from the Extra Options tab.

Table of content smooth scroll how to add smooth scrolling effect to elementor table of contents? From the plus addons for elementor

From the Smooth Duration section, you can control the scrolling speed for responsive devices.

Then from the Scroll Offset section, you can set a scroll offset value for responsive devices, i.e. it will scroll to an equal number of pixels down from the heading.

Now when you click on a heading of the table of contents you’ll have a smooth scrolling experience.

About the Author

Photo of Aditya Sharma CMO of The Plus Addons for Elementor
CMO · The Plus Addons for Elementor · 10 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressElementorn8nAIClaudeAutomationServer
Get Instant Answers to all your questions about The Plus Addons for Elementor, trained on 1000+ Docs and Videos

Related Frequently Asked Questions

What do I need before starting to add smooth scrolling to the Elementor table of contents?

You need to have The Plus Addons for Elementor installed and activated to use the Table Of Content widget and enable smooth scrolling.

How do I enable smooth scrolling for the table of contents in Elementor?

To enable smooth scrolling, add the Table Of Content widget to your page and toggle the Smooth Scroll option from the Extra Options tab.

What happens after I enable smooth scrolling on the table of contents?

After enabling smooth scrolling, clicking on a heading in the table of contents will provide a smooth scrolling experience to the corresponding section of the page.

Can I control the scrolling speed for responsive devices?

Yes, you can control the scrolling speed for responsive devices from the Smooth Duration section after enabling smooth scrolling in the Table Of Content widget.

What is the purpose of the scroll offset value in the smooth scrolling settings?

The scroll offset value allows you to set a specific number of pixels to scroll down from the heading, ensuring that the content is properly positioned on the screen.

Is there a complete feature overview for the Table Of Content widget?

Yes, you can check the complete feature overview documentation of The Plus Addons for Elementor Table Of Content widget by clicking here.

Last reviewed: April 9, 2026