1. Find a picture you want to use for your button and upload it to a site like pixlr.com or use photoshop to edit (I used pixlr since my free trial of photoshop is expired).
2. Crop your picture to the dimensions that you want it to be. I recommend making it a square and at least 3 to 4 times larger then your final desired button size. This will prevent the picture from looking pixelated.
3. Make sure you add your blog title on the button...or it defeats the purpose. After all, you are trying to "promote" your blog.
4. Flatten and save your image.
5. Upload your image to an image hosting website such as Photobucket or Flickr.
6. Copy the direct link that they give you.
7. Now to create a "grab-a-button" so others can support you on their blogs. Use the code below:
<img src="YourButtonImageURL" alt="YourSiteTitle" /><div style="width: 123px; height: 125px; overflow: auto; border: 1px solid #666666;"><a href="YourSiteURL" target="_blank"><img src="YourButtonImageURL" alt="YourSiteTitle" width="150" height="150" /></a></div>
*This goes without saying but replace the bold items in the code with your information*
Well, you can add it to your sidebar (blogger) by going to Design>Add a Gadget>HTML/JaveScript or you can let people know about your "grab-a-button" in a blog post by pasting the code in the HTML tab.
In WordPress go to Dashboard>Appearance>Widgets and click and drag the text widget to your sidebar.
Also, if you want to display your own blog button without the "grab-a-button" option just use the following code.
<a href="YourSiteURL"><img src="YourButtonImageURL" /></a>
I hope this makes sense. Please do not hesitate to e-mail me if you are having issues. HTML code doesn't really make sense to me but it's always a good thing to have a coding machine (AP = engineering PhD) at my "beck and call" (Joking...but no, really).