8.14.2008

How do I adjust the border around my header?

You may have noticed that our blog templates come with the headers "sewn" into the script. If you choose to change the fonts and colors (see post below) the header border may shrink or become too long for the header itself. Since there is no way for us to manually fix all of our templates for everyone, we will teach you how to adjust your own.

1. Log into Blogger.
2. From your Dashboard, select Layout.
3. Select Edit HTML.
4. Scroll down the page slightly until you see the Edit Template box.
5. Scroll down the template box, searching through the crazy code until you see this section:

#header {
margin: 18px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;

The 18 is relative, it could be any number depending on what template you are using.

If there is blank space between the bottom of the header and the border, you will need to shrink the bottom border of your header, choose a smaller number, taking away 4-5 pixels or so, previewing and then adjusting up or down a few pixels as necessary.

If the border has cut off some of the bottom of the header, you can choose a slightly higher number adding 4-5 pixels, preview and adjust up or down a few pixels, until the border just hits the bottom of the header.

Following these steps, you can choose any font style and size on your header and still enjoy a nicely framed header border.

No comments: