How to edit wordpress header image

Many folks downloading my free Wordpress themes want to replace the header with a custom one and get rid of the title and blog description that overlays the header image. If you’re one of these fine folks, the following should help you out.

If the following seems a bit cumbersome you can easily find someone to do it for you for 10 to 20 dollars on any of the out sourcing sites such as rentacoder.com or even a marketing forum such as the Warriorforum.com
Just make a post asking for someone to make you a custom blog header for 10 bucks. No bits, offer 20. But please do read the following so you have an idea of what it takes.

themeediting

First you’ll need a photo editing program. Many use Photoshop but it’s crazy expensive and if you’re not using it everyday don’t bother. If you have a program to edit images, use that. If not, let’s go with a free program called GIMP.

Download a copy of GIMP here http://www.gimp.org/. Don’t worry about it being too techie. It’s a very intuitive program. You’ll be able to manipulate images with it in no time.

Make a copy of your header image
Navigate to your theme’s folder on your computer and open up the “images” folder.

Open it, right click on “header.jpg” and copy.

Somewhere on your computer make a folder called image work, open it and paste in your header.jpg image you just copied. We do this because we do not want to edit the original header image.

Now it’s time to get an image you like
You can buy one from istock.com or get one for free from http://www.sxc.hu
Once you picked an image, save it in your image folder.

Now open up GIMP and open up your copy of the header image. Select all and delete. You should now be looking at a blank image. We don’t care about that. All that’s important is the size.

Go ahead now and make a copy of the image you just downloaded and save it in your image work folder. Always protect your original, making a copy will do just that.

Open up the copy of your image (you downloaded) with GIMP which should still be open and play with it until you get it the way you want it. Then copy it into the other image you have open which is the same size as your header image.

Once done save your header image as header.jpg and upload it to your theme’s image folder via FTP. You know how to do this because you already uploaded your theme hopefully. Remember, header.jpg goes into your theme’s image folder.

Now view your blog. You should now be looking at the image you created. If not, check the name of the image. Is the original Header.jpg or header.jpg ? Your new header must be saved and uploaded using the same name. Including capitalized letters.

Hiding your blog’s Title and blog description
Now that you have a new image, your title and description may now look crappy and in the way. If so, do the following to hide them.

1. Login to your Wordpress blog’s admin panel.

2. Click on “Appearance” then “Editor”.

3. In the right-hand side, scroll to the bottom and click on “style.css“.

4. You’ll need to be using a Firefox browser to do the following: Hold down “Ctrl” and then press “f” on your keyboard and a little search box will appear at the bottom of your Firefox browser.

firefoxbrowsersearch

5. Search “logo-name” by typing it in the box at the bottom of your browser and pressing return on your keyboard. Now you should be looking at the following image.

seach1

6. Change the word “block” to “none”.

7. Now hit search again (1) and you should see the following image.

search

8. Again, change the word “block” to “none”.

9. Scroll to the bottom and click”Update File” and you’re done.

search2

Now have a look at your blog, the title and blog’s discription should be hidden from the front of the header image.




11 Responses to “How to edit wordpress header image”

#647. How To Start A Blog: Blogging Guides Ask Blog Question Here » Blog Archive » Free Wordpress Themes Says:

[...] Learn how to replace your Wordpress theme’s header image. [...]

#667. Start An Internet Biz Says:

awesome tip Craig…always wanted to know how to remove
the stupid text lettering in WP headers..now I know…thanks!

Stuart Stirling

#671. Craig Says:

Please note, not all themes are edited this way when hiding the title and blog description

#853. Gil Says:

Thanks a lot man. I am sre going to try my hand and some editing.

Thanks Again

Gil

#1308. Bill Says:

Hi Craig,

I’m trying to use your IPB theme and I appreciate you making it available. I’ve changed the header for my own but I can’t seem to make the header center. It hangs to the left. I commented out the right part of the original header (the part with the “feed” icon) and put the new header in place of the ‘headerright’. But I would like for it to center over the rest of the page and can’t seem to make it happen. I would appreciate any guidance you can offer.

Thanks,

Bill

#1311. Craig Says:

Hey Bill, How are you?

Here’s the best way to deal with that… Slice your image to be the same sizes as the right and left in the theme and don’t comment anything out. Make sure the new right and left image are the SAME size as what’s in the original. This way works flawlessly. Playing with the code is asking for issues, even for me.

#1321. Bill Says:

Hi Craig,

Thanks for the advice. I still had issues, probably because of the white space around the header. So instead I imported the header into Corel and then pasted my text logo and graphic onto it and saved it as a new header. Worked out perfectly.

Thanks again,

Bill

#1326. Craig Says:

perfectly? Lucky you :P

Blog on,

Craig

#1452. Andrew Clarke Says:

Brilliant – easy to follow step by step instructions and I had a new header in minutes. Thanks, you have made me happy.

#1528. Judith Says:

I’m just getting started with blogging but took a look at this to see what’s in store. I can tell by the way you give instructions that I will be able to do it. The first time you and I talked on Skype you made the observation that I was “rather technically challenged”. This is only a temporary condition. I can’t wait to get started on my blog and I know it’s going to be awesome.

#1530. Craig Says:

That’s Great Judith!

BTW: I was soooo technologically challenged when I first started out I would shake, tremble, and have extreme anxiety.

I remember agonizing for weeks over what domain I should buy… Should it be a .com -OR- .net? Should I put my name in it? And on and on. Come on! It’s a seven dollar deal. I now know that it was just fear over taken my mind and preventing me from just taken action.

So, you are way ahead of where i was :-)

Looking forward to seeing your creation.


Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>