1. Home
  2. Docs
  3. Happy Elementor Addons Free
  4. Happy Features
  5. Scroll To Top Feature

Scroll To Top Feature

Scroll-To-Top is a free feature of Happyaddons. It will allow your users to scroll to the top of any web page just by a single click of a button.

How To Use Happyaddons’ Scroll To Top Feature

Make sure you have the plugins below available on your website to enable this feature.

Prerequisites

Once you have these plugins installed, get started with the following steps!

Step 01: Enable Scroll To Top Feature

To enable the Scroll-To-Top feature, navigate to Elementor Menu > Site Settings > Scroll To Top. You will get the Scroll-To-Top option there to enable. Toggle on it. 

Then, click on the Update button below.

Note: You have to reload your page to see the Scroll-To-Top enabled there.

Enable Scroll To Top Button

Step 02: Customize The Scroll-To-Top Button

You will get numerous options there to customize the Scroll-To-Top button.

Let’s have a short brief about these options.

  • The Position allows you to alter the position of the Scroll-To-Top button from left to right and right to left.
  • Using the Bottom option, you can move this button up or down.
  • The Right option allows you to move the button from right to left.
  • You can increase or decrease the button’s width by the width option.
  • The Height option will let you increase or decrease the height of this button.
  • Z Index will allow you to specify the stack order of the Scroll To Top button.
  • You can increase or decrease the rigidity of the button color with the Opacity option.
  • You can change the icon of your Scroll-To-Top button from the Icon option. Click on the Icon Library. A wide collection of Icons will appear on your screen.

Note: Here again, you have to reload your page once more to see the changes.

  • Icon size allows you to increase or decrease the size of the Scroll To Top button icon.
  • Using the Border Type, you can give a solid, double, dotted, dash, and groove type appearance to the button.
Change the Border Type of the Scroll To Top Button
  • From the Hover option, you can give the hover effect to your icon.
  • Icon color will allow you to change the color of your button icon.
  • The background color will let you alter the background of the button icon.
  • If you need to modify the radius of your Scroll To Top button, you can do it from the Border Radius option.
Change Border and Icon Color of The Scroll To Top Button

Note: Whatever changes you make, never forget to click on the Update button. Otherwise, your changes will not be saved.

Step 03: Turn Off Scroll To Top Button Only In Particular Page

Scroll To Top is a global feature of Happyaddons. You will see this button on all your web posts and pages once you enable it. However, you can keep it off for specific pages if you want in the following ways.

  • Click on the Setting Icon from the below-left corner.
Turn Off the Scroll To Top Button
  • You will get the Scroll To Top option there at the bottom. Click to expand it.
  • Toggle on the option to Disable Scroll To Top button.
Disable the Scroll To Top button
  • You will see the Scroll To Top button is disabled from the page.
Scroll To Top button disabled

This is how you can enable the Scroll To Top button on your website and then disable it on preferred pages.

If you want to see the process of enabling the Scroll To Top button in the video, here is a video tutorial for you.

Tags , ,
Was this article helpful to you? Yes No

How can we help?