Want to add html to tpl_header.php

Hi, I have a piece of html that needs to be my header (it has hotspots, made in Fireworks). I have it in the correct place (you can see that it is a broken link at http://www.diginirvana.com/zen_cart/store.

I think maybe I need to put something before and after it because I just inserted it. The images are all in the right places. What am I doing wrong?

You can see what the image is suppose to look like (and how the links work) at:http://www.diginirvana.com

Here is the piece of html I have:
<img name="diginirvanaheader" src="file:///public_html/zen_cart/store/includes/template/magic/images/diginirvanaheader.gif" width="800" height="200" border="0" usemap="#m_diginirvanaheader" alt="">
<map name="m_diginirvanaheader">
<area shape="rect" coords="668,130,779,200" href="http://www.diginirvana.com/zen_cart/store/index.php?main_page=contact_us" alt="" >
<area shape="rect" coords="620,131,668,200" href="http://www.diginirvana.com/faq.htm" alt="" >
<area shape="rect" coords="511,131,619,200" href="http://www.diginirvana.com/newsletter.htm" alt="" >
<area shape="rect" coords="397,130,510,200" href="http://www.diginirvana.com/zen_cart/store/index.php?main_page=login" alt="" >
<area shape="rect" coords="315,130,395,200" href="http://www.diginirvana.com/gallery/" alt="" >
<area shape="rect" coords="255,129,314,200" href="http://www.digi-nirvana.blogspot.com" target="_blank" alt="" >
<area shape="rect" coords="184,127,255,199" href="http://www.diginirvana.com/about.htm" alt="" >
<area shape="rect" coords="123,127,184,199" href="http://diginirvana.com/zen_cart/store" alt="" >
<area shape="rect" coords="0,127,122,199" href="http://www.diginirvana.com" alt="" >
</map>

Thanks so much!

Here is an older way of doing this and your should be similiar in structure where your code should replace what I have in red. Added the navHead div inside logoWrapper

<!--bof-branding display-->
<div id="logoWrapper">
    <div id="logo"><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?></div>

	<!-- begin top navigation -->
	<div id="navHead">
	<img src="includes/templates/test/images/spacer.gif" width="235" height="44" border="0" /></a>
<a href="index.php?main_page=XXXXX"><img src="includes/templates/test/images/spacer.gif" alt="XXXX" width="120" height="44" border="0" /></a>
<a href="index.php?main_page=XXXXXX"><img src="includes/templates/test/images/spacer.gif" alt="XXXXXX" width="125" height="44" border="0" /></a>
<a href="index.php?main_page=index&cPath=5"><img src="includes/templates/test/images/spacer.gif" alt="XXXXXXXX" width="125" height="44" border="0" /></a>
<a href="index.php?main_page=about_us"><img src="includes/templates/test/images/spacer.gif" alt="About Us" width="120" height="44" border="0" /></a>
	<!-- end top nav --></div>
    </div> 

But you might look at ezpages and the header location to make this easier

Thanks. I think this was a good idea. I added this to my tpl_header.php. I also added this to the css:

#navhead {
background-image: url(../images/diginirvanaheader.gif);
background-repeat: repeat-x;
background-color: #ffffff;
height: 200px;
}

However, the image is still not coming up. You can see it at:
http://diginirvana.com/zen_cart/store.

What am I doing wrong?

Here's the html:

<!--bof-branding display--> <div id="logoWrapper"> <div id="logo"><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?>

 <!-- begin top navigation -->
<div id="navHead">
 <img name="diginirvanaheader" src="file://url...images/diginirvanaheader.gif" width="800" height="200" border="0" usemap="#m_diginirvanaheader" alt="">

<map name="m_diginirvanaheader"> <area shape="rect" coords="668,130,779,200" href="http://www.diginirvana.com/zen_cart/store/index.php?main_page=contact_us" alt="" > <area shape="rect" coords="620,131,668,200" href="http://www.diginirvana.com/faq.htm" alt="" > <area shape="rect" coords="511,131,619,200" href="http://www.diginirvana.com/newsletter.htm" alt="" > <area shape="rect" coords="397,130,510,200" href="http://www.diginirvana.com/zen_cart/store/index.php?main_page=login" alt="" > <area shape="rect" coords="315,130,395,200" href="http://www.diginirvana.com/gallery/" alt="" > <area shape="rect" coords="255,129,314,200" href="http://www.digi-nirvana.blogspot.com" target="_blank" alt="" > <area shape="rect" coords="184,127,255,199" href="http://www.diginirvana.com/about.htm" alt="" > <area shape="rect" coords="123,127,184,199" href="http://diginirvana.com/zen_cart/store" alt="" > <area shape="rect" coords="0,127,122,199" href="http://www.diginirvana.com" alt="" > </map> <!-- end top nav --></div> </div>

You have this:

<img name="diginirvanaheader" src="file://url...images/diginirvanaheader.gif"

Try this making sure that your image is in your template/images folder:

img src="includes/templates/your_template/images/diginirvanaheader.gif"

Thank you so much!!!!!!! That worked perfectly! I appreciate it so much! The only thing left wrong with it is there is now a big space between the header and the top nav wrapper. Not sure how to fix that. I will keep messing around but I'm afraid to move the logo. Perhaps this is a CSS problem. If you have any suggestions, I'd love to hear them!

Thanks again!

Start checking your code - you open this with <img but there is no closing tag at the end you only have > and should have />

Then look at original code and yours as it looks like you have closed a bit soon but cant be sure from parsed source

Thanks! Will do!!