Add Floating Back To Top Icon Link

We all are very sensitive to the word ‘annoying’, since its related to loosing visitors. When after scrolling long deep pages, if a readers has to go back to top of page, he/she has to do this by pressing the up button located on the right side of our browser, which is very annoying.

That is when this little trick comes in handy. This trick will add a floating up arrow button which will help you go back to top of page with just one click, no matter what is the position of the page, even if you are half way down the post, you can click this button to go back to top.

For WordPress Users:

Note: Do take backup of your theme before you try this.

01. Go to Appearance => Editor.
editor

02. Now select index.php.
editor

03. Add below Code before the closing of first DIV:

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Back to Top"><img src="http://i.imgur.com/yttem.gif"/></a>

All done


For Blogger Users:

Note: Do take backup of your template before you try this. Only try this if you are familiar with blogger codes.

01. Go to Layout => Edit HTML, click on Expand Widget Templates and add the below code before </head>:

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Back to Top"><img src="http://i.imgur.com/yttem.gif"/></a>

02. Save Template. You are done.


If you are finding blogger code implementation hard, then try our Blogger to WordPress Service

That concludes this simple and useful tutorial. Hope you like it.