How To Add A Blog Badge In WordPress (This One Actually Works)

This post is for everyone who either a) doesn’t know how to add a blog badge to WordPress and just hasn’t tried, or who b) has tried over and over again but the code just doesn’t work. This “B” option is me. Whenever I would try – until recently – to add a “grab my button” widget to WordPress like I had seen on so many other blogs, WordPress kept shortening my HTML code for some reason and the text box just never worked. This happened until recently, when I discovered the secret… (Dun, dun, dun…)

(For dramatic purposes, let’s discuss why someone should bother with adding a blog badge first, like any game show would.)

Why Should I Add A Blog Badge To My Blog?

Good question, hypothetical person. I am aware that many people have ignored adding blog badges and “grab my button” widgets to their sidebar simply because they don’t think it matters. Well, in fact, a blog badge does matter. With a blog badge, which is an image representing and linking back to your blog, your fellow bloggers can show their support by adding your badge to their sidebar. As you can see in my footer, I have blog badges of other book bloggers who have awesome blogs, all linking back to the blogs when you click on them. So if a blogger likes your blog, they will – without a doubt – add your blog badge to their sidebar. In fact, I guarantee they will. And if your badge is appealing and thought-provoking, I promise you a reader will click on it and will then be taken to your blog. So if you think about it, those are viewers and potential followers that you wouldn’t have gotten without a blog badge. Just from my humble and newly blog, I have – according to my site stats – referred people to Read It, Review It about fifty times simply because of that goshdarned blog badge!

How To Create A Blog Badge

So if you are still reading this, I assume you want to learn how to create a blog badge. Well, excellent. Good choice! (Between you and me, you all were always the more intelligent of the group). Creating a blog badge isn’t very difficult unless you want to make it look complicated. I will tell you how to create a simple blog badge but if you’d like to create a more complicated one, you’ll have to use some other resource.

The two badges above are two of my blog badges: one for Teens Can Write Too! and the other for this blog, The Incessant Droning of a Bored Writer. As you can see, they aren’t very complicated, but they definitely work. They were both made in Microsoft Word; I just inserted a dialogue bubble (you could insert a different type of shape, text box, etc. I personally prefer the dialogue bubble, though) into a blank doc, then added a background image to the dialogue bubble and finally, added some text (aka a blog name and if you can fit it, a small tagline). Pretty simple. You can do the same or something similar in Paint but I prefer MS Word and am pleased with the way the two badges turned out. Again, all you really need to do is a) find an image you’d like to represent your blog, b) add some text, and c) maybe make some other changes like putting the badge in a dialogue bubble. MS Word should satisfy your needs unless you’re feeling ambitious. In that case, I’m sure there are many other resources out there which can be located via Google but I personally don’t think anything more abstract than the above is really necessary.

How To Add A Blog Badge And “Grab My Button” Text Box To Your Blog

And now for the more confusing part made easy – adding the blog badge. This is what used to aggravate me because whenever I’d use the standard HTML code for doing this which most blogs provided, WordPress would shorten the code and only the image would appear in my sidebar and not the text box beneath it which allows readers to copy the code. For those of you who are knew to this entire process, I will attempt to make this as clear and simple as possible.

After you have created a blog badge, you’ll need to upload it to either your blog (this is easier) or a Photobucket account that you may have. If you choose to upload it to your blog (to do this you go to your dashboard, then click on “media”, then on “add new” and select your image file), at the bottom of the image details is an image location. Be sure to copy and paste this location into someplace where it can stay for the time being, preferrably a Word Doc. BE SURE THAT THE IMAGE ADDRESS END IN A “.JPG” AND NOT “.COM”!!!!!! In Photobucket, the procedure is basically the same. Upload your image and copy the image address in the “image details” section.

And now for the part that I struggled with but thanks to this wonderful website, now can do, no problem! After you have completed the above, visit this site: http://www.mycoolrealm.com/sandbox/gbgen/

The first two fill-in-the-blanks are pretty straightforward. Write out your blog title in the first and your blog URL in the second box. The third asks for the image URL which is the web address that you should have pasted in Word. Return to this doc, copy the image URL and paste it into the box provided. Under “container type”, as the website says, SELECT “PRE” IF YOU HAVE A WORDPRESS HOSTED BLOG. This is extremely important. After you have done this, don’t worry about the next four questions. They do not matter. I left them all the same as provided and my blog badges didn’t change from what I had wanted it to be, so don’t even bother manipulating the color questions even if you are feeling ambitious. Once this is done, click “preview”, assure everything looks alright with your badge, and then click “get code”. A text box will appear full of incomprehensible code. Don’t worry if you don’t understand it – I didn’t – just copy the HTML from the text box – make sure to copy ALL of it – and return to your blog dashboard. Now for the final step. In your dashboard, click on “Appearance” and then “Widgets”. From there, you’ll need to add the “Text” widget and maybe title it “Grab My Button” like I did or something more creative if you like. Remember” use just a plain, empty text widget. Position this widget wherever you’d like your blog badge to appear in your sidebar. In my humble opinion, the top of the sidebar is better for placement of a blog badge because it will be seen better, but anywhere is fine. Once you have done this, you must open up the text widget and paste the HTML that you copied from the blog badge generator into the blank widget. From there, you’ll need to click “save” and guess what? You’re done!

Visit your blog, make sure everything looks okay, maybe move around the text widget a little but that’s about it! At long last! If you are curious, the text box below the blog badge is what allows people to “grab your badge” (aka grab the HTML), paste it into the their own “text” widget and add it to the sidebar. If this text box does not show up, that is definitely a problem.

Anyway, you’re done! If you experience any questions or troubles, don’t hesitate to ask me – preferrably as a comment so everyone else with the same issue can see the solution. Also, I would love to hear whether or not this worked for you. If you followed this procedure and your blog badge was correctly added, please leave a comment telling me so. It always makes me feel warm inside. If this post worked for you, it would also be nice for you to add my blog badge (at the top of my right sidebar) to your blog. Just a thought. Enjoy and good luck with your blogging quests!