Adding top button link is always good for users of blog. This is good for SEO also and your blog became more seo friendly this way.

You just need to add the following CSS code into style.css file.


#topbutton{display: block;border: 0;position: fixed;  bottom: 20px; right:0;

After this open your header.php file from your wordpress theme folder and after body just add following link code in that file.


<a name="top"></a>

After this open your footer.php file and at the end of body tag add following code in that file.


<a href="#top"><div id="topbutton"><image src="<?php bloginfo('template_directory'); ?>/images/top-button-wordpress.png" /></div></a>

put following image in your wordpress theme’s images folder. Just right click and save the image and put that in your images folder.

You can change css as per your requirement. This article is written by wordpressapi.com. If you are having any dobuts then please write to me.

Your button link will look like as follows:

Written by WPAPI

I am from India, Pune. I am WordPress and Drupal Architect and consultant. I worked on many technologies like Ruby on Rails, Flex, PHP, jQuery etc... Senior Technical Lead at Smartsourcing Global Pvt Ltd in Princeton, NJ, USA. I contributed to many wordpress plugins and Drupal Modules. I contributed to Drupal core also. Connect to purab on LinkedIn or Follow @purab on Twitter or Follow me on or Write Mail to purabdk@gmail.com or Chat with me on Skype : purabdk

This article has 4 comments

Leave a Comment

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>