Make your own blog header!

Update #2: When I published this post over two years ago, I never imagined it would be one of the top in Google searches. It gets close to 100 hits every day. Wow! I know for a lot of big bloggers that’s no biggie, but this post by far brings the majority of my traffic here. I hope you stick around and see what else is here. I have begun posting more regularly again and would love for you to subscribe. 

Also, I no longer use GIMP to make headers, I’m using Photoshop now. Do my instructions still work in newer versions of GIMP or do I need to update? No one’s complained yet, but please let me so I can update if needed. 

Thanks for stopping by! Hope this is what you were looking for! If so, please continue to leave a comment and let me know! 

 

Update: So I see that this post has been getting at least a dozen hits a day, but no comments. Please leave a comment and let me know what you think of this tutorial. Was it helpful? Was one part confusing? Did you use it to make your own header? Send me a link if you did!

In honor of my new blog header and the frequency which it seems to change, I thought I’d put together a little tutorial on how to do one yourself. I ended up figuring out how to do it on my own, but I know not everyone is skilled that way, so I decided to share.

First thing you need to do is find a scrapbooking kit. You can purchase these if you would like, but personally, I like things that are free. So if your like me, head here! Once you have downloaded it, open the zip file and file it somewhere where you can find it later.

The next thing you need is a photo editing software, like Photoshop or GIMP. If you don’t have one, download GIMP, it’s free too!

Now open up your software program, and your ready to go.

First thing you need to do is determine what size you need your header to be. The Word Press layout I’m using says that the header size is 904 x 160 pixels, so that’s what I will make the size of my header. A standard Blogger size seems to be 650 x 300 pixels. Blogger accepts any size, but just keep in mind how it will look on your blog.

Okay so let’s get started.

Open up a new project and then set the size to what you need or want. I entered 904 X 160 pixels for my WordPress blog.

Open a new project

Set size of header

Now you should have a blank project open in your screen. Now your going to go in and pick your background “paper.” Go to File, and then click open as layers, and then select your file and open it.

Open as a layer

Now my background is open, but the paper is very “zoomed in,” so I need to scale it down. How much you scale it down is really a personal preference. Play around with it until you find something that you like.

Fullscreen capture 6172009 23512 PM

One thing you have to keep in mind when scaling is the size of your canvas as well as the size and shape of the item your using. See in the picture below how there is the square outline on the screen? That is showing the size of the “paper” that I am using in comparison to my canvas. If I tried to manipulate that into my canvas, it would get stretched and end up looking, well, odd. Possibly. It’s all about the look your trying to create.

Fullscreen capture 6172009 23733 PM

So continue to add more “papers” and embellishments using the same method as before.  And also add your text. I usually make this the last thing I do. If you want some fun fonts, try looking here and here for some great free ones. I also highlighted some handy buttons in your toolbox in the picture below.

Fullscreen capture 6172009 24143 PM

When your done, you need to save it! Very important!

Fullscreen capture 6172009 25618 PM

When you click save, a box like above should pop up. Put in the title of your document, then select where you would like it to be saved, then, select the file type. You need to scroll down and select the JPG, JPEG file type! Then hit save!

Tada! Your done the hard part now. And here comes the best part, uploading it so all your adoring fans can see it!

For WordPress Users:

I strongly recommend choosing your theme before you create your header. Look for a theme that has the tag “custom header” or search by that feature. Once you have chosen, click on custom header, under appearances. Then look for the numbers that tell you what size will be used as-is. Create your header off of those numbers. Then come back and upload your header, and your done!

For Blogger Users:

You need to go into your dashboard and then choose layout. Click edit in the top box that should read the title of your blog. Then upload your header as a picture from your computer, and click on instead of title and description under placement. Let it upload your your done!

Hopefully you all found this helpful, easy, painfree and enjoy creating your own header(s). Please don’t hesitate to ask any questions that you may have!

About these ads

125 thoughts on “Make your own blog header!

  1. Awesome easy to follow post. I have been looking for a way to make a new header for well over a year without having to pay, , and then I happened upon your post here. This is awesome, and it worked. Now, thanks to you, I have a new header on my blog that makes it look professional (at least I think so). Thanks.

  2. I love this!! Thank you for posting this. I was about to download Gimp program (at work oops!) and then a co-worker told me I had it already! Woo hoo. I just threw one together in 10 seconds, but I’ll play with it at home. Thank you thank you!!

  3. This is the best tutorial ever! It really simplified things-I haven’t played around with a photo editing program like this in 10 years. It brought back the fire for design! Thanks so much!

  4. What an excellent website. You guys have done a great job organizing everything and making the navigation easy to browse. How can I subscribe to your RSS feed? If you have one please let us know how to get more great information from your website.

  5. You will happily give you feedback. I cannot tell you how grateful I am for this wonderful tutorial. I had been trying to figure out how to design my own header without knowing how to do it and spening money on software I might never use again. With your help, and the Gimp software, I was able to create a page I love…and I will definitely use the software again and again!! My site is still new, without posts, but feel free to check out my work in progress blog.

    Thanks so much!!

    Niki

  6. Hello Morgan. I found your blog on creating a header to be very helpful, however, I still am having trouble creating one. Do you make headers for people?

  7. Hi Morgan,
    I found your blog on creating a header very informative. I’m still having a lot of trouble creating one though. Would you be willing to help me?

    Thanks!!

  8. This tutorial was extremely easy to navigate…thanks so much!! I never knew about Gimp, but I have come to love it and it’s user friendly (for dummies) ways! :)

    The only problem that I did run into is that I use the new Blogger Template Designer (I have the Picture Window template), so the dimensions are a bit off and I cannot figure out how to size the Header right. Any idea what the dimensions/pixels would need to be for my Header?

    Thanks again…
    Sarah E.

  9. Awesome. This is perhaps the programme that I needed when I first started out as a blogger. .:P.. But I have been experimenting a lot with paint and photoshop (actually just getting to know photoshop a bit better, since I am quite used to windows paint) and have become a lot better than I was before at designing my own headers. :) But I’ll think of gimp whenever I decide it’s time to change headers. But I do think I’ll most likely stick to this header for quite a good while. :D

  10. Pingback: Picture Pretty? «

  11. great tutorial! Its taking me two hours and i still haven’t figured out what type of heading i want from the free scrap blogging website. I daren’t even click on the links to the fonts you have

  12. Thank you it was helpful and informative! What took me a while to figure out was how to move the background around as a layer. The only difficulty I had was figuring out how to make a stylish not tacky background with my own pictures. :) Yes I did make my own header from your tutorial. Thanks again!

  13. This is great! I’m pretty much Gimp-illiterate and usually just end up clicking all over the place in resigned frustration but thanks to this I actually made something! Thanks so much :)

  14. I guess I’d like to know – the “embellishments” you added, such as the flower in your example above. Where did that come from?

    Many times when I’ve tried to download pics like that, they end up coming through with a black background. So I’d love to know where you got the pure image from …..

  15. Thanks for sharing this program! I have been looking for a way to create my own header for some time now. This is by far the best thing I have found on the internet. Most of the programs look rather bland and don’t offer many functions. Thank you.

  16. I did it! It took me several days but I was able to customize my header. I’m very UN-tech savvy so I’m so happy I found your tutorial. Thank you!!!
    Do you have a tutorial about how to create a button and the code to go with it?

  17. Pingback: Comeback Kid |

  18. Thanks so much for this, i finnaly decided to have a go at creating my own background for my blog so fingers crossed with your help it’ll work :)

  19. Thanks, this was a huge help. I will bookmark it and use it to create other images for my blog as well. I love the open source links to. The only thing I would change would be to have your links open in a new window so I don’t have to hit back all of the time.

  20. Pingback: How to Make a Header for Your WordPress Site with Free Graphics Tools

  21. I’ve tried Gimp once years before. But it had too much stuff and I went for something simpler. Will be glad to have a guide to trying it again. I’m running Linux now and not using my old MSWindows graphic software, the simple one. Thanks for your post.

  22. I am sooo glad that I found your post! You are a lifesaver! :) I just started my blog and I was having such a hard time figuring out how to get my own header/background set up- and then I found your blog! Thank you so much for this post!

  23. Nice tutorial, but just to point out, where it says: So if your like me,
    the your should be you’re.
    Thanks for the instructions!

  24. Pingback: It’s Saturday | More Fruit Please

    • Shannon, sorry the tutorial didn’t help you. I don’t actually design blog headers for other people, but there are plenty of people who do, so look around for someone who can design one for you.

  25. Thank you so much. This has been the only time I have managed to make a blog header, albeit a basic first attempt, without wanting to drop kick my laptop through the nearest window. The only problem I had was when I went to save, it didn’t give me the jpeg option, so I searched through some help notes and discovered I had to export the file to save as a jpeg… just something to note in case anyone else gets that thrown at them! Once again, thank you.

  26. I’m trying to design a header that has a photo or a scanned in drawing that I’ve done myself as the background rather than a scrapbook background but I have no idea how I could do that.. I’m wondering if you could help me out!

  27. I tried following your instructions and they worked fab up until I wanted to save it as a jpg – the option to choose jpg format wasn’t there so I wrote ‘jpg’ next to the file name instead, which did save it as a jpg except it contained no image and when I tried to upload it onto my blog it said it was corrupt or is in an unrecognisable format… what can I do?

  28. Fantastic and easy to understand tuturial! You missed your calling in life I think :) Thank you so much, I’m excited now to make a banner!

  29. Hi, I am trying to start out this morning and am already stuck at http://www.digiscrapdepot.com, where I signed up as a member and they said they sent me an email so I can have access but they didn’t, so I have my Photoshop all ready but no scrapbooking kit. Anymore leads on a kit and do they just say kit or do you build the kit somehow?
    Thanks,
    Rhonda

  30. Pingback: Idea Development 1 « Art is hard.

  31. Great tip on the digital scrap booking freebies! I went over there and found one that was very close to my old color pallet. I’m working on a new banner and button and can’t wait to go live with it!

  32. Pingback: What’s in a name? | ngnrdgrl

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s