Elementor Scroll Back to Top Button
Create your Back to Top widget
Screenshots
Why People Love Elfsight
Scrolling through a long page shouldn’t feel like climbing a mountain. The Elfsight Back to Top widget brings visitors back to the top of your page in one smooth motion. It’s simple, intuitive, and adds that polished touch every modern website needs.
With just a few clicks, you can create a Scroll to Top button that blends perfectly into your design. Choose your icon, color, position, and animation – everything’s adjustable in the editor. And since it’s fully responsive, it looks and works great on any device.
Did you know?
A Nielsen Norman Group report found that 57% of users’ page viewing time is spent above the fold, the portion visible without scrolling.
Keep navigation easy and visible – add the Elfsight Back to Top widget for Elementor now so every visitor stays engaged and moves smoothly through your content.
Key Features of the Elementor Back to Top Button
Here’s what makes Elfsight a must-have for a better browsing experience:
- Customizable design: Pick your preferred icon, color, shape, and size to match your website’s style perfectly.
- Smart appearance triggers: Control when the button shows up – after scrolling a set distance or on specific pages.
- Smooth scrolling effect: Give users a pleasant, seamless transition instead of a sudden jump back to the top.
- Position control: Place the button anywhere on the screen – bottom-right, center-left, or wherever it feels right.
- No coding required: Works even if you’re not a developer – it’s as easy as drag, drop, and paste.
Try all features right in the live editor – no signup needed.
How to Add a Back to Top Button to Elementor
Embedding a return to top button on Elementor website is quick and simple. You can place it inline or floating on every page.
Method 1: Floating Button
Ideal if you want your button visible across all pages.
- Select the template: Choose a floating style that stays visible as users scroll.
- Adjust details: Set the color, position, and animation.
- Generate your code: Copy the embed code from the editor.
- Insert in WordPress: Go to “Appearance → Customize → Additional HTML” and paste it before the closing
</body>tag.
Method 2: Embedded Button
Perfect if you want the Scroll to Top button inside a specific page section.
- Open the Elfsight editor: Choose a template that fits your website’s look.
- Customize your design: Select the icon, size, and style, and set when it should appear.
- Copy your embed code: Click “Add to website for free” and copy the snippet provided.
- Paste in Elementor: In your Elementor editor, drag an HTML widget to your preferred area and paste the code.
Need more help? Visit our Help Center for detailed guides. You can also share feature ideas in our Wishlist or follow updates in the Changelog.