- First you have to have your images ready on your PC (personal computer). You may create your own if you are good at it. Alternatively you may find Header Templates doing all the jobs for you if you want your header images to look professional; or get some free header images from the Internet here
- Second you have to login to your WordPress Dashboard, find out your header images dimensions by clicking on Design/Theme Editor/header.php
- Scroll all the way down to find this line: <div id=”header_img”>. The header dimension looks like width[970], height[140]
- Once you know your header image’s dimension, you may have to customize your image(s) on your PC the same width and height as stated in your header.php file. I use a simple program - Microsoft Paint (which came with my PC) to do the job
- Save your images as .gif, .jpg, .jpeg, or .png. The default image extension uses .jpg. If you are curious about these image extensions, visit GIF, JPG and PNG - What’s the difference? to learn more
- Use FireFTP to upload your saved header image(s) to this folder: /word-content/themes/your_template/images; if you don’t have FireFTP, you can use any available FTP you have to do the job. Make sure you change your_template to be your real template name
- The header image(s) you uploaded will replace the default ones. In my case I need to upload five different header images. You should give the same name(s) as your default one(s)
Do you like this article? Then don’t forget to subscribe! Also your comments are welcome!
Related articles
How To Customize Your Header Images
How to Replace Your Header Image in WordPress.com Blog?
Interesting in Getting a Header Image for Your New Blogger?
Technorati Tags: Cutline, cutomized header images, header image, header images, WordPress blog




13 responses so far ↓
1 What is Your Reaction When Someone Stole Your Content? « My Internet Stuff // Apr 23, 2008 at 6:56 pm
[...] 23, 2008 · No Comments Yesterday when I searched the topic - Interested In How to Change Your Header Images?, I found out that someone stole my partial article (the beginning part). My site showed up on the [...]
2 Shannon // May 6, 2008 at 8:15 am
Hello, this is a wonderful article! I am a bit confused though. When I have my own image ready, I have to save it as .gif, .jpg, .jpeg, and .png, ALL OF THEM? Or just one extension? Also, say I have the image saved as mylogo.jpeg on my computer. I have to change this to header_1?
Do you know how to have just one and only one header appear?
Thanks so much for your response!
3 Shannon // May 6, 2008 at 8:37 am
I got it! Thanks for your tutorial!!
4 Lanna // May 6, 2008 at 8:55 pm
Hello, Shannon;
I am happy that this tutorial helps you. You also asked how to have just one header appear. Did you get that one too? If not, here is the solution for that:
open head.php by clicking on Design/Theme Editor/header.php on your WP Dashborad; find and keep this code:
<img src=”/images/header_1.jpg” width=”970″ height=”140″ alt=” header image 1″ title=” header image 1″ />
Then delete the other cases. This way you can have just one header appear. Hope it helps.
5 Mus_ // May 9, 2008 at 1:11 pm
hey.. nice info.
i have similar post to this article in my blog.
http://www.profmustamar.com/how-to-randomly-change-your-header-image/2008/04/22/
6 How to Add a Favicon to Your WordPress Blog? « My Internet Stuff // May 18, 2008 at 2:20 am
[...] just added a favicon to my WordPress blog. Now it is your turn to add yours. If you don’t know how, the following steps could be [...]
7 How to Replace Your Header Image in WordPress.com Blog? « My Internet Stuff // May 25, 2008 at 3:37 pm
[...] articles Interesting In Getting a Header Image for Your New Blogger? Interested In How to Change Your Header Images? for WordPress [...]
8 charles // Jul 10, 2008 at 2:37 pm
Thanks for the tutorial - great job!
I’m running Cutline 1.3 columnsplit and trying to create a page ( memoria in aeterna) with a static image (header_harold.jpg).
The problem is, the (memoria in aeterna) page is ignoring code inserting my other images (header_1.gif thru header_29.gif). The (memoria in aeterna) page is correctly defined within and does appear on all pages of my blog.
Below is my header code. Any assistance is appreciated.
<img src=”/images/header_harold.jpg” width=”975″ height=”150″ alt=” memoria in aeterna page header image” />
<img src=”/images/header_.jpg” width=”975″ height=”150″ alt=” random header image” />
9 charles // Jul 10, 2008 at 2:41 pm
Here is the complete header code:
<img src=”/images/header_harold.jpg” width=”975″ height=”150″ alt=” memoria in aeterna page header image” />
<img src=”/images/header_.jpg” width=”975″ height=”150″ alt=” random header image” />
10 Lanna // Jul 12, 2008 at 6:48 am
Hello Charles,
Please check your default image dimension. Is it like what you said 975×150? or 970×140? If your image is too big, it is not going to show up because I have that experience with mine.
11 Lanna // Jul 12, 2008 at 7:28 am
Oh, if you created a new page. Don’t forget to include codes in your header.php; toward the end of the file. This is for your HOME page
<?php if (is_home()) { ?>
<img src="<?php bloginfo(’template_url’); ?>/images/header_1.jpg" width="970" height="140" alt="<?php bloginfo(’name’); ?> header image 1" title="<?php bloginfo(’name’); ?> header image 1" />
You can change slightly with your memoria page. If you want to have a static image just for this page, then it should not be in the loop of other images. It should be modified just point to this page. Hope this helps.
12 Charles // Jul 26, 2008 at 2:19 pm
Lanna, thanks for your assistance. All 35 of my header images are 975/150 respectively. I also had the correct code in my header for the “memoria in aeterna” page.
Please note that I also had other page (i.e. announcement, contact, and about) that worked with static image without any problem.
My problem was after I change the page name from “memoria in aeterna” to only “memoria” it worked.
Thanks
13 Lanna // Jul 29, 2008 at 10:12 am
Hello Charles;
You’re welcome. I am so glad that it works out for your memoria page now.
Probably when you created your codes, you used “memoria” instead of “memoria in aeterna”. So that makes sense that it works after you changed it to be the same name as you stated in your codes.
Your email is never published nor shared.