How to: Make a Blog Badge and a "Grab this badge" - Evolved Mommy
You know all of those fancy bloggers who have their very own sidebar badge that you can grab and share on your site? Wanna do that, too? Of course you do. Here’s how.
How to make a Blog Badge or Blog Button
Step 1. Create your blog badge or blog button image in Photoshop Elements or Picmonkey depending on your level of graphic artsy-ness.
Step 2. Upload your image to Flickr, Photobucket or WordPress. You will need a web location for the photo from which to work.
Step 3. Write some code ladies.
<div align=”center”><a href=”WEB ADDRESS YOU WANT THE BUTTON TO GO TO”><img src=”LOCATION OF YOUR IMAGE” /></a></div><br>
Which looks like this:
<div align=”center”><a href=”http://evolvedmommy.com/“><img src=”http://evolvedmommy.com/wp-content/uploads/2012/08/badge.jpg” /></a></div><br>
Step 4. Add this code to a text widget box (if you don’t know what this means just shoot me an email and I’ll walk you through it).
How to: Add the “grab a badge” function
With just a little more code you can let your viewers grab your badge and add it to their own blog or website.
Step 1. Take the code from above and add the “grab this badge” code.
CODE FROM ABOVE +<div align=”center”><form><textarea rows=”3″ cols=”19″ readonly=”readonly”><a href=”WEB ADDRESS YOU WANT THE BUTTON TO GO TO” target=”_blank”><img src=”LOCATION OF YOUR IMAGE”></textarea></form></div>
Which looks like:
<div align=”center”><a href=”http://evolvedmommy.com/“><img src=”http://evolvedmommy.com/wp-content/uploads/2012/08/badge.jpg” /></a></div><br>
<div align=”center”><form><textarea rows=”3″ cols=”19″ readonly=”readonly”><a href=”http://evolvedmommy.com/” target=”_blank”><img src=”http://evolvedmommy.com/wp-content/uploads/2012/08/badge.jpg”></textarea></form></div>
Voila!

The EvolvedMommy badge is gigantic for illustration purposes. Small buttons are 125px x125px. Bigger buttons can be as wide as 250px and as long as 600px, but that would be ridiculous. Do what you feel comfortable with.
Have you done this for your blog? Where these instructions easy to understand and follow?


New blog post: How to: Make a Blog Badge and a “Grab this badge” http://t.co/08DYeKBj
[...] a badge for your blog (Stephanie tells you how at Evolved [...]
[...] This was something I learned over the weekend. I initially wasn’t going to spend time looking into it, as I figured it would be too complicated and involve learning how to code. But after a bit of research in google, I came across some easy instructions from EvolvedMommy. [...]