That's excellent! Well just skip to the next step.
huntwriter said:
My problem is figuring out how plant the banner into the html of *blogger*.
So, first off, you need to put the banner online somewhere. Either your own web site works, or
www.photobucket.com .
Then you insert the link to the image into the blog style sheet:
- insertion possibility 1 puts the header in the background and the *blogger* title of your blog on top of it. The title is clickable and takes you back to the main page of the blog. That's how I have mine. To do this you insert it into the #header style
#header {
width:800px;
background:#666 url("http://www.website.com/image.jpg") no-repeat left top;
margin:0 auto 10px;
padding: 0; }
The "http://www.website.com/image.jpg" is the web location of your header image. Depending on what template you started with, other parts of the style might have to be adjusted.
- Alternatively, you can have the whole image clickable, like on Dawno's blog To do that, you need to scroll down through all of the style information to the section that begins . The default for your template probably looks like this:
<div id="header">
<h1 id="blog-title">
<ItemPage><a href="<$BlogURL$>"></ItemPage>
<$BlogTitle$>
<ItemPage></a></ItemPage>
</h1>
<p id="description"><$BlogDescription$></p>
</div>
That code puts the Blog Title and Description on top of the header -
whether there is an image there or not.
If you want a clickable image, ala Dawno, change the code to read:
<div id="header">
<a href="http://nameofyourblog.blogspot.com"><img src="http://www.website.com/image.jpg"></a>
</div>
"http://www.website.com/image.jpg" is the web location of your
image and "http://nameofyourblog.blogspot.com" is the URL of the main
page of your blog.
Again, you might have to change the other parts of the style sheet to
pretty it up, but the basic code above will work.
