Have you created a big page full of content and want to offer your customers an opportunity to scroll back to top without swiping fingers multiple times on the page (or by roll mouse multiple times)?
This How To will help you add this in a very easy way to your pages.
NOTE: For smart ones, you can even make minor changes and point this button to your Cart Page!
Read with an open mind, and you will be surprised with opportunities where you can implement this. Do leave comments below.
Since you have scrolled this far, you must have already seen how this feature works! :)
How can you add this function?
Just copy content from below yellow box and paste it in Page Properties > Custom Scripts > Add Page Scripts, and paste this.
See this image for more details:
<script src="https://code.jquery.com/jquery.min.js"></script>
<div class="totop">↑ To Top</div>
<script>(function(a){var e=function(){a("html, body").animate({scrollTop:0},1E3);return!1};a.fn.tottTop=function(f){var b=a.extend({scrollTop:800,duration:1E3,scrtollTopBtnDuration:400},f);return this.each(function(){var c=a(this),d=a(window);d.scroll(function(){d.scrollTop()>b.scrollTop?c.fadeIn(b.scrtollTopBtnDuration):c.fadeOut(b.scrtollTopBtnDuration)});c.click(e)})}})(jQuery);</script>
<style>.totop { position: fixed; bottom: 50px; right: 150px; cursor: pointer; display: none; z-index:600; background: #a05b7e; color: white; border-radius: 25px; height: 50px; line-height: 50px; padding: 0 30px; font-size: 18px; }</style>
<script>$('.totop').tottTop({
scrollTop: 700
});</script>
NOTE1: If you are not satisfied with scroll duration when button shows on your page, you can modify scrollTop: 700 to something else.
NOTE2: Do you want to change color of text or background of BackToTop button? Change these values in style section of above HTML element:
background: #a05b7e; //change this to red, blue, yellow, or whatever color you want to show as per your page background
color: white; //change color of text to red, blue, yellow, or whatever color you want to show as per your page background
How to add 'BACK TO TOP' feature on your pages?
