This is a step by step tutorial. I found all of this info by searching several sites and combining what they show along with what I figured out through trial and error (and I had many errors.) Since I was able to figure this out, I know anyone can do it.
Step 1: Create your cute button. Go to any drawing program. I use pages from mac. If you have a pc, use publisher. Start with a square. Make it larger than you need and we will resize it later. Give the square a background color, add in any graphics that you like, and finally add in your text. (Here's a quick picture of the different step I took to make my button.)
Step 2: Turn your image into a jpeg or png. On a mac, take a screen shot of the the image by holding down command, shift, 4. This will allow you to draw a box with your mouse and capture the image of just your new blog button. You want to make it as close to the lines as possible. Save it on your desktop. Go to the screenshot and open it in preview. Go to "save as" and save it as a png.
Step 3: Go to photobucket and create an account. It is free. Once you have created your account, upload your image.
Step 1: Create your cute button. Go to any drawing program. I use pages from mac. If you have a pc, use publisher. Start with a square. Make it larger than you need and we will resize it later. Give the square a background color, add in any graphics that you like, and finally add in your text. (Here's a quick picture of the different step I took to make my button.)
Step 3: Go to photobucket and create an account. It is free. Once you have created your account, upload your image.
Once you have your image uploaded, go to album, click on edit under your picture. It will take you to a screen like this.
Click on the resize button. Change the size to 125 pixels. (Standard button size.) Click save. You have made a button!! Now all you need to do is write the code. (I know, but you CAN do it! Stay with me!)
HOW TO WRITE THE CODE
There are different parts of the code. You will need your blog url, your photo url from photobucket (I will show you how to get this), and insert this info into the code below.
It looks long and complicated, but all you have to do is highlight each section and change it to your info.
Step 1: Copy and paste this into a word document. (I made a goggle doc, but for some reason it looks funny, but all of the parts are there. Scroll down to copy/paste.)
Change the red part to your blog url. Blue is the name of your blog.
Green is the location of your image on photobucket. Go back to your image in photobucket. If you notice, there is a boc that says "Direct link" Copy that info and insert it as the location of your photo.
Now, highlight all of the code and change the color back to black. (I save a copy of this code in a word document so I can easily change it if I change my button.) Go into your blog. Select "design" "add a gadget" "HTML" Type in your title. Copy/paste your code into the box and presto, you have your very own "Grab My Button"
I hope you were able to create your own button without any problems! If you have questions, I will do my best to answer them!
Good luck!
