Thursday, May 7, 2009

how to make a blog button without photoshop

This week, we set about trying to figure out how to make a button for our blog. We looked online for advice, but mostly found references to using Photoshop and other software that we didn't have. Going out and spending money on new software just to make a blog button didn't seem to fit with our penny-wise nature, so we decided to see what we could figure out.

Once we found a way to do what we wanted (we're not tech-savvy folks, so it took some figuring!), we realized that there were probably other folks out there who might be trying to do the same thing. So, we thought we'd share what we've learned.

To make a blog button without Photoshop (the Penny-Wise People method):

1. Find a photo you want to use for your button (or, like we did, ask someone to draw a picture for you, and then scan it in, or take a digital photo of the picture and upload that).

2. Open Word - click Insert on the toolbar - and click Picture on the Insert menu. Browse to the location on your computer where the photo you want to use is located, and insert.

3. Resize the picture to be manageable, but not too tiny yet - you can shrink it down to button-size later. We didn't want to be working with a little square at this stage, as it would have made the text editing/positioning more difficult.

4. If you want text on top of your photo (like we did), click on your photo, and then open the Picture toolbar. Click Behind Text on the text wrap menu.

5. Type the words you want, choose your font, etc. - and then drag the photo on top of the words. You might have to play with the font size and the spacing to get everything centered or otherwise arranged the way you want it. There are also buttons on the picture toolbar that will let you change the brightness of the photo (if your words aren't showing up well).

6. Make sure all of your photo is showing on your screen, and then click "Alt" and "Print Screen" on your keyboard, to take a snapshot of the screen.

7. Open Paint, and click Edit and Paste to bring the snapshot into Paint.

8. Use Crop (in the Image pull down menu) to crop out everything but the button image/text.

9. Use Resize to bring the image down to the size you want. You can try using the Attributes function and entering the size you want, but when we did that, it cut pieces off our image to resize it. The Resize function sized it down without changing or cropping anything. Since we didn't want to lose half our button, Resize seemed to be the way to go!

10. Once your button is the size you want, Save the image as a JPEG or GIF. We tried GIF but we got a message that our colors were going to be lost - we didn't want that - so we used JPEG.

Once you've completed the Save, there's your button image - ready to upload into your blog!

The same basic process works for creating a banner - just adjust the sizing accordingly.


Happy button making!!

No comments: