Wednesday, February 22, 2012

How to Add a Button to Your Page

So I know this isn't exactly sample box related material, but I had a fellow blogger ask how to add a button to their page. I myself had to Google it and check out at several sites before I found one that was right for me. Even then I think I combined two different codes to come up with my simple one. So if you are looking to add a GRAB MY BUTTON to your blog, please try these steps!

1. Create a button. You can use various resources to do this. My favorite is Picnik, although they will be shutting down in April I do believe, so you must be quick on this one. What I did was start with a square in Paint and colored it the greenish color that matched my blog background. Then I went to Picnik, added a brown border, added text that stated my blog's name, then resized to 125X125 and saved.

2. Upload your button to Photobucket. Once it is uploaded, if you have not yet resized it to 125X125, it is critical that you do so now. Simply click on the Edit Photos tab, select your button, change the dimensions to 125X125 and apply.

3. Now you will go back to your album, click on your button, and copy the DIRECT LINK.

4. Go to your Blogger Dashboard and add an html box. You will insert the following code:

[a border="0" href="http://mybeautyboxes.blogspot.com/" target="_blank"][img src="http://i1065.photobucket.com/albums/u391/cinarella/mybeautyboxes.jpg" /][/a] [textarea cols="20" rows="4"]<a border="0" href="http://mybeautyboxes.blogspot.com/" target="_blank"><img src="http://i1065.photobucket.com/albums/u391/cinarella/mybeautyboxes.jpg"/></a>[/textarea]

5. You MUST change all of the [ to <  and all of the ] to >.

6. Instead of my blog URL, insert your own.  Instead of my direct link to my button, insert your own.

7. Voila!  You now have a button that can be copied and shared!

8. If you are feeling thankful for learning how, you can always pay me back by featuring my button on your blog ;)

If anyone tries this and it does not work for you, please let me know and I will double check my directions to make sure I did not miss anything.  I sent the same directions to the fellow blogger and they worked for her.  Thanks for stopping by!

No comments:

Post a Comment