Breaking News

How to set Back to top Button on Blogspot

Ajiranet Blogspot
Ajiranet Blogspot

How to set Back to top Button on Blogspot.

Back to top button helps the reader when he reaches the end of the post not to have trouble returning to the home page, so by using the Back to top button the reader will be able to return to the home page easily without browsing.

Also can ready; 

  1. Make Money with Propeller Ads.
  2. The Best 10 Ways To Make Money Online $10 Daily
  3. How to Create a Blog for Free 
  4.  How to Join Google Adsense in AjiraNet 202

The way to put a back to top button on your blog spot blog;

1. Log in to your blogspot blog. Click Theme then Edit HTML

2. Press Ctrl + F and in the search box type <Head>. Then paste this code under the word Head as shown in the image below

<script src=''></script>

Click Save theme. Then click Layout, Add a Gadget, select HTML/JavaScript and click the + sign

3. Paste these codes in the content


jQuery(document).ready(function() {

var offset = 220;

var duration = 500;

jQuery(window).scroll(function() {

if (jQuery(this).scrollTop() > offset) {


} else {




jQuery('.back-to-top').click(function(event) {


jQuery('html, body').animate({scrollTop: 0}, duration);

return false;





div#page {

max-width: 900px;

margin-left: auto;

margin-right: auto;

padding: 20px;


.back-to-top {

position: fixed;

bottom: 2em;

right: 0px;

text-decoration: none;

color: #000000;

background-color: rgba(235, 235, 235, 0.80);

font-size: 12px;

padding: 1em;

display: none;


.back-to-top:hover {

text-decoration: none;



<a href="#" class="back-to-top"><img src=" .png" alt="Back to Top" / ></a>

Click Save then save arrangement

If you want to change the color of the Back to top button, delete this code

Then Paste these codes to change the color of the back to top button


No comments