A back to top button is crucial for a blog or site because visitors enjoy easy site navigation so this button will provide them with this ease.It’s very use full for website visitors this feature save time of website visitors they reach to top by pressing this smooth scrolling back to top button.
The best thing about this button is that it appears only when the user scrolls down the page and disappears as he scrolls up.
This widget is really smooth and here i am providing it with some stylish buttons. In this tutorial i will show you how to add this widget to blogger.
Add Scroll to Top button to Blogspot :
- Log in to your Blogger Account.
- Then go to Dashboard → Layout → Add a gadget.
- Then select HTML/JavaScript from the list.
- Now Copy the below code and paste in the content box and then save it.
<!--New Blogger Widget back to top widget Start-->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script><script type='text/javascript'>$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$("#nbw-top").fadeIn()}else{$("#nbw-top").fadeOut()}});$("#nbw-top").click(function(){$("body,html").animate({scrollTop:0},800);return false})});</script><a href="http://newbloggerwidget.blogspot.com"></a><a id='nbw-top' style='display: none; position: fixed; bottom: 1px; right:0%; cursor:pointer;font:12px arial;'><img src='IMAGE URL' width="50px" height="50px"/></a>
<!--New Blogger Widget back to top widget End-->
Customizations:
- Replace IMAGE URL with the URL of the button you have selected bellow.
- To change the size of the button edit pixel values shown in blue color.
- To change the position of the button replace the text "right" with "left".
Back to Top Buttons URL :
1.
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfXBJntSFDPf8iTtPk_WjQUpQUK8XO-wa7WC4akpjK6J8c5b9FiZUEgNnzIGwcOAzqVKERq53RPhV6JrUNuEwlg-DXYueLRHhYHlZy8VFVoKkXAKXc4nnePI40qpoNnRI6Vaar0dprLbI/s1600/newbloggerwidget-back-to-top-1.png
2.
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguR2kEy2qy-1feVHhsN-6Waff7_S4iexBDa5g6tF105z6YPI9R3ZuFpIlQXXnWpQegjjI2sID9J63lGprH7NJWsQYpsVCbMLJuR2hRWji3EueWpuoH5ww2mrNQGTHFjjGnYg0T3gTygjI/s1600/newbloggerwidget-back-to-top2.png
3.
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkWz1yoqkJw62aSRSZawn0DZRjGMD-BXOk2UmIdH9I-v5gMeIwZcvmc1GAg3Apc4HCW8aD4BXprtrI-HYeRsj43X6BfDqDqDBFN8hD8Z5e1P5tAif9Z25H1KVwqSZnWwcMSmTlKOuWSHY/s1600/newbloggerwidget-back-to-top3.png
4.
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3sFvLsr347Bs-Cf1d3h_IF7TFfN7wviU_fcMzhwFWNYVtpDbP0LPxQep5xZMYWk1J1wJjiyeT6tc7hH99APaGTX0aNSJ1_suXMYyFBe911bZ4ir-7-pvocWUTi3OHB8iGrwf2OUVoAio/s1600/newbloggerwidget-back-to-top4.gif
