How to Add a Back to Top Button Using Elementor

A Back to Top button is an element on a website where the visitor to the website will click on the button to be moved back up to the top of the website page. It is a simple element that can be hidden from the visitor until they’ve scrolled down the page.

Numerous designs can be applied to the Back to Top button. For instance, you can have it so it prominently sits on the website. Or you can have it so that it matches the branding of the website.

There are so many options that you can make the element your own.

There are numerous advantages of the Back to Top button on a website. For instance, it makes navigation of a website, especially when you have a lot of content on a page, easier for the audience. Therefore, they can get to the top of the page, and some important information there quicker.

There are also other advantages, such as the possible improvement in SEO potential. Google likes sites to be user-friendly, so on long content pages, these might be helpful.

So adding a Back to Top button using Elementor is relatively simple. What you need to do is to click the section handle on the first section of the page. Then you can enter the settings of the page. On the section’s Advanced tab, enter a name into the CSS ID field, like ‘Top’.

Then you can drag the Button widget into your page, wherever you would like to place it on the page. Then you type in TOP in the button’s text field.

Then type ‘#top’ into the link field. Save the changes to the widget and then the page.