I got a question, and this is kinda long. Please help if you know how to do this! Has anyone out there mastered the Custom Header for Blogger? I was looking at Lacourphoto.net and saw where Mark (I think it was Mark) posted how to do a custom header for blogger. Here is what the post looked like:
Wednesday, January 31, 2007
Adding a Custom Header in Blogger
With the new version of Blogger, I found that it was difficult to insert a custom header image. I searched around on the internet, but didn't find a satisfactory explanation. So I managed to figure out how to do it and thought I would share these easy steps for those of you who might be curious how to do this yourselves.
Step 1) Create a custom header image for your blog. Use Photoshop to create an image that is 650 pixels wide by 79 pixels high and upload it to your webserver. Below is the one I made for LaCour:
Step 2) Log in to Blogger.com and click the "Manage: Layout" button
Step 3) Then click on the "Edit HTML" button
Step 4) Scroll through the HTML and find the section that looks like the following (which is about 1/4 of the way down):
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
Now add in the following url, width and height tags so that it looks like this:
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
background-image: url('http://www.lacourphoto.net/images/bloghead.jpg');
width:650px;
height:79px;
}
Be sure to add the appropriate url for your banner image and make sure that your width and height numbers are correct for your image. *Note: If you want to remove the border, simply change the border to 0 in the "#header-wrapper" section just above this section.
Step 5) Scroll through the HTML and find the section that looks like the following (which is about 1/2 of the way down):
<h1 class='title'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<data:title/>
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</h1>
Now make it look like this:
<h1 class='title'>
<!-- <b:if cond='data:blog.url == data:blog.homepageUrl'>
<data:title/>
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if> -->
</h1>
Step 6) Click the 'Save Template Button' and your blog should now have a custom header.
I did everything exactly as they said but kept being told by blogger that you can't put the "--" in the comments part of the html (that is step 5). Does anyone know what to do?
Thanks for your time