How to Add a Smooth Scroll to Top Effect in WordPress using jQuery

Pawan — Wed, 26 Mar 2014 18:50:18 +0000

We had discussed "How to Add Smooth Page Scroll to Top using jQuery" in one of our previous posts. Now lets see how to implement the same in Wordpress. Step 1: Paste the below HTML any where in your theme’s footer.php file.


<a href="#" id="scrolltotop" title="Back to top">Back to top</a>

How to Add Smooth Page Scroll to Top using jQuery

Pawan — Mon, 30 Dec 2013 19:44:00 +0000

You would have come across websites that provide an easy way to scroll to the top of the webpage as you move down the page, its really a good idea if the webpage is long and you want to provide a better user experience. In this article, we will show you how to add a smooth scroll to top effect using jQuery. We will create a button on the footer of the page which when clicked will scroll the page to the top smoothly, we will use css to postion the button at a fixed position on the bottom right of the page and jQuery to provide the scrolling effect and make the button visible only if the page is scrolled down, instead of being always visible. Step 1: Add button link Place the following code just before the closing </body> HMTL tag

<a href="#" id="scrolltotop" title="Back to top">Back to top</a>

Scroll – Techawaken

How to Add a Smooth Scroll to Top Effect in WordPress using jQuery

How to Add Smooth Page Scroll to Top using jQuery