Ultimate magazine theme for WordPress.

Text Back To Top Link with different styles And Colors

79
Text Back To Top Link with different styles And Colors

Step 1
Ok, now go to your blogger account and go to, Dashboard >> Layout >> Edit html >> and please find the following code.
]]></b:skin>
And before it add this code
#backtotop {
width:100px; /* Change Box Width*/
background:#F4FFBF; /* Change background color*/
border:1px solid #ccc; /* Change Border Style*/
text-align:center;
padding:5px;
position:fixed;
bottom:10px;right:10px;
cursor:pointer;
color:#666; /* Change text color*/
text-decoration:none;
}
And please change it’s properties to fit and blend with your blog template,
Change 100 to lower or higher number to increase or decrease the size of the box.
Change 1px To change the border width.
Change #ccc to your favorite color code change the border color.
Change F4FFBF to your favorite background color code.
Change 666to your favorite Text color code.

Note : You can get your favorite color codes via our new hex color codes generator here
Step 2
Find the following Code :
</body>
And before it, Paste the following code.
<a href="#" id="backtotop">Back to top</a>
To change the text on the button, just change Back to top to what ever you want,
Step 3
Find the following code
<head>
And paste this code after it.
&lt;script src='https://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js'
type='text/javascript'&gt;&lt;/script&gt;
&lt;script language=&quot;javascript&quot;&gt;
$(window).ready(function(){
$('#backtotop').click(function(e){
e.preventDefault();
$('html, body').animate({scrollTop:0}, 'slow');
});
});
&lt;/script&gt;
and then click Save Template 
And you are done.









Disclosure: This page may contain external affiliate links that may result in us receiving
 a commission if you choose to purchase said product. The opinions on this page are our own.
 We do not receive payment for positive reviews.

Subscribe to our newsletter
Sign up here to get the latest news, updates and special offers delivered directly to your inbox.
You can unsubscribe at any time
Comments