How To Add Scroll To Top In Kadence Theme

How to add scroll to top in Kadence Theme

Do you want to add Scroll to Top in Kadence Theme?

If yes then in this tutorial we have shared the step by step process using which you can do this easily.

While browsing the web you must have come across sites that have an arrow icon either on the right or the left.

And on clicking, it takes you to the top of the page or the post you are on.

This feature is known as Scroll to Top and using it you can improve the navigation within the long pages resulting in better user experience.

Keeping this in mind, in this tutorial we have shared the complete process of how can you add Scroll to Top in Kadence WordPress theme.

How to add Scroll to Top in Kadence

Before we dive into this tutorial, it is important to know that you can add scroll to top in Kadence Theme with just a few clicks as this features comes built-in.

This means you do not have to make changes to the theme files or use third party plugins.

On top of this, Scroll to Top is a feature that is available in free version of Kadence theme as well.

Keeping this in mind, below we have shared the step by step process.

Login to WordPress dashboard

Assuming that you already have the Kadence theme installed, the first step is to login to your WordPress dashboard.

For this you need to visit https://your-site.com/wp-admin and it will take you to the WordPress login page.

Kindly note- Here you will have to replace your-site.com with your domain.

On this page you will have to enter your credentials and click Login.

Head over to Theme Customizer

Once you are in the WordPress admin, the next step is to navigate to the Theme Customizer or the Customization menu.

And for this you will have to click Customize under Appearance.

Customize under Appearance in WordPress dashboard

Alternatively, if you are on any of the pages or posts then you can click Customize on the WordPress admin bar.

And it will take you to the Kadence Theme Customization menu.

Search for Scroll to Top in Kadence Theme Customizer

Now that you are in the theme customizer, the next step is to find the Scroll to Top option.

For this you will have to click General.

General Settings in Kadence Theme customization menu

And it will show you all the settings including Scroll to top in Kadence Theme.

Scroll to top in Kadence Theme customizer

Add Scroll to top in Kadence

Once you have located Scroll to Top in Kadence, the next step is to add it to your site.

Now to add Scroll to Top in Kadence theme you need to click it.

And it will show the option to Enable Scroll to Top.

Enable Scroll to top option in Kadence Theme

On clicking Enable scroll to top toggle button in Kadence, it will add it to your site and will show you addition settings.

Additional Settings after adding scroll to top in Kadence Theme

Additional Scroll to top settings in Kadence Theme

After activating Scroll to Top in Kadence, it will show you a few additional settings.

And below we have briefly shared the use of each.

Scroll up Icon

Scroll up icon in Kadence Theme

Using this setting you can select / change icon of scroll to top button in Kadence.

Icon Size

Scroll to top icon size in Kadence Theme

Depending on the design, there are chances that you might want to increase or decrease the size of the scroll to top icon.

And using this option you can change icon size of scroll top top in Kadence theme.

Align

Scroll to top icon alignment in Kadence Theme

As discussed before, you can find scroll to top button on sites on both the left and right side of the page.

And using this option you will be able to Align scroll to button in Kadence theme easily.

Side offset

Scroll to top icon side offset in Kadence theme

When you add Scroll to Top on your site site, there are chances that on enabling it will overlap with the content.

In such situation you will have to move it to the side and using the Side Offset option you will be able to do this easily.

It is important to know that lowering the offset will make the scroll to top button in Kadence move towards the right.

And an increase in value will move it towards the left.

Bottom Offset

Scroll to top icon bottom offset in Kadence theme

Similar to the side offset, you can move the scroll top button in Kadence to the top or bottom using this option.

Increasing bottom offset will move it towards the top.

And decreasing will move it towards the bottom.

Visibility

After adding scroll to top in Kadence, there are chances that you might not want to display it on certain devices.

In this case you can use the visibility option to disable / hide scroll top on other devices in Kadence Theme.

Having said that,

Once you have made the changes, click Publish to Save.

Check if scroll to top is active in Kadence Theme

Now that you are done enabling scroll to top in Kadence, the next step is to check if it is active on your site.

For this you can visit any page or post on your site and then scroll a little till you see the Scroll to top button.

And that’s it you have successfully added scroll to top in Kadence WordPress theme.

If you have liked what you have read and want to buy Kadence Theme or any of the bundles a try then you can do it by clicking our SPECIAL LINK or the button below.

Try Kadence Theme