How to add a Back To Top Image on your blog. Its quite easy. Just follow the below steps.
Step 1:
Log in to your blogger account. Go to Dashboard > Template > Edit HTML and find for this code.
]]></b:skin>
Add below code before it.
#backtotop {
padding:5px;
position:fixed;
bottom:10px;right:10px;
cursor:pointer;
}
Step 2:
Now find for the following code.
</body>
Add below code before it
<a href="#" id="backtotop"><img src="Image-URL" alt="back to top" /></a>
After adding, change Image-URL with your favourite below image URL.
http://4.bp.blogspot.com/-NiQJqPtXVg0/USm1QrQWQtI/AAAAAAAABJw/up58ZS2FEv0/s1600/bttp-10.png
http://3.bp.blogspot.com/-9YF1gO-FIGo/USm1Qtl_cAI/AAAAAAAABJ0/IUPUNIGDBxE/s1600/bttp-12.png
http://2.bp.blogspot.com/-JsbwXutCUBg/USm1QgkRPdI/AAAAAAAABJ4/YiQ7iMUUUdw/s1600/bttp-11.png
http://2.bp.blogspot.com/-9lEi_yLlfpg/USm1RBt-EDI/AAAAAAAABKA/5izcofcUxhQ/s1600/bttp-7.png
http://2.bp.blogspot.com/-D0jxMxhQAmk/USm1RN1s9zI/AAAAAAAABKE/iR4wVcQvFuo/s1600/bttp-13.png
http://4.bp.blogspot.com/-lXdna1I1irY/USm16PWlq5I/AAAAAAAABKY/JeU7K5rAAek/s1600/download.jpg
http://2.bp.blogspot.com/-Grp5T7VjY54/URtofe_yBKI/AAAAAAAAA1Q/q_UqNbkNd_Q/s1600/backtotop.png
Step 3:
Now find for the following code.
<head>
And paste the below code after it.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js'
type='text/javascript'></script>
<script language="javascript">
$(window).ready(function(){
$('#backtotop').click(function(e){
e.preventDefault();
$('html, body').animate({scrollTop:0}, 'slow');
});
});
</script>
And then click Save Template.
Post a Comment Blogger Facebook
Don't Comment irrelevant It will be deleted!