Recent Topics
  1. b2evolution CMS Support Forums
  2. b2evolution Support
  3. General Support
  4. [1.9.x] Replacing header image with .html URL?

[1.9.x] Replacing header image with .html URL?

1 Aug 17, 2007 00:12    

My b2evolution Version: 1.9.x

I am using a template that uses an image in the header. I wanted to replace this image with my own, so I created an image to replace it. Works fine. All I did was replace images/header-bg.jpg with my own. However, I wanted to add image maps that would link to other pages on my website.

So what I did is I created a header-bg.html, uploaded to the main directory (not images file) and changed the below code to header-bg.html. But when I do this, nothing shows in the header. Why is that, and anyone know how I fix it? Is there something else I should use instead of declaring "background"?

In the style.css file, there is the following code:

/* header area */
#header {
background: #FFFFFF url(images/header-bg.jpg) no-repeat;
height: 197px;
border-bottom: 1px solid #c3c1bf;
position: relative;
}
#headerimg {
position: relative;
padding: 30px 0px 0px 40px;
height: 60px;
}
#headerimg .description{
position: absolute;
left: 110px;
bottom: 3px;
color: #c9eefe;
font-size: 14px;
}

Back to top

2 Aug 17, 2007 01:10

Not exactly sure what you're trying to accomplish by linking your header to an html page.. that part of your post was kind of foggy... something about an image map? An image map is applied to a foreground image, not a background image. So you'd need to load your header image in the foreground (i.e. on the page itself) and not as a background via CSS...

As for the part about loading an html page in the css.. Are you saying you changed the following line to this:

background: #FFFFFF url(images/header-bg.html) no-repeat;

?

The reason it doesn't work is because you can't do that.
"background: url" loads a JPG, GIF, or PNG. Those are your choices.

http://w3schools.com/css/css_background.asp

jj.

Back to top

3 Aug 17, 2007 01:50

Thank you for the explaination – I did not realize that I could not reference the background to an .html. And I appreciate the css tutorial.

So let me clarify. What I am trying to do is replace the .jpg image in the template header with my own header, which is .html. I assume I could modify the header.php file, which has this code in the body??

<body>
<div id="page">
<div id="header">
<div id="headerimg">
<h1><a href="<?php echo get_settings('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
<div class="description"><?php bloginfo('description'); ?></div>
</div>
<ul id="nav">
<li class="page_item"><a href="<?php echo get_settings('home'); ?>/" title="Home">Home</a></li>
<?php _list_pages('sort_column=menu_order&depth=1&title_li=');?>
</ul>
</div>
<!--/header -->

If this is correct, what would I need to change?

Or is there another file I need to modify…

Back to top

4 Aug 17, 2007 03:01

Yes, you could change (or simply add into) the header DIV, wherein you could load an image and assign an image map to that image, if that's what you need to do...

jj.

Back to top

5 Aug 17, 2007 03:47

wonderful! Thanks jibberjab...

I'm sure that will do the trick.

Back to top


Form is loading...