How do i put an image on the header?

I have been trying all day to put an image on the header of my site without success. here is a screen shot http://www.toyjoyshop.co.uk/Image-location.jpg.
i am using the lavender template.
Can somebody please explain in laymans terms how this can be done.

Thanking you in advance

Graphicman:

I have been trying all day to put an image on the header of my site without success. here is a screen shot http://www.toyjoyshop.co.uk/Image-location.jpg.
i am using the lavender template.
Can somebody please explain in laymans terms how this can be done.

Thanking you in advance

I'm still struggling with - please anybody

Post a url to this site so we can view what and where you are

Hi Kobra,
thanks for replyng, the site is https://www.toyjoyshop.co.uk. It is an adult toy site with just images of products nothing at all offensive. I've been trying for days now to put a free P&P image in the header, i see 100's of sites that have done this and didn't realise it would be so hard to do.

Thanks

I see that you have a logo image but what is a P&P image??

Post the image dimensions and a decsription of what it is and where you want it

kobra:

I see that you have a logo image but what is a P&P image??

Post the image dimensions and a decsription of what it is and where you want it

Sorry Kobra i should be more specific. I have attatched the image i want to place on the right hand side of the header, it is in addition to the logo on the left.

thanks

Kobra, the bottom line is he wants to add a second image to the header. He could add it to the background image, but it seems a second image shouldn't be that hard to do. I couldn't see how to accomplish it. :(

why not use the image as a background for the tagline div? may have to do some editing in the header file.

Thanks for the replies guys, i didn't realise it was such a big job i thought it would just be a bit of code with a link to the image. I never had a clue how to do it and now i Know why. Has anyone any idea please.

Thanks

While there are many ways to do this the following is one:
Edit a copy of your tpl_header.php file for your template and add the following div

<!--bof-header logo and navigation display-->
<?php
if (!isset($flag_disable_header) || !$flag_disable_header) {
?>

<div id="headerWrapper">
<!--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>
        <div id="logo2"><img src="url(../images/your_image.xxx" width="??" height="??")"></div>
        
    <div id="taglineWrapper">
<?php
              if (HEADER_SALES_TEXT != '') {
?>
      <div id="tagline"><?php echo HEADER_SALES_TEXT;?></div>

and to your stylesheet.css for your template add

#logo2 {
        float: right;
        }

This is the minium and if alignment is not correct the easiest is to match image heights of your logo.gif and the additional image in your graphics program.

Thanks kobra,

but unfortunatly this has not worked

This is the part of the style sheet has it is now

LABEL, h4.optionName {
line-height: 1.5em;
padding: 0.2em;
}
LABEL.checkboxLabel, LABEL.radioButtonLabel {
margin: 0.5em 0.3em;
}
#logo {
margin: 0em;
/* float: left; */
text-align: left;
padding-top: 0px;
}
#logo2 {
float: right;
}

.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {
float: left;
margin: 0em;
}
LABEL.inputLabel {
width: 11em;
float: left;
}

and this is the tpl_header.php

<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>

Could you not just edit the top image to include the other logo you're wanting to use? If you don't have tools to do this I don't mind to take care of it for you.

I would like to know how it is you've got the pop ups loading the way you do.

ThePatch:

Could you not just edit the top image to include the other logo you're wanting to use? If you don't have tools to do this I don't mind to take care of it for you.

I would like to know how it is you've got the pop ups loading the way you do.

Hi Patch

Thanks for the offer, can i get back to you on that. It may just be the solution. I would like to do it if possiable so it would not be to hard to change the banner at a later date and if we can manage to create the link from the header it would only be a matter of changing the image.

When you mean pop ups do you mean the image zoom. if so it is a contribution called Zen Lightbox by Alex Clarke. It can be found here.:smile:

Thanks a bunch for replying.

Thanks I appreciate it.

Just let me know what you had in mind in regards to the image. I'll try to help if I can.

I've downloaded the lightbox contrib. I'm going to see if it will work with version 1.3.7 here in a few. I've got several stores that would like this I think.

ThePatch:

Thanks I appreciate it.

Just let me know what you had in mind in regards to the image. I'll try to help if I can.

I've downloaded the lightbox contrib. I'm going to see if it will work with version 1.3.7 here in a few. I've got several stores that would like this I think.

No probs, it should work at treat, i'm using 1.3.7:D

Mark

well this works just fine.....oh and by the way pay attention to how I call the image in the html.....you used a call formated like it would be in css.....
This is the html source, you have to add the table tags in the right spot in the header.php file. You can move the style stuff to the stylesheet as you see fit.

<div id="logoWrapper">
    <table>
        <tr>
        <td>	
	<div id="logo">
	<a href="http://www.toyjoyshop.co.uk/"><img src="includes/templates/lavender/images/logo.gif" alt="Toy Joy" title=" Toy Joy " height="121" width="306"></a>
	</div>
	</td>
	<td width="600" align="right">
	<div id="logo2">
	<img src="../images/header_bg.gif" alt="" height="103" width="505">
	</div>
	</td>
	</tr>
	</table>

Yes I know there is a table in there but hey you use what works

you get this

barco57:

well this works just fine.....oh and by the way pay attention to how I call the image in the html.....you used a call formated like it would be in css.....
This is the html source, you have to add the table tags in the right spot in the header.php file. You can move the style stuff to the stylesheet as you see fit.

Hi barco57

thanks for taking the time to look into this for me and i'm nearly there, this is a before and after result attatched. how can i now make it as it looked originally but now with the banner.

Thank you in advance

Mark

I would need to see your header.php file to know for sure whats up with that