Easily add 'Back to top' button in Blogger

Easily add 'Back to top' button in Blogger
Pressing a single button for go to top of the page/post is way better than keep scrolling for reaching the top. So many websites now using this Back to top/Go to top button for making better satisfaction to visitors. And now you also can easily add this Back to top button in your Blogger site and make your blog more respective for visitor's and professional.

How to add 'Back to top' button in Blogger

  • Firstly log in to Blogger, select your Blog, 
  • Go to Layout tab, hit 'add a gadget', select 'Html/Javascript', 
  • Copy any code from below and paste them in content box of 'Html/javascript' and save gadget, 
  • Then See your Back to top button in action.

Here 10 different style Back top top/Go to top button code given below. Copy any style and paste in your Blogger blog-

Style 1:
how to add Back to top button in blogger


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/3eNjOZ"/></a>
<!--www.crawlist.net Back-To-Top-ends-->



Style 2:
how to add Back to top button in blogger


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/X4Cp8V"/></a>
<!--www.crawlist.net Back-To-Top-ends-->

Style 3:
how to add Back to top button in blogger


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/5olBQs"/></a>
<!--www.crawlist.net Back-To-Top-ends-->


Style 4:
how to add Back to top button in blogger


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/WX5LK7"/></a>
<!--www.crawlist.net Back-To-Top-ends-->

Style 5:


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/7uGxOW"/></a>
<!--www.crawlist.net Back-To-Top-ends-->


Style 6:


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/o69brQ"/></a>
<!--www.crawlist.net Back-To-Top-ends-->

Style 7:


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/lER65V"/></a>
<!--www.crawlist.net Back-To-Top-ends-->


Style 8:


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/BGiuAu"/></a>
<!--www.crawlist.net Back-To-Top-ends-->

 Style 9:


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/Xql0p2"/></a>
<!--www.crawlist.net Back-To-Top-ends-->


Style 10:


<!--www.crawlist.net Back-To-Top-starts-->
<div style="position: fixed; z-index: 65535; right: 20px; bottom: 15px;">
<a href="#Top"><img src="http://goo.gl/BK8ESh"/></a>
<!--www.crawlist.net Back-To-Top-ends-->
Don't forget to mention how it looking and working on your Blogger Blog. Chill...