adf.ly - shorten links and earn money!

How To Add Top of Page Floating Widget

Some blogs and webpages have a long pages that go on forever. This widget help you to go back to top in no time. As you can see, there is a small floating arrow at the bottom-right of this page. It always maintains the same position. Scroll down a little in your template, then if you click on it, it will take you to the very top of the page. Add this widget to your blog. This is "How To Add Top of Page Floating Widget".

Copy this HTML. Add Page Element > HTML/JavaScript.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIDCUPo_Jpx6iS96P8LQ_krIl8BUUdjLnQdY14ikYxP-0OH0-dA500Eoa6oP5H3qMiwEuAT83kujYUBvdFQhmxp0noNC8pxFj-Mh9oh49gHtupslHbFzdQYzb5bZ1oCrlPHRuUPV6Sf5E/s400/HTH-up-arrow.png" /></a>

This widget good because :

  • The icon does not interfere your blog or site content. 
  • Saves your visitors from an unnecessary hassle of scrolling up.
  • You can use your own image in order to blend in with your own blog.
  •  Personalize your pages

You can create your own icon and upload it. Then copy the icon URL and replace the URL in img src. Example :

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Back to Top"><img src="your icon URL here" /></a>

Use this another icon (Just Right click and copy image location > put the URL to the img src like above)


 Enjoy this widget guys!!
______________________________________________________________________

Don't forget to subscribe to get an Updates from HOW-TO HOUSE on your inbox.


Delivered by FeedBurner
You can ask for more tricks here.
___________________________________________________________________________________

Don't forget to drop your comment.

Any Question or Suggestions? Join our forum at HOW-TO HOUSE Forum.

0 comments:

Post a Comment

Drop your comment. Ask or suggestion.

Join us on Faceboook Page too.