How To Create a Scroll-To Link in Flatsome Theme

In the Flatsome theme, the ‘Scroll-To’ link is an element that let your user scroll down to a particular part or area when a specific button is clicked. This way, you can allow your user to easily access your website’s contents without wasting any time or energy. We will see how to create a scroll-to link.

Implementing the ‘Scroll-To’ element also lets you highlight the most important contents. Users love it when they don’t have to find content here and there. Instead, they can jump or scroll down to their desired content in a moment. If you need you can also create an infinite scroll for WordPress for your page.

In this tutorial, we will show you how you can implement a ‘Scroll-To’ link in a few easy steps. After the end of this tutorial, you will be able to place this functionality anywhere on your website effectively.

 

Create a Scroll-To Link in Flatsome Theme Step-By-Step

 

Step 1:

In this tutorial, we will create a ‘Scroll-To’ link in a Flatsome responsive theme for WordPress. When the ‘View More’ button is clicked, the page will automatically scroll down to the ‘Shirt Section’ of the page.

create scroll to link flatsome

Step 2.

Hover on the ‘Edit Page’ in the top admin bar and click on ‘Edit with UX Builder.’ and the page will be opened in UX Builder.

wp woocommerce free flatsome

Step 3:

Click on the ‘Add to Section’ button inside the section you want to scroll down to when the button is clicked.

create scroll to link flatsome

Step 4:

Scroll down on the element section and select the element ‘Scroll-To.’

free wocommerce theme wp

Step 5:

Now give this element a title and then click on ‘Apply.’

create scroll to link flatsome

Step 6:

Drag and drop the ‘Scroll-To’ element at the top inside the section.

free wordpress woocommerce ecommerce store

Step 7:

Now double click on the button you want to be clicked to open the button settings. On the button settings, scroll down a bit, and you will find a field named ‘Link.’ Write the title of the ‘Scroll-To’ element with a ‘#’ tag before it in the ‘Link’ field. Then click ‘Apply’.

create scroll to link flatsome

Step 8:

As we are done creating our ‘Scroll-To’ link for our desired section, simply click on ‘Update’ to save your customization. Click on the ‘X’ button at the top-left corner of the page to exit the UX Builder.

free wp theme woocommerce

Step 9:

Now revisit the page and click on the ‘View More button’. We will see that after clicking the button, the page is automatically scrolled down to our desired section. We have just created a ‘Scroll-To’ link in our modern and creative WordPress theme.

create scroll to link flatsome

 

 

Conclusion

We have intended to show you step-by-step how you can easily create a ‘Scroll-To’ link using the Flatsome theme and make accessing the content flexible for your audience. Using the guideline, you can create ‘Scroll-To’ links as many as you like effectively.

We hope this tutorial has been helpful for you. Follow WPCred for more awesome and easy tutorials like this! Feel free to check out our essential plugins for the WordPress list to get a better insight into top-ranked WooCommerce plugins.


Hi, I’m Mohamed. I share delicious recipes that I have cooked and loved. I’ve been food blogging for over 10 years and have a Diploma in Nutrition. You will find many healthy recipes as well as my favourite comfort food on the blog because I believe in a balanced diet.

Related Posts

Ultimate Top 10 WordPress Paywall Plugins 2023

Are you looking for the best WordPress Paywall Plugin? WordPress paywall plugins are widely available, although not all of them are top-notch. Paywall plugins help you promote…

Start Booking Process with Availability Calendar Since Appointment Booking 1.19.0

With the release of the MotoPress Appointment Booking plugin version 1.19.0, we’ve introduced several significant improvements and enhanced flexibility to the booking form widget. Additionally, we’ve fixed bugs and implemented…

Discover Top 17 WordPress Community Themes 2023

Community or social gathering is an amazing platform where you can share your thoughts or ideas with your people. Here WordPress Community Themes can play a vital…

Ultimate Top WooCommerce Dark Theme in 2023

WooCommerce dark themes are a good option if you want your website to have a contemporary, melancholy atmosphere. Dark themes are sinister and enigmatic, whereas light themes…

WooCommerce Variable Product Attributes Setup 2023

Are you worried about how to create Radio, Label, Color, and Image Variation Swatches for WooCommerce variable product attributes? If your WooCommerce store sells a variety of…

Top Google Tag Manager WordPress Plugins 2023

Google Tag Manager WordPress plugin is a tag management plugin that can help you to put or update tags on your website. Using it, you will be…