How to Add - Static Buttons on Blogger?

Most of the times, we need static buttons should be displayed on the blog in order the make the visitor accessible to something from anywhere on the blog.In such cases, we need to have a button that could actually help the visitor to access something that is required from anywhere on the page. The buttons are static buttons.
By clicking this button the page should go to the respective page or the link.

Let us see the process of adding Static buttons any where on blogger.



1. We should have a button image and its address
We can either create a button using paint and then upload it to any of the blog post and get its address
(by Right click -> Copy Link Location) or
Get the address of any button image from the web.

for each image get the Image link location by using (Right Click -> Copy Link Location) for the above images.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1pnY3wxTcF1BRar7vc_AC8Y3eSb6QCt5a_apWzM-GdaZHyFmaGx3wMkpm3GBLBhSnhDBkiAk8FL5pKXGuFLskv6ZJzfiBpcSw8pfyM1QpdAExW1C_RlKj4voNVYFmNBZlIaEH75bhDK2i/s1600/facebook.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq8WJD33zNF8IsSd3rD-QfsT_48xires4YHDOZgFTG-S9wNZoes-sfAesHXd1ZVssdc9ujHomSXiT2fNKjly3tHg3ohAZDJKmtk-ScOLLMlqkuzYrIGmN7J8Bx25BfQ2lz9rNqImG1ORdI/s1600/twitter.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEU56MLIsLAa5a5GGpXXpZcOOoYfr15KIjgmvPNc_Ojz1CD7lSCzDBv2GfIDCGsx15jLOCmWtFWFjWIe46xGE4GTclXcXTtJpoKitzvQOqdVdAbnVksfht3vJsEw976FyCUe9iI6lUeMKb/s1600/youtube.png

2. We need to have code for the button functionality for each image as shown below.


<a style="display:scroll;position:fixed;top:200px;left:40px;"href="FACEBOOK ADDRESS" title="Facebook Link"><img src="FACEBOOK IMAGE ADDRESS"/></a>

<a style="display:scroll;position:fixed;top:275px;left:40px;"href="YOUTUBE USER ADDRESS" title="Youtube Channel Link"><img src="YOUTUBE IMAGE ADDRESS"/></a>

<a style="display:scroll;position:fixed;top:360px;left:40px;"TWITTER ADDRESS" title="Twitter Link"><img src="TWITTER IMAGE ADDRESS"/></a>

3. Replace the BUTTON IMAGE ADDRESS text with the actual button address.

<a style="display:scroll;position:fixed;top:200px;left:40px;"href="https://www.facebook.com/arun.k.choppara" title="Facebook Link"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjW_zqtNRUcJSHbXc9ntyvReUDYoipiDvzA3GHkTJVW3qixap66PaOXa_yDz_6F27nDA2nw48zeDhAjp3zWqc7k5IcQ4JhQMMoxPlc8nTKrf8w83LjTsQcXq2npjT1hmFe5nWnaRhk7P_eA/s1600/facebook.png"/></a>

<a style="display:scroll;position:fixed;top:275px;left:40px;"href="https://www.youtube.com/ArunKumarChoppara" title="Youtube Channel Link"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQDfGoMeem6bEwiUeny-7ZOV0cKPtI91wgc0EuAQlvEYWSBo3EmnBLDvr1XytGMaX1IiaYAW5c5o3YSSl1vwj7YdylXfBfa37pGgn0vrh-aChLy7d7VtqvlHbq-gGT1i3NyEmTcFr_iPiH/s1600/youtube.png"/></a>

<a style="display:scroll;position:fixed;top:360px;left:40px;"href="https://www.twitter.com/ArunChoppara" title="Twitter Link"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6K4I5YJMIPK-itA1Z5YYdEQR_vv4k1O6PSJIPKGfAyKBdNBAs2h3jahiqAeUdEArdP8uLE6QzF0XxohEh_zDQseyct5niS97FDxEEjKVPQ2B7djamtVsEpRFdsWvAY1ZjOnhaBwwUz4Ux/s1600/twitter.png"/></a>


4. Add a gadget - HTML/JavaScript with the code that we have for static button functionality.

5. Save the gadget and save template.

6. View blog to see the changes.

If you like the post, take a couple of minutes to comment and share.
Your comments are most valuable and would help me come up with better posts.