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.

See also  10 Best Free Shipping Plugin for WooCommerce 2023

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.

See also  15+ Best Full Site Editing WordPress Themes 2023

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.


Subscribe To Our Newsletter!
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

Fintech’s biggest hits and misses of 2023

As 2023 comes to a close, we’re here to look back at the biggest fintech stories of the year. Silicon Valley Bank’s implosion felt like a fintech…

It’s critical to regulate AI within the multi-trillion-dollar API economy

Alex Akimov Contributor With two decades of tech leadership experience, Alex Akimov, former head of API at Adyen, now revolutionizes embedded finance at Monite by building best-in-class…

EU’s provisional deal on gig worker rights fails to get enough backing from Member States

Not so fast on that Christmas present for precarious gig workers in the EU: A political deal announced mid month, which aims to bolster platform workers rights…

Arduino exploring India manufacturing to limit counterfeit sales

Arduino is considering manufacturing in India. The startup, best known for its open source microcontroller boards, hopes to restrict the rise of counterfeit boards and cater to…

Top robotics names discuss humanoids, generative AI and more

Last month, I took an extended break. In a bid to keep my robotics newsletter Actuator (subscribe here) up and running, however, I reached out to some…

Pornhub owner pays US government $1.8M to resolve sex trafficking probe

Pornhub’s parent company Aylo Holdings will pay $1.8 million to the U.S. government to resolve a charge of profiting off of sex trafficking. The company, formerly known…