I have noticed quite a few hits over the last few days from people looking for how to make a header graphic for a WordPress blog. I wrote a couple of posts a few days ago about making your header graphic a link, and that has been showing up in Google for this search query. Anyway, I thought I would take a couple of minutes and show you how to set up your own header graphic in WordPress.

The first thing that you have to do is figure out where your header graphic is stored in your theme directory. There are a couple of ways to do this. The easiest way is to load the theme, and then load your site. Right click on the header graphic and choose “View Background Image” (in Firefox). This will open the graphic up in your browser, and show you the web address of your header graphic. You can save this to your hard drive and open it up in a graphic editor if you just want to edit the graphic that is already there (as the first example I give you below). You need to figure out the size of your graphic, as you want to keep your replacement graphic the same size (it is much easier this way). You can also get the location and size of your graphic from your CSS file…just be careful when messing around with this file, as you can mess up your whole blog very quickly by changing the wrong settings (yes, I speak from experience!)

The next thing you have to decide is what kind of graphic you are going to need. Whatever you choose, it has to fit in with the theme of your blog. For example, on this blog, I only made a small change in the header graphic. Originally, it appeared like this (click on the graphics to see a larger version):

I reworked the original in my graphics program to look like this:

On another blog, I wanted a completely different look, so I created a whole new header graphic to put in the place of the original header graphic. The original header on that blog looked like this:

In its place, I created this header graphic:

When you have your new graphic ready, you have to upload it into the same file that your original header graphic was in. To be on the safe side, first rename the original graphic. I usually just add a number into the name to preserve the graphic. You don’t want to overwrite the original graphic, just in case something goes wrong and you want to revert to the original graphic.

Next, save your new graphic with the same name as the original graphic, and upload into the same folder on your server as the original graphic. You must use the same name as the original header, or you will have to edit your CSS file to call in the right file. You can use the control panel of your web space provider, or an FTP program to upload the new graphic to your server. Once uploaded, if you have done everything correctly, the graphic should show up in the header of your blog!

If you don’t have a good graphics program for editing, or creating great web graphics and headers, check out Xara. This program has a lot of functionality (comparable to Photoshop) and at a reasonable price. You can get Xara Xtreme for only $89. This is what I currently use, and I like it a lot!

Good luck getting your header graphic set up just the way you want. This can change your whole blog’s look, giving it a unique appearance, which is exactly what you are looking for!