Showing posts with label Scroll To Top Button. Show all posts
Showing posts with label Scroll To Top Button. Show all posts

Monday, May 9, 2011

How to Add jQuery Scroll To Top Button in Blogger/Blogspot Blogs

Steps to add jQuery Scroll To Top Button to Blogger:

1. Login to Blogger.

2. Navigate to Design > Edit HTML.

3. Backup your Blogger template by clicking Download Full Template and keep it safe in your computer. Remember, its better to do this everytime you do a template edit to be on the safe side in case you encounter any problem

4. Find this code within the blogger template code(using CTRL+F):

</head>

5. Paste the following code just before the above line.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js' type='text/javascript'/>

<script type='text/javascript'>
//<![CDATA[

$(function(){

$('a[href*=#top]').click(function() {

if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
&& location.hostname == this.hostname) {

var $target = $(this.hash);

$target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');

if ($target.length) {

var targetOffset = $target.offset().top;

$('html,body').animate({scrollTop: targetOffset}, 1000);

return false;

}

}

});

});
//]]>
</script>

6. Find this code within the blogger template code(using CTRL+F):

<body>

7. Replace the above tag with the below one.

<body id='top'>


8. Find this code within the blogger template code(using CTRL+F):

</body>

9. Paste the following code just before the above line.

div id='goingtop'>
<a href='#top' title='Go Top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFKHjpXY2tXBsHCEr5JUv7epmTm4ZKNvkCgoOxCreUGd1_Oz6r25E1yQ3ykdPtApK61h1hGNWGeQxU72HU2ZYwurivFGjPqkYCITA23eY9e1DLJTV9ot_OTUkuhTgG1H8PgW94cThtaSSr/' style='right:20px; bottom:20px; position: fixed;'/></a></div>

You can use any other image in place of the above one(in bold).

10. Click on Save Template. You're done.

Monday, May 9, 2011 by Nilayan Ghosh · 0

Sponsored by Capslocker