I've gone through several buttons for my yellow corner:
They usually match the blog design I'm using.
For this tutorial, I'm going to cover the following topics:
1. Creating a Blog Button
2. Resizing Your Blog Button
3. Linking Your Button
CREATING A BLOG BUTTON
Using Picasa, we're going to create a blog button
Open Picasa, and select the photo [or photos] you'd like to use for your button.
[Since the button is so small you probably only need one picture.]
I'm going to use the same HTML beast sketch that I used for my header.
Straighten the picture and put it in the center of the screen... make sure there's lots of white space surrounding it.
Then click "create collage"
Crop the picture to a square, still being sure to leave room for text
[unless you want your text to go over the image]
Add your text:
Yay, we have a blog button!
We'll spruce it up more in the next step.
RESIZING YOUR BLOG BUTTON
We're going to use Photobucket for this next part.
If you don't have a photobucket account, go ahead and set one up [it's FREE!]
Upload your button into your photobucket.
[I'm not going to go into details about how to load pictures into photobucket, but Libby @ The Bonjour Family has a great tutorial for that - Check it out!]
Once your picture is loaded,
Let's add a border really quickly before we resize it, k?
Click the "Decorate" tab select a border:
Then click the "Basic" tab and select "Resize"
You'll have to uncheck the "Keep Proportions" box
Click save, and there's your button:
LINKING YOUR BUTTON
Ok, so some of you already had a button
Piece of cake!
I have two codes to share with you:
The first one is for posting JUST a button.
The second is for posting a button code so that other people
Here is a button code:
You'll copy and paste this code, but be sure to change two things:
1. Change the "YOUR BLOG URL" to your web address.
2. Change the "YOUR PICTURE LOCATION" to the "direct link"
Then go to your blogger homepage and click the Design tab.
Click "Add Gadget" on the right side:
A box will pop up.
Then paste your code in the box and hit save:
Your button should appear in your sidebar:
But let's face it. . .
What's the point of just having your button in your sidebar?
They've already made it to your page.
You want your readers to be able to take your button with them and share it.
The code for this is almost the same. . . just twice as long: