Home Affiliate Marketing Tools Unbounce: How to Add a Scroll & Smooth Scrolling Link

Unbounce: How to Add a Scroll & Smooth Scrolling Link

by Ivan

Hey all!

In this video, I show you how to (a) add a scroll link with Unbounce, and (b) how to add a smooth scroll link so that when clicked on, scrolls to any element on the page.

The process is super simple but allows you to add a navigation menu to the top of your page so that you can send people to any part of the page you want with the click of a button.

In my video, I have added 2 buttons and 2 words to serve as the “navigation bar” so we can test the scrolling links.

  1. The first thing you need to do is find the element/section you want the scroll to go to. In my example, I want the scroll to go to the “testimonials” section when clicking on the “testimonials” button.
  2. You then select the element, copy the element ID at the bottom of the element properties, and paste it into the button “go to URL” spot. Sometimes you might need to click on something else on the page or the page properties just so that element scroll ID saves in the spot and doesn’t just get insta-deleted.

But that’s pretty much all there is to scrolling. You select the element ID you want to scroll to and paste it in the “go to URL” slot.

Now that you have mastered that, it’s time to control the speed of your scrolling and add the “smooth scroll” element.

Smooth scroll Javascript code URL: https://documentation.unbounce.com/hc/en-us/articles/360022719471-Adding-Smooth-Scrolling-Links-and-Buttons-for-Anchor-Links

Simply copy the code provided and paste it in the Javascript element of your landing page. Make sure to checkmark the “jQuery 1.4.2” on the bottom left hand side, or the code won’t work.

Click on “save” and that’s it, you’ve successfully enabled smooth scrolling!

You can always go back to the code and adjust the time it takes before the full scroll takes place.

The code provided to you has the default at 1,000 milliseconds, or 1 second, but you can change that value to whatever you want to.

In this video, I set the value to 5,000 milliseconds just as an example, and it indeed took 5 seconds for the full scroll to occur.

But you can set the value to whatever you want to, and if you think it takes too long, you can set the value to be much shorter.

That’s it!

Do you have any ideas or video topics about Unbounce or anything else you would like me to cover?

Write down in the comments below what you would like me to make a video on!

Most of my videos I made were requests/suggestions from subscribers, so don’t hesitate to let me know as well!

If you want to try out Unbounce yourself for free for 30 days and then get 20% off for the next 3 months after the 1-month free trial, sign up using my link:

https://unbounce.grsm.io/dtr

If you need help with a specific issue and want me to personally take a look at your setup, I can help! Check out the ‘My Services’ section of my blog: https://ivanmana.com/my-services/

Like my Facebook page! https://www.facebook.com/onlinemarketingessentials

Thanks for watching, and I’ll see you in the next video!

related articles

Leave a Comment

Top