May 26, 2014

Premade Blog Header Instructions

The following instructions/tutorial are mainly for people who bought or want to buy one of my Premade Blog Header Packages in the Etsy Shop. But all other bloggers are more than welcome to read it too!

Not everyone has the skills or the time to make their own blog headers. That's why I dedicated a section of my Etsy shop to them. At first I started out with customized headers. My plan was to add the title and subtitle for my clients, but since that involves more work the price had to go up for these items. I got the feeling that people are hesitant when they have to 'order' a digital item instead of downloading one instantly. That's the reason why I changed the customized header packages to premade header packages. Now you get your files instantly after purchase and the price went down from $ 10.00 for a package to $ 3.00!

It basically means that you buy a package of digital header images which you can upload to your blog or website to give it the look and feel you like. The header images come in a standard size of 1000 pixels wide and without text. So if you want the headers to have a different size or you want to add your text, I guess most of my clients would appreciate a bit of visual instruction how to do that. Not everyone of us had the knowhow when we want to start blogging.

In this tutorial I use the image editing program Photoscape which can be downloaded for free at So if you haven't already, download it and install it on your computer (you can edit your own digital photos with it as well, so you don't only have to download it for adjusting blog header images).


Start by opening Photoscape.

When the program has been opened, select the header image you want to work on. It now appears in the bigger screen on the right. Notice that there is a tool bar on the bottom of the screen. Under the first tab (start tab) you will find a button to change the size. Select this button to change the size.

Once you've selected the button to change size a little screen pops up. Here you can easily change the size of the image by typing in the pixel size you want the width and height of your image to be.

So that was changing the size. Easy, right? Now over to adding some text! For this we need to select the second tab on the bottom tool bar. This tab is probably called 'add' or something (my program only shows Dutch directions). Select that tab and within that tab select the 'T' button to start adding text.

Select the 'T' button and a small screen will pop up again. In this screen you can add your blogtitle and subtitle, but you can also select the font you want to use, its size and its color. Just play around with this tool for a while until your title looks good. On the bottom of this little screen there is the option of placement. With this tool you can place your text right in the center of the head image. You also have the opportunity to just click the text on the screen and drag it around to the right position. The choice is up to you!

You've added your title and maybe adjusted the size, don't forget to save the image. Now it's time to upload the image to your blog!


There are many blogging platforms, but I'm going to show you how to add your header image to Blogger and Wordpress, since these are two major blogging platforms and since I have personal experience with both of them.

If you have a blog on Blogger go to your Blogger start page. On this start page chose the option 'Layout' on the left side.

Once you've selected the Layout option a new screen will show itself. In this screen you see an overview of your blog's layout. To upload a header image click the 'edit' button on the title/header bar on top.

A small screen appears in which you can type your blogtitle and subtitle, but you can also upload an image here. Chose the option to upload an image from your computer and select the header image of your choice.

Notice that there are also several options for the placement of the image. You can place it behind the title text (this can be done when you use an empty blog header image without text, Blogger will add the text for you then). You can also chose the option to let the image appear instead of title and subtitle (chose this option when you've already added your title text to the image).

Don't forget to save it and now the image should appear on your blog.

In case you have an empty header image and you didn't add the title text already, Blogger gives you the option to add your blog title and description in Blogger itself and change the font, color and size of it. Make sure that for this option you upload an empty header image and you chose the following placement option: 'Behind title and description'. This way the title will be typed over the image.

Now, how to change fonts, color and size of your blog title and description in Blogger itself?

Go to your blog's starting page and chose the 'Template' option from the left side bar. Then click the customize button.

After selecting the customize option you will be directed to another screen. In this screen chose the 'Advanced' option. 

Inside the Advanced option you will have the opportunity to change a lot of things in your blog. But to change the font, font size and color of the blog title and description, select 'Blog title' and 'Blog description'. Now you can play around with fonts, colors and sizes. The changes will be visible in the screen below and once you're done just press 'Apply to Blog' in the upper right corner.

IMPORTANT NOTE: not all Blogger blog templates let you use all of the advanced options. The ones that Blogger offers when you first open a blog do, but if you buy a Premade Blogger Template or download a free customized Blogger template from somewhere it could be that these options have been locked by the designer of the template. So keep that in mind!


I will show you how uploading a header picture works on the Wordpress template I use for my cooking blog. I guess most Wordpress templates work in a similar way, but I can't give any guarantees. So before purchasing premade blog headers it's a good idea to check if your blog's template provides the opportunity to change header images.

Okay, over now to the Wordpress dashboard of my blog. To change a header image I have to be at the 'Appearance' section in the left side bar. Select that button and within the Appearance button select the 'Theme options' button.

Inside the Theme Options you will see a line of tabs on top of the screen. Select that 'Banner' tab. Now you will be able to upload a header image from your computer. You can see the Veggiestyle image I have currently uploaded on here. Don't forget to click the 'Save' button on the bottom of this page once you're done!

I hope these instructions were enough for you to get started with your own blog headers. Please don't hesitate to ask something when you still have questions after this tutorial!

No comments:

Post a Comment