Forums / Templates, Stylesheets, Page Layout / How do I add a second logo to the header?

How do I add a second logo to the header?

Locked

Views: 2,256

Results 1 to 8 of 8
This thread is locked. New replies are disabled.
10 Nov 2006, 12:16 AM
#1
gaukler avatar

gaukler

New Zenner

Join Date:
Nov 2006
Posts:
26
Plugin Contributions:
0

How do I add a second logo to the header?

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

10 Nov 2006, 9:18 PM
#2
usernameinuse avatar

usernameinuse

New Zenner

Join Date:
Nov 2006
Posts:
1
Plugin Contributions:
0

Re: How do I add a second logo to the header?

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>
10 Nov 2006, 10:04 PM
#3
gaukler avatar

gaukler

New Zenner

Join Date:
Nov 2006
Posts:
26
Plugin Contributions:
0

Re: How do I add a second logo to the header?

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

24 Nov 2006, 3:11 PM
#4
miles avatar

miles

Zen Follower

Join Date:
Oct 2006
Location:
At Home
Posts:
357
Plugin Contributions:
0

Re: How do I add a second logo to the header?

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:
```php
<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.

- Nothing is impossible. Some things are just less likely than others. -

24 Nov 2006, 3:46 PM
#5
clydejones avatar

clydejones

Deceased

Join Date:
Nov 2005
Location:
Colorado Springs, CO USA
Posts:
7,017
Plugin Contributions:
12

Re: How do I add a second logo to the header?

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

NOTE: We are sorry that Clyde is no longer with us.
We are grateful for all his contributions to the Zen Cart community.

25 Nov 2006, 3:51 AM
#6
miles avatar

miles

Zen Follower

Join Date:
Oct 2006
Location:
At Home
Posts:
357
Plugin Contributions:
0

Re: How do I add a second logo to the header?

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 72this 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 :
```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..

- Nothing is impossible. Some things are just less likely than others. -

25 Nov 2006, 4:02 AM
#7
clydejones avatar

clydejones

Deceased

Join Date:
Nov 2005
Location:
Colorado Springs, CO USA
Posts:
7,017
Plugin Contributions:
12

Re: How do I add a second logo to the header?

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

NOTE: We are sorry that Clyde is no longer with us.
We are grateful for all his contributions to the Zen Cart community.

25 Nov 2006, 4:22 AM
#8
miles avatar

miles

Zen Follower

Join Date:
Oct 2006
Location:
At Home
Posts:
357
Plugin Contributions:
0

Re: How do I add a second logo to the header?

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 :
```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. :wink2:

Thanx!

- Nothing is impossible. Some things are just less likely than others. -