Creating a button or banner is a great way to advertise your blog. You can use it on other blog sidebars, entrecard, and some blog directories. A standard button is 125 by 125 pixels in size. There are a variety of other sizes you may want to have on hand depending on the advertising you’ll be doing.
Banner Sizes
- Full Banner – 468 x 60 pixels
- Vertical Banner – 120 x 240 or 125 x 240 pixels
- Button 1 – 120 x 90 pixels
- Button 2 – 120 x 60 pixels
- Square Button – 125 x 125 pixels
I’m often asked, “how do I create a grab my button box?”. This requires a little bit of knowledge about html. But if you haven’t picked up that HTML for Dummies book, don’t worry, I’ve got you covered.
What you Need
- A blog or website
- a banner (like seen in my sidebar)
- an image hosting account (like photobucket or your own server)
Create the Code
It doesn’t really matter if you are using blogger or wordpress, you just need to follow these simple steps.
- Upload your banner to your photo sharing account
- Copy the URL (link) of that image and paste it in notepad for later use
- Add a new HTML widget to your blog
- Copy and Paste the following code to your widget
- Insert your image link and blog link where it says IMAGE URL and BLOG URL
- Save your widget and you’re done!
Vertical:
<table border="0" width="100%">
<tr>
<td align="center"><img src="IMAGE URL" alt="" /><br/>
Copy and Paste Code</td>
</tr>
<tr>
<td align="center"><textarea cols="13" rows="9"><a href="BLOG URL" target="_blank"><img src="IMAGE URL" border="0"></a></textarea></td>
</tr>
</table>
Horizontal (like mine):
<table border="0" width="100%">
<tr>
<td align="center"><img src="IMAGE URL" alt="" /><br/>
Copy and Paste Code
</td>
<td align="center"><textarea cols="13" rows="9"><a href="BLOG URL" target="_blank"><img src="IMAGE URL" border="0"></a></textarea></td>
</tr>
</table>
Share it with Blogs
- My top recommendation is to list your banner with MomDot.com Free Mom Blog Listings
- Another great place is Entrecard, you can trade ad space with thousands of blogs with a free credit system
- Or stop by some of your favorite blogs and ask to trade banners with them
About Cat Davis
Great info Cat! I remember wondering all these things when I first started.
Argh.. I wanted to move mine to Horizontal too, but it’s not working
I’m working on it. LOL
Wow! Perfect timing! I was just about to sit down and work on a button. Thanks!
Thanks so much! I tried a couple of codes from other blogs and they never turned out right. Since many of the listing sites are declining my new blog I hope folks will help us out.
If you like I can add your banner to our community page, just let me know.
Cheers!
I have spent days looking for ways to do this! you Rock!
You are awsome! I have been searching and even asking folks how to do this! I couldnt find the answer myself thanks soooo much!
Whoa. Seriously, thank you so much for posting this info. I’ve been trying to figure out the proper code for awhile and found your site. Again thank you, and I’m off to explore a bit more of your site!
Thanks a lot! I had to tweak it a little, but I got it to work. Yeah!! I was only two other sites and yours had the clearest directions. Thanks a lot!
Thank you for all the clear instruction!
Works like a charm!
Pascale
THANK You so much!! So easy, especially when you already wrote the code for me.
I’m stumbling this post!!
Heather
Thanks so much! This was just what I was looking for!!
I so am going to need this thanks for the info. I’m so set on finding the right theme I keep changing themes cause I’m looking for something to customize easy I can’t get started. I want a nice scrapbook lookin blog like everyone else has…
Great information. I noticed that Even from Confessions of a housewife http://confessionsofahousewife.com/ had a blog button and asked her how she did it and now I have my own.
Its on the right hand side of my blog.
http://www.mothersbelongathome.com
It is so useful to have. I wonder how many people actually copy the code and use it on their blogs!
Thanks again
Diane
O.K. but how do you make a banner? I’m real challenged! I tried to change the top (see how challenged?) of my blog and lost everything….once I got it accidently restored, I’ve been scared to mess with it again.
Thanks!!
Thanks so much. This was a great help.
when i TRY TO FOLLOW YOUR DIRECTIONS FOR horizonal they dont work out right
I had to tweek the code a bit too. wound up with a lot of “” around things
is there a step I’m missing or something
http://focusonmotherhood.com
thanks Cat!
Tricia
Hello! Thank you soooooo much for these easy instructions and for writing the html code and sharing with all of us. I’ve been wanting to add this to my blog for awhile now but couldn’t figure out how.
Question: I got my badge with the copy and paste code added to my blog but then I copied the code from my blog and pasted it into a new HTML widget to make sure it would work and it didn’t. There was just an x symbol where my badge should have been. Do you know what I’m done wrong? I use blogger. (I’ve taken the Grab a Badge off of my blog for now since it’s not working…just wanted to mention in case you tried to find it.)
Thank you again for your help! I look forward to hearing from you.
Lindy
Hi Lindy, Did you ever get yours figured out. I too am getting an “X”….
Ladies, try again now. For some reason wordpress changes the quotes in the html on me, I fixed them.
Just gotta say: Thanks a TON!!!!! This was awesome and I found instructions in other places yours just helped make it so step by step and simple! You’re awesome!!!
Wow! That was super helpful. You made it so easy. I had finally given up on someone’s instructions and then found yours. Thanks.