Thursday, March 3, 2011

When I first made a button for my blog it took me FOREVER to figure out how to do the html code to get a snazzy little grab box underneath it. Hours of googling, tweaking, googling, tweaking, googling and tweaking. So I'd like to share what I learned with you so you can hopefully keep your googling and tweaking to a minimum...

First off you're going to need a button. This is a fancy name for a jpg. You can use a photo or text or a photo and text, or some graphics, or really, anything. It's common to make it about 125 or 150 pixels square. You can do this when you design it (I use elements, but you can use any editing program you like), or I'll show you how to resize it later if you need to. OK, so here's my button:

Next up you need a photobucket account. Don't have one? Go get one. I'll wait.

Ok, so upload your button to your photobucket account, then click on edit, resize. (If you need to resize).

Here you want to click on "keep proportions" and then input your new size (I put 150 x 150).

Click "apply", then click "replace original" (down at the bottom).

You can do lots of other editing here in photobucket if you like.

I went to edit, decorate, borders, and added a border.

Remember to click on apply, then replace original.

When you are happy with how your button looks you need to copy the "direct link" code. You're going to need this in a minute.

hmmm, I'll have to try that one, all other other similar ones I've tried didn't work, and I gave up. :) Of coure that means I need time to make a new button.....are yoiu handing out time with this post? ;)

Great job on this Beginners Guide to Button Making tutorial, Rachel! I never even thought about using an online photo editor like Photo Bucket to add a frame to buttons. You can do this on PSE too but it's complicated. And for people who don't have the software, it's awesome to have another option.

Thanks a MILLION! I started reading about 5-7 other 'how-to's' but they didn't simplify if enough or at least didn't speak to the way I learn. I tried for a month. (and quit lots of times!) Your tutorial took me all of ten minutes! Super-thanks! :)

I am dying over here trying to figure this out. Does this make just the grab box or should I also see the button as well? Or do I need to use the add gadget to just place the picture of the button above my grab box?