How do I add a second logo to the header?

[gaukler]

I have two logos that I'd like to have in the header. One is a jpg that I've managed to put in the right place (the image looks terrible in other formats), and the other is a transparent png of my business name in my favourite font. I'd like to replace the tag line with the png, centered or just to the right of my jpg logo. How should I code this?
I'm using the Bare Bones template, and am new to ZenCart. I've searched the fora, but haven't found a good answer. My test store is at http://medievalwares.com/zt . I'll worry about the position of the Home, Log In and Search links after the log problem is solved:)
gaukler

[usernameinuse]

see the second and third logo for new logos modif to your overriden header.php in languages english

// added defines for header alt and text
define('HEADER_ALT_TEXT', 'Powered by Natrol :: ShenMin');
define('HEADER_SALES_TEXT', '');
define('HEADER_LOGO_WIDTH', '85px');
define('HEADER_LOGO_HEIGHT', '60px');
define('HEADER_LOGO_IMAGE', 'shenmin_logo.gif');
//ADDED BYMICHAEL
define('SHENMIN_ALT_TEXT', 'Powered by Natrol :: ShenMin');

define('SHENMIN_LOGO_WIDTH', '267px');
define('SHENMIN_LOGO_HEIGHT', '60px');
define('SHENMIN_LOGO_IMAGE', 'shenmin_head.gif');

define('COM_LOGO_WIDTH', '101px');
define('COM_LOGO_HEIGHT', '60px');
define('COM_LOGO_IMAGE', 'com_head.gif');
// header Search Button/Box Search Button


modified 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>
<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'). '/' . SHENMIN_LOGO_IMAGE, SHENMIN_ALT_TEXT) . '</a>'; ?></div>
<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'). '/' . COM_LOGO_IMAGE, COM_ALT_TEXT) . '</a>'; ?></div>

[gaukler]

Thanks, usernameinuse, that worked perfectly. I could even follow what was going on:)
gaukler

[miles]

it's a very usefull tips. id tried this too. easy to understand. but im a lil bit confusing here on how to move the '2nd' image position. as the id seems to be the same. when i tried gave the '2nd img' id to 'logo2', the tagline moves under these logos which increase the header height.

here's the code for logo:

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

and this for the additional logo:

<div id="logo2"><?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'). '/' . FREE_LOGO_IMAGE, FREE_ALT_TEXT) . '</a>'; ?></div>

i hope someone can explain to me on how to create an 'id' for the 2nd img without effecting the header to change or whatsoever.

oh, one more thing. why the 2nd logo act's like the first logo? i mean, it's clickable and when i click on it, it direct me to mysite.com just exactly like the first logo. can it be change? thnx in advance.

[clydejones]

<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="logo"><?php echo zen_image($template->get_template_dir(SHENMIN_LOGO_IMAGE DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . SHENMIN_LOGO_IMAGE, SHENMIN_ALT_TEXT) ; ?></div>
<div id="logo"><?php echo zen_image($template->get_template_dir(COM_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . COM_LOGO_IMAGE, COM_ALT_TEXT) ; ?></div>

i hope someone can explain to me on how to create an 'id' for the 2nd img without effecting the header to change or whatsoever.

The red highlighted portions in the code will give you errors when you you try to validate your code.
ID's are single use declarations whereas CLASSES can be used multiple times.
They should use different names (#logo2, #logo3). You'll have to add this to your stylesheet.css:
#logo2, #logo3 {float: left}

oh, one more thing. why the 2nd logo act's like the first logo? i mean, it's clickable and when i click on it, it direct me to mysite.com just exactly like the first logo. can it be change?

Make the changes highlighted in green and that should take care of this problem.

[miles]

Thnx clyde for the response, unfortunately i got this error after made changes to my tpl_header.php

Parse error: syntax error, unexpected T_STRING in public_html/includes/templates/mytemplate/common/tpl_header.php on line 72

this is what i added to my header.php :

// added image for header
  define('FREE_ALT_TEXT', 'Free Shipping Image');
  define('FREE_LOGO_WIDTH', '168px');
  define('FREE_LOGO_HEIGHT', '65px');
  define('FREE_LOGO_IMAGE', 'header_bg.jpg'); 

and this in my 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>
    <div id="logo"><?php echo zen_image($template->get_template_dir(FREE_LOGO_IMAGE DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . FREE_LOGO_IMAGE, FREE_ALT_TEXT) ; ?></div>

is there something wrong? i dont know whats wrong with it..

[clydejones]

<div id="logo"><?php echo zen_image($template->get_template_dir(FREE_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . FREE_LOGO_IMAGE, FREE_ALT_TEXT) ; ?></div>

You missed a comma (see the highlighted portion.

[miles]

Thanx again clyde, i didnt noticed that comma as i just copied the code

(SHENMIN_LOGO_IMAGE DIR_WS_TEMPLATE, $current_page_base,'images'). 

anyway it's fixed. much appreciate. this the code i add into my tpl_header.php :

<div id="logo2"><?php echo zen_image($template->get_template_dir(FREE_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . FREE_LOGO_IMAGE, FREE_ALT_TEXT) ; ?></div>

and into my stylesheet.css :

#logo2 {float: left}

could be right..

just point it out. in case someone else have the same problem.

Thanx!