Pages

How to Make Buttons in Blogger

I am no html guru, but I do know a few tricks. html can seem daunting, but if you are just tweaking, it isn't too complicated to cut and paste.





This is how you can easily add buttons to your blog. I will try to make it as simple as possible. You can use any picture and make it into a button.

1. Find an image and give it it's own link
This is going to be your button, be it a photo or a logo. If you are using a picture from your computer, upload it to photobucket or picasa. Any online hosting website is fine.

Right-click and open the photo in a new tab. This will be your photo link in the html code. If it is an image from the internet (assuming it is ok for you to use) I would still recommend downloading the image and then uploading it to your own photobucket (or whatever you use).

2. Get the page link 
Get the link of the website you want the button to take you to when you click on it.
Example: http://pinterest.com/yourusername/

3. Get the HTML/Javascript gadget
Open your layout page, and add the html gadget. I titled my gadget "follow me" but you do not have to add a title.



Copy and paste the html code below into the box, and change the LINK TO YOUR WEBSITE to the link you want the image to open (step 2) and the LINK TO YOUR IMAGE to the link from step 1.

<a href="LINK TO YOUR WEBSITE"><img src="LINK TO YOUR IMAGE" /></a>

If you want your link to open in a new tab, use this instead:

<a href="LINK TO YOUR WEBSITE" target="_blank"><img src="LINK TO YOUR IMAGE" /></a>



You can add as many links as you want. Since I have 3 buttons on my page, it looks like this:



Which results in this:


I hope this is easy to understand!