How to make logo background image?

[asterotech]

Hi there,

How can we make the logo on our website a background image and stretch it out a bit so it will go underneath the language and shopping cart signs at the top?

I want the logo to take up all that space.

 

Thanks.

 

www.asterotech.com

[Guest]

Hi there,

How can we make the logo on our website a background image and stretch it out a bit so it will go underneath the language and shopping cart signs at the top?

I want the logo to take up all that space.

 

Thanks.

 

www.asterotech.com

 

Maybe this won`t be the best way, but still....

 

I was thinking something like this:

 

put this to your CSS file:

 

#yourLogo {
z-index: -9999;
position:absolute;
left:50%;
width:753px;
margin-top:15px;
margin-left:-376px;
padding:0px;
}

 

adjust the margin for the top, to get the right postion: margin-top:15px;

 

Change your header image:

 

from this:

 

<a href="http://asterotech.com/store/index.php"><img src="images/logo.gif" border="0" alt="" width="350" height="150"></a>

 

 

to this:

 

<div id="yourLogo"><a href="http://asterotech.com/store/index.php"><img src="images/logo.gif" border="0" alt="" width="390" height="150"></a></div>

 

And the best thing will be - not to stretch the logo, but make the logo with width = 390 or whatever you need...

 

 

U can find this and make changes in:

 

cataloge/includes/header.php

 

change this:

<?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'images/logo.gif', STORE_NAME) . '</a>'; ?>

 

to this:

<?php echo '<div id="yourLogo"><a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'images/logo.gif', STORE_NAME) . '</a></div>'; ?>

[asterotech]

Thank you for the reply. I apologize I did not get to thanking you earlier as I do not recieve notifications when threads are replied to.

Thanks again for the help!

[npn2531]

Alternatively you could use the BODY tag in the stylesheet.

 

For example

 

BODY{
background-repeat: no-repeat;
background-position: 20px 20px;
background-image: url(images/my-image.gif)
}

 

would put the image on every page under everything, 20px from the top and 20px from the left. Note that you may have to add transparent backgrounds to whatever table with a white or colored background is on top of where you place it.