Thursday, August 30, 2012

Installing a Header in Blogger

Good morning, my little lemon drops!  I hope you had fun experimenting with all kinds of wonderful fonts and brushes yesterday, because today I'm going to show you how to upload your very own header onto your very own blog.

First, you're going to want to open Blogger, and go to the "Design" page.  It should open up this interface:


The very top box should have your blog title with (Header) right next to it.  Click "Edit."


A box like this should pop up.  Make sure your "Blog Description" box is empty.  Where there's a picture of my header, on your blog will be an option to upload an image.  Upload your header, and make sure the "Instead of title and description" option is checked.

Make sure to save!

Now, in order to make sure your blog lines up, go to "Template Designer," and then "Adjust Widths" make sure the width of your entire blog is the same width as your header image.

Save!

Now view your blog.  Your header may or may not be perfectly lined up.  If it's not, go back to the Design Page, go back to "Template Designer," and click "Advanced."  Scroll down to "Add CSS."  There should be an empty box.

Copy the following code (minus the */) and paste it into the box:
*/.header-outer {
margin-left:0px;
}*/

If you increase the margin-left from 0px to say, 40px and save, you'll notice your header image has jumped to the right.  Just play around (I usually increase/decrease in intervals of 10px) with the value until your header lines up with your blog.

And always, always, ALWAYS remember to save after everything you do!

No comments:

Post a Comment