Holy Cow- I made a grabbable blog button!

Ask anyone, I am the most technology challenged human alive.  Seriously, my students usually have to update my computer and work my dvd/vcr combo. A few weeks ago when the hubs saw me blogging he was AMAZED that I could do it. Like he kept repeating "Wow, I'm so impressed!" over and over.

Some would say that's insulting, I'm kinda taking it as a complement.

Anywho- a few people have asked why I didn't have a blog button, and when I said I had no idea how to make one they did give me some names of people who would make them for me for a small fee. I think the prices ranged from $8-20....which really isn't bad, unless your cheap like me. When I told the hubs he told me that I could pay to have one made, because he didn't think I could do it on my own. Oh he of little faith!

So off to the blogosphere I went. I actually googled 'How to make a grabbable blog button' and got a few different sites. The first one was super easy to follow, but it didn't work in the end. 

I started by making the picture for the button.

First, I uploaded a picture to picnik (LOVE that site!!).  Then I cropped it into a perfect square (click on crop on the left hand side, then in the drop down menu that says "no constraints" choose square) and applied the settings. Then I had to resize it to 125x125 by clicking on the resize option and putting in 125 and applying that.

Your image should get pretty small, then you can zoom in by adjusting the zoom on the bottom right of the screen. It may look a little pixelated, but that's okay.

Now youre done with the basic edits, and you can proceed to add text by clicking on the text tab. Play around and have some fun, you can do whatever you would like! Then when you're done click on the Save and Share tab and save it to your computer.

Then you need to upload it to a photo sharing site, I used photobucket. Alot of people recommended picasa, but I couldn't find the URL for the photo on there, and on photobucket its super easy to find. Just hover over the image and click on the direct link and it will automatically copy to your clip board.

Now you can make two kinds of buttons, the first is just a blog button that will link to your site. The second is a grabbable button that others can copy and paste onto their blogs.

The first code is pretty easy:

<a border="0" href="yourblogURL" target="_blank"><img src="yourimagedirectlinkURL"/></a>

So you copy and paste this into the HTML section on your blog and change the items in red to fit your specific blog. You have to keep the quotation marks and when you're done it should look like this:

<a border="0" href="http://inthiscrazylife-bethany.blogspot.com/" target="_blank"><img src="http://i851.photobucket.com/albums/ab79/lperkaos/BlogButton1.jpg"/></a>

Now this wont put in the option for others to grab, but it will make it appear on your blog or in a post and will link back to your blog.

If you want a grabbable blog button that code is a bit more complex. I found the one that worked for me over at The Pink Lemon Tree.

<div align="”center”">
<a href="YOURBLOGADDRESS" target="”_blank”"><img src="YOURIMAGEADDRESS"/></a>
</div>
<div align="”center”">
<form><textarea rows="”6″" cols="”19″" readonly="”readonly”"><a href="YOURBLOGADDRESS" target="”_blank”"><img src="YOURIMAGEADDRESS"/></a></textarea></form>
</div>

Here's what mine looks like:

<div align="”center”">
<a href="http://inthiscrazylife-bethany.blogspot.com/" target="”_blank”"><img src="http://i851.photobucket.com/albums/ab79/lperkaos/BlogButton1.jpg"/></a>
</div>
<div align="”center”">
<form><textarea rows="”6″" cols="”19″" readonly="”readonly”"><a href="http://inthiscrazylife-bethany.blogspot.com/" target="”_blank”"><img src="http://i851.photobucket.com/albums/ab79/lperkaos/BlogButton1.jpg"/></a></textarea></form>
</div>

Then just save the code and it should appear in your blog, allowing everyone to grab it.

 Easy peasy lemon squeaszy!

PS- hubs, if you're reading this I really did do this all by myself...check the bank account, I didn't pay a cent for it. HA!