Where We've Bean.: tutorial

Yesterday I took on the challenge of trying to make my own blog button. Let's just say it was more than I bargained for. My design skills are okay, but I didn't know a thing about HTML and all the tutorials I found just weren't cutting it. I kept getting so frustrated and then suddenly like magic it all worked. I'm new to the blogging world, and I love it when I hear tips on making my blog better. Soooooo, if you don't already know how to make a button here is a mini tutorial for a blog button and a grab code.

Design your button, this can be done on photoshop, photobucket, or my personal preference is picmonkey. Picmonkey is a wonderful free website.
You need to resize your button. Usually it is somewhere between 125x125 and 160x160. This can be done on Picmonkey, you'll find the resize button on the left hand side.
This part is a little tricky, so pay attention. The easiest way I found to do this is upload your resized picture to a blogger draft. Once it is uploaded change your setting from "Compose" to "HTML" located on the top left when creating your post. In the code copy the part of the code starting with http and continue through jpg.
Here is the code that you will need for your button.
Where my red link is copy your code you got from blogger, in the light blue copy your blog website.

<div>

</div>

</center>

Here is your last step! ---> Go to your blog design layout and add a widget. Select configure HTML/JavaScript. Then copy and paste your new HTML code. Save and then view your blog. It took me a few times to get it right, so...if at first you don't succeed try try again! Eventually you will get a button something like this

xoxo Kinzie

P.S. Do you have a button? If you add my button to your page, I'll add yours. Just comment saying that you've added it. Good Luck!