All About Buttons
Buttons are basically a small image with text that links back to your blog. Other bloggers can add it to their sidebars and when readers click on the button it will take them to your blog. I think buttons are incredibly valuable, because they allow you to network in the blogsphere and advertise your blog.
Here's an example of the buttons on my sidebar. ---->
All of those buttons are on blogs that I have linked up to. (Linking up to blogs is also an excellent way to increase traffic to your blog) Usually when you link up to a different blog, you are expected to put their button on your blog somewhere. It's courteous.
1. Create Image
So if you want to put a button on your blog, you first need to create the image. The best website I have found so far for editing images is PicMonkey. This site will allow you to upload your photo and then you can edit, add text, shapes, images, or special effects. To find the background for your button, you can google "free background pattern" or something to that effect. You should be able to find plenty of options.
A general size for buttons to be is 125 X 125 pixels, so you will need to crop it to that size. It can be larger, but often it won't fit in other people's sidebar, so they'll end up deleting it if it's too large. Here's where you'll go to crop your button.
2. Save Image
Once your image is created, save it as a jpeg file. I'm sure there are numerous ways to do this step, but I'm going to show you the only way I know how. :) I hosted my image on my test blog. Basically, I made a crap blog where I keep all of my pictures so I don't worry about deleting them. On my test blog, I created a new post, uploaded the image, and clicked original size.
After that, click the HTML button to find the link to the image. The link will say href="httpblahblahblah.jpg" You want the http to jpg portion. Make sure to save the post by publishing it, so your image won't go anywhere.
3. Copy HTML code
When you create your button, you want people to be able to "grab" your button, which means you will need to have some of the html code visible for guests to copy. Like the example below.
Here's the code you will need to edit for your blog.
<div align="center" style="padding: 5px;">
<img alt="Second Hand Couture" src="http://3.bp.blogspot.com/-_JKy7jxCHes/T_b-OEn2D_I/AAAAAAAAARE/7nIlEODjOcc/s1600/grey+chevron+button.jpg" title="Second Hand Couture" /></div>
<textarea style="background: #f0f0f0; border: solid 1px #666666; color: #777777; display: block; font-size: 1em; height: 45px; margin: auto; padding: 10px; padding: 10px; width: 90%;"><div align="center"><a href="http://secondhandcouture.blogspot.com/" title="Second Hand Couture"><img src="http://3.bp.blogspot.com/-_JKy7jxCHes/T_b-OEn2D_I/AAAAAAAAARE/7nIlEODjOcc/s1600/grey+chevron+button.jpg" alt="Second Hand Couture" style="border:none;" /></a></div></textarea>
The purple text = name of your blog.
The blue text = the image you just hosted on the test blog. (See image above)
The orange text = your blog website. When people click on the button it will take them to this site.
The way I test my code it to copy the text above and paste it into this website that allows you to test HTML code. Change all of the links you need to and push the "click me" button to test our your link. Once that is set, you can paste that link onto your sidebar or on one of your posts for people to grab. You will probably for sure most certainly without a doubt for sure want to save all of your html code on a Word document on your computer. Trust me.
Good luck!