This week I redesigned my website's header. My Goodness, it is a lot of work. In order to do that I have to study my website's CSS file, find all the images that are related to my template's header, download them using FTP to my laptop. Then I have to use a simple program, Paint, to redesign these images. Together I have to modify bannerbg.gif, bodybg.gif, logo.gif, and searchbg.gif. Basically I have to change colors for each of them, tried to find the right color to match some of the images, and finally upload them to my template's image folder. This processing has been tried for numerous ten times if it is not a hundred times. Whew! The old header looks like this before:
Now the new header looks like this:
Here is my website. What do you think?
Update: I've changed my website's template again. If you click on the above link, you'll see the new look and not the old one shown above any more.
Search
Custom Search
Showing posts with label Header Design. Show all posts
Showing posts with label Header Design. Show all posts
Saturday, July 5, 2008
Redesign My Website's Header
Posted by
Lana
at
6:23 PM
0
comments
Labels: Header Design, Joomla
Saturday, May 24, 2008
Interesting In Getting a Header Image for Your New Blogger?
I've just added a header image to this blog. What do you think? Adding an image to your header makes your blog quite unique than other people's blogs. So each blog should have its own uniqueness. It is one way that reflects a blogger's personality too. If you are interest in that, then follow the instructions below to get yours up.
- First you have to have your own image(s) ready either on your PC (personal computer) or on your free hosting website.
- Second login to your Google Blogger's Dashboard and click on Layout/Edit HTML/. See the screenshot below:

- Third find out your header image dimension by searching the following codes from your template editor:#header-wrapper {
width: 930px; //it only tells you the width here
margin:0 2% 10px;
border:1px solid $bordercolor;
}
You can hold Ctrl and hit F at the same time to bring up a search bar. Then copy and paste #header-wrapper { in the search box to find it.
- Once you found out your header image's width, you need to guess the header image's height; mostly its height is about 140 pixels.
- Next you need to customize your header image dimension. I use Microsoft Paint which came with my PC to Sketch/Srew the header image. You may use Photoshop if you know how.
- Then head back to your Blogger's Layout. Click on Edit in your header section. See the screenshot below:

- A new window will pop up. Type in your blog title, blog description, and browse your customized image here either from your PC or from the web. Choose your placement and make sure you click on Save Changes button to save it. See the screenshot below:

Now go ahead and check your blog to see how the header image turned out to be. Good luck! If you like this tutorial, then make sure you subscribe to it.
Related articles
Adding Graphic Background to Blog Header
Interested In How to Change Your Header Images?
How to Replace Your Header Image in WordPress.com Blog?
Related articles
Adding Graphic Background to Blog Header
Interested In How to Change Your Header Images?
How to Replace Your Header Image in WordPress.com Blog?
Posted by
Lana
at
7:50 AM
0
comments
Labels: Header Design, New Blogger
Subscribe to:
Posts (Atom)
Search
Custom Search
