Go to top of page or back to top widget for blogger, Good for longer posts it will take you to the top of website when you click on that.
Go To Top of Page Widget For Blogger |
It is not comfortable for visitors to scroll on longer posts to go to the top of the page so here is the go to top of the page widget for blogger. It will take you to the top of the page when you click on the icon named as back to top or go to top at the end of the website or article.This widget has two benefits, first is visitors and readers does not need to scroll the mouse roller and that is why it is comfortable for them. Just click on the icon and you are at the top of the page. Below is the step by step method to install Back to top widget to blogger.
How to add back to top widget to blogger
Go to blogger dashboard.
Go to template and then click on edit template.
Now hit Ctrl+F and search for this piece of code ]]></b:skin>
Now paste the below code before the ]]></b:skin>
#indiatip {position: fixed;cursor: pointer;background: rgba(0, 0, 0, 0.78);color: white;padding: 10px 20px;border-radius: 3px;bottom: 22px;right: 90%;}
#topcontent {margin-bottom: 10px;}
.c_images img {width: 57px;height: 57px;}
.c_images img {width: 57px;height: 57px;}
.selectnav { display: none; }
.c_images img {width: 57px;height: 57px;}
.selectnav { display: none; }
.c_images img {width: 57px;height: 57px;}
.selectnav { display: none; }
<!--Widget By www.bloggerspice.com-->
Now search for this code </body>
And now paste the below code above the </body>
<a id='indiatip' title='Go to top'>Go To Top</a>
<script type='text/javascript'>
//<![CDATA[
$(window).scroll(function() {
if($(this).scrollTop() > 200) {
$('#indiatip').show();
} else {
$('#indiatip').hide();
}
});
$('#indiatip').hide().click(function() {
$('html, body').animate({scrollTop:0}, 1000);
return false;
});
//]]>
</script>
Now save the template and you are done.
No comments:
Post a Comment