Adding image Banner to Your Header Blog

My friend ask me how to add a banner (picture) to header blog. Are you too? these is the guides to add a banner to your header.

First of all, you must make a banner. You can create your banner with several tools such as adobe Photoshop or corel draw. You can also create it, with online banner maker tool, such as http://cooltext.com.

example :

And then upload your banner to image hosting, to upload a banner to image hosting you can read my previous post at Upload to image hosting or Google page creator.

For example, i has been uploading  a banner and have an address :

http://kangrohman.googlepages.com/blogtutor.jpg

 

Okay, now you are ready to set your banner in your blog. Here, this is some guides to add a banner to your header.

For classic template :

1. Login to blogger with your ID.
2. Click Template.
3. Click Edit HTML tab.
4. Backing up your template (very important!)
   
5. Find these code below :
   #header{
   .........
   .........
   .........
   }
   
6. Insert your banner URL like this :
   
   #header{
   .........
   .........
   .........
   Background:url(http://kangrohman.googlepages.com/blogtutor.jpg) no-repeat center top;
   }
   
7. Click Save Changes Template button.
8. Done.

For new Blogger template :

1. Login to blogger with your ID
2. click Layout.
3. Click Edit HTML tab.
4. backing up your template (very importat!).
5. Find these code below :
   #header{
   .........
   .........
   .........
   }
   
6. Insert your banner URL like this :
   
   #header{
   .........
   .........
   .........
   Background:url(http://kangrohman.googlepages.com/blogtutor.jpg) no-repeat center top;
   }
   
7. Click Save Template button.
8. Done.

Especially for new blogger, you can do some different trick.

1. Login to blogger with your ID.
2. Click Layout.
3. Click Page Element tab.
4. Click edit at Haeder Element, refer to picture below :
   
   
   
5. Check the radio button for From your computer, Click Browse.. button and then insert your banner file at your computer. Choose Behind title and description if you want your banner behind your blog title or Instead of title and description if your banner want at the front of your blog title.
   
   
   
6. Click Save button.
7. Done. Now you have a picture at your blog.