create your own blog button [FOR FREE]

9:00 AM


Sponsoring a blog can be one of the most rewarding things ever when it comes to getting yourself out there in the blog world. But it can also be a somewhat intimidating thing if you think you don't have the means to even *start* sponsoring. While on this blog, button designs come free with sponsorship, that may not be the case for some blogs. And unless you are in a design career, having photo editing software just isn't in the works for most of us. Let's face it, it's expensive!

I've put together a mini tutorial to show you how easy [and free!] it can be to make your own button and start to get your blog out there to more people. Just like with my other mini blog tutorial, this one uses the free site, Picnik.

I've put together two versions of blog buttons you could make with Picnik... one from a photo you already have, and one from scratch anyone who is just not that into photography. Let's get started...


Alrighty... open up Picnik and choose the"upload photo" option. Choose the photo you would like to use for your button and hit select/enter.


Once your photo has opened, click the "crop" option under the Basic Edits tab. For this tutorial, we will be using the dimensions for my small sponsor spot here on Crafted Love which is 125x125 pixels.

Under the crop section, you are given constraint options. I chose the "square" option to lock my crop grid to a perfect square.


Now that your image is a square, click the "resize" option and change the dimensions to the size you want, 125x125 for this tutorial.
 
If the button you are making is not a square you wouldn't need to do this. Instead, you would resize before cropping... check it out...


For this portion, we'll use Crafted Love's medium sized button which is 275x125. Since it's not a square, you need to change the size of the image before you crop. Choose the "resize" option under the Basic Edits tab. Make sure the "Keep Proportions" option is checked. Change the first number box to the width of the button you want [275]. The second one [206] does not need to be changed.


Now you can go back to the "crop" option. Insert the size of the button you need into the text boxes.Before you hit "apply" move the crop box around until you get the portion you want centered in the crop area. Hit apply. Now we're ready to go back to the original tutorial and add your text...


Whether you're making a square button or going another route with different dimensions, next, you need to click on the Text tab and choose what you want the button to say. With Picnik, you are a little limited on font options unless you upgrade to the Premium software which costs annually, I believe. But they do have a few cute ones for free. I like to use white text when I make my buttons but as you can see, the white doesn't show up very well with this particular picture... not to worry. This will just require a few extra steps...


Go to the Stickers tab and grab a rectangle sticker from the Geometric shapes portion. Change the color to white and resize it in the image so it covers up the text you just added. Drop the opacity down by toggling the "fade" bar until you can see the text again. I put the bar right at about 35-40%. Lastly, right click on the white rectangle and choose "send to back". This makes the text sit in front of the white bar instead of underneath.


 I still didn't like the way it looked so I changed the font color to black. Much better.

Click the "Save & Share" tab and name your file. You'll notice you have the option to resize your button here as well as earlier in the steps. This just serves as a nice way to double check you have the right size. Which we do! First button? DONE.






For this button, it really doesn't matter what you start with. Instead of uploading one of your own photos, save some time and just use one of Picnik's demo photos. You won't see the photo in the end so it really doesn't matter, I promise :]


You will need to crop the image down to the size you want. Once again, I'm using the dimensions for Crafted Love's small sponsor button which is 125x125 pixels in size. You can input whatever size you need/want. It doesn't matter what part of the image you crop so just go ahead and hit "apply".


Now jump to the "stickers" section of the edit menu. Scroll down to the Geometric Shapes and choose the rectangle sticker. Change it to the color you want as the background and resize it so that it covers the whole image. Now you have a blank canvas to work with.


Add whatever other stickers you want to make it your own. I decided to go with a mustache since it's now Mustache November :] You could add as many stickers as you'd like. Go crazy!


Now, it's time for text! Go to the text tab of the editing menu and choose what font you want. Type in the name of your blog and hit "add". Change up the color, size it to what you want and place it somewhere in the image that looks nice. Get it? "Sorry I must dash" Ha ha ha I crack myself up.

Save it and viola! You have a button made [sort of] from scratch!

Send them to the blogger you're wanting to sponsor or pop these two [or more] buttons you've now made into an online photo sharing website like Photobucket where you can get the URL for them.  Pop that URL and you blog/shop link into the code below and stick it in your side bar. This will get you one of those text boxes for your followers to snag the code from!

I hope this tutorial is helpful! Let me know if you have any questions or if anything was a little unclear! Leave your email or Twitter name for the easiest response :]

You Might Also Like

6 comments

  1. great tutorial, I know a lot of people don't know how to do it and it'll be a big help!

    ReplyDelete
  2. Loving this, going to make one right now :) 
    http://beingzhenya.wordpress.com

    ReplyDelete
  3. Thank you so much for this tutorial. I make mine in photo shop right now, but just whipped one up with this and found it a bit easier and more to the point. Thank you for that! :)

    -Sara-

    ReplyDelete
  4. Hi! This is really helpful thanks!

    ReplyDelete
  5. This is such a great post! I have been using this method to making buttons for awhile, but I know there are many new bloggers out there who will be so happy to find this gem!

    -Elisha
    http://myblacktongue.blogspot.com

    ReplyDelete
  6. Great post! I didn't realise you could make them so easily on Picnik.  By the way, you did a wonderful job with our button :D Thanks for the tutorial!

    ReplyDelete

Thanks for stopping by! I'd love to know what you think!
-Allison