Finally one more unique trick for blogger now a days you can see in many websites , blogger etc. they add back to top button . when scroll down little in there blogger you can see this types of button . now you can also this button in your blogger with smooth scrolling effect when you click on it its smooth scrolling up side . its also help you , because now mostly visitor like easy site navigation , this button appears only when you scroll down your page when you come on top its automatically disappear .
Smooth Scrolling Back To Top Button For Blogger
But now a days many templates like us add go to top button in bottom or in footer its fixed with template you can see live demo in our new design blogger template tricksblog free blogger template , now with this trick you can also add go to top fixed button in footer its also smooth scrolling .
Follow this easy steps . :
Smooth Scrolling Back To Top Button For Blogger Fixed
- Go to blogger > Template > Edit html.
- Before do anything please make backup of your template .
- Find ( Ctrl+F ) </head> and paste this code before it .
- Now Find ( Ctrl+F ) ]]></b:skin> and paste this code before it .
- Now Find ( Ctrl+F ) footer content ( it was present in end of your template when footer options was start . ) and paste this code before it .
<script type='text/javascript'>
$(function() {
$('#Gotop').click(function() {
$('html, body').animate({scrollTop:0}, 'slow');
return false;
});
});
</script>
#Gotop a {
float: right;
margin-top:-45px;
margin-right:20px;
text-align:left;
font-size:14px;
}
For Right side : float: right; For left side : float: left;
<div id='Gotop'>
<a class='maboenk' href='#' onclick='subir();return false' title='back to top'><img border='0' height='40' src='IMAGE_URL' width='40'/></a>
</div>
IMAGE_URL change this with your back to top image button .
height='40' Button Height .
width='40' Button Width .
Done !!
Enjoy Blogging :)
If you like this post or any other please share with your friends on facebook , google+ , Twitter .
If you have any problem feel free and write your problems in comment !!





0 comments:
Post a Comment