How to Create Back To Top Button

In this Tutorial, i show you that how to create Floating Back To Top Button in Blogger/Wordpess. If your blog/wordpress (Website) page is long or if you write very lengthy posts then, you must add a Back To Top button to your blog/wordpress, by clicking which, users of your website will be taken straight to the top (Header) of your blog page. You can see my floating back-to-top button at the bottom-right corner of this page OnlineGames2Modo.

To add this button to your blog you will have to need two identical images (.png), one small and one large image. If you don't want different images of your button then use just one image URL for both images.

Create Floating 'Back To Top' Button:

1. Go To Blogger > Design > Page Elements
2. Select a HTML/JavaScript Widget.

3.  Copy and paste the following code in HTML/JavaScript.

<!--BACK-TO-TOP-STARTS-->

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Back to Top"><img onmouseover="this.src='URL Of Your Larger Button Image'" src="URL Of Your Smaller Button Image" onmouseout="this.src='URL Of Your Smaller Button Image'"/></a>

<!--BACK-TO-TOP-STOPS-->

4. Replace the required detail with specific URLs of your Back-to-top button.

5. Save it and you are done!

Related Articles:

jQuery Slideshow For Blogger

Popup/Slideout Facebook Likebox 

How to Create Drop Down Menu  

Multi Column Footer Widget 

Make A Website Blog In Two Steps 

How To Increase Website Blog Traffic (Free SEO)