Saturday, February 9

Public Service Announcement 1.02

It wasn't part of Questionfest 2008, but Military Mom asked if I made the new header myself. That led me to thinking that some of y'all might appreciate a little lesson on how to purdy up your Blogger templates (sorry Wordpress peeps, you're on your own until I figure out that drama for myself, which has been an ongoing project for months). I can do that. So, lesson one will be how to make and upload your own header to Blogger.

First of all, you need to use a Blogger template that allows custom headers. I've never played with all of them to find out each one's status, but I do know that the Minimas, Motos, Rounders, and Tic Tacs are all OK. You are currently looking at a tweaked version of Mr. Moto.

Next, you need to create your header. However, you can save yourself a lot of grief if you find out how wide your header can be before you go get funky with graphics. To do that, go to the Edit HTML screen in Blogger (it's right next to where you go to pick a Template). You're not going to edit anything for this, it's just really smart to look at the code. I've found that while Blogger is supposed to autofix the header width, it does a crap job of it. You want to look for the section that talks about Outer Wrappers. There you will find the width. It'll say something like 682px (px stands for pixels--you don't really need to know what it means because photo editing software usually works in pixels anyway). Write that number down.

Next, you need some software to edit your photo or create a graphic in. While PhotoShop is fantabulous, I'm sure I'm not the only one that doesn't have several hundred dollars laying around so that they can buy it. Instead, I use two free programs. One is called PhotoFiltre. You can download the older version (right now it's 6.3.0) of it for free, and it is basically a knockoff of PhotoShop. It's a French program, so the help files are pretty useless, but it's still worth five minutes of your time to download it. You can do all sorts of photo editing and graphics creation using it. I created probably 70% of the new header using it, including the polka dot background.

The other program that I use is called Picnik. It's a web-based program that will allow you to edit a photo then save it to your hard drive, Photobucket, Facebook, etc. There are two levels of Picnik, free and Premium. The difference is that for $25 per year, you can have access to a ton more fonts and effects. I got by with the free version until recently when I suddenly just had to have a particular font. Since then I've been going crazy with Premium features, so it was worth the upgrade for me (and still way cheaper than buying PhotoShop). I think Picnik is real easy to use, even if you are technologically challenged.

Regardless of how you do it, purdy up an image for yourself, then make sure the width is exactly the same as that number you wrote down earlier. It seems that it can be whatever height you want. Although, I will say that really tall images do force your readers to scroll a lot to read your content, so you might not want to get too carried away. Once you are happy with the image, log into Blogger.

To upload your new header:

1. Go to Layout.
2. There's an area near the top of the screen that says "Header." Click the Edit link.
3. You can upload your image from the web or from your hard drive. I think it's easier to get it from your hard drive. Click Browse, search and destroy, and select your fancy new image.
4. Click the Instead of Title and Description radio button. (Side note: You're better off using Picnik to add the title of your blog to your image than you are trying to get Blogger to put the text in the right spot by itself. You can't control where Blogger puts the text, as far as I know.)
5. Click the Save Changes button.

Ta-dah! You have a new header. Next up, changing the background and text on your Blogger template.


  1. Also, while I kept hearing "Mr. Roboto" in my head each time you said "Mr. Moto", I kept thinking you were typing Mimosas instead of Minimamas.
    That might be because I would LIKE a mimosa. It IS Saturday night. And I'm readin' blogs, drinkin' cosmos, eating port wine cheese log, and watching "Balls of Fury".

    Good times.

  2. I am considering a 12-step program. Really, I am.

  3. and that would be a 12-step program to manage my Christopher Walken addiction...

  4. I need to get one of those photoshop type programs. You don't even want to know how I changed my header!

  5. I'm sad to say you can control where blogger puts your text if you know about padding, startSide, endSide blah blah blah--I learned the old fashioned way one weekend and it took FOREVER!---I've learned all about code since and and have not found any help out there as good as yours! I love it. I'm changing my header right now!
    I am so excited about your photoshop options--I too can't afford to just run out and buy it. Maybe when I get my macpro notebook--someday.....for now it's my good ole pc desktop. sigh.
    thanks for the tips!

  6. Look at you all handy like!

  7. Thanks for the tips. I am trying hard to follow it all, I am very computer stupid.

    Here's a stupid question:

    I haven't trouble with the width, but the height, man, my pics are too tall! How do I fix that?