Adding a 3rd image to Header logos

[RobertG]

When I first changed the Header/logo of my web site I had all kinds of problem before finally getting it done with the help of several people on this forum. see site: www.TTE.CA

Now what I want to do is add a 3rd. jpg (which is the local tel. # and toll free number) in between both Logos. (the jpg is attached to this message.

I don't want to take a chance of damaging my existing site (everything seems to be working perfectly, which is why I am posting this request for help.

I beleive the files that I have to alter are the tpl_header.php file and the header.php file. what I need to know is where in the file that the new codes are added and the code description.
Any help would be greatly appreciated.

[FragaGeddon]

Just attach it to the first image. I can do it for you, just send me the 2 images.

[gjh42]

<!--bof-branding display-->
<div id="logoWrapper">
    <div id="logo" class="back"><a href="http://www.tte.ca/"><img src="includes/templates/Tte/images/tte_ca.jpg" alt="The Trailing Edge" title=" The Trailing Edge " width="316" height="138" /></a></div>
    <div class="forward"><a href="http://www.tte.ca/index.php?main_page=corporate_sales"><img src="includes/templates/Tte/images/brookecliff_technology_corporation.jpg" alt="Brookecliff Technology Corporation" title=" Brookecliff Technology Corporation " width="322" height="138" /></a></div>
    <div id="logoPhone">zen_image(DIR_WS_TEMPLATE_IMAGES . 'logophone.gif', 'Your alt text')</div>
    <br class="clearBoth" />
</div>
<!--<br class="clearBoth" /> -->
<!--eof-branding display-->

#logoPhone {margin: auto; width: 250px; text-align: center;}

<div id="logoPhone">zen_image(DIR_WS_TEMPLATE_IMAGES . 'logophone.gif', 'Your alt text')</div>


This div placed after the two floated ones will rise to the top between them, and the CSS will keep it in the center.

[shanesoine]

I was wondering if there is an idiots guide to getting this done. I assume I should be making changes here but not sure how to start.

/store/includes/templates/template_default/common/tpl_header.php

The most I achieve is a blank main page. I have put one large image in as an interim measure but would love to be able to put multiple images or 2 images and one text area into my header.
Thanks for the help

[gjh42]

The output snippet from the OP's tpl_header.php that I posted above is an example. Find that section in your copy of the file, and add divs as needed similar to the one I showed (it won't look exactly like what I posted, as all of the PHP has turned to HTML output).

There are other places in the file where you could add images, depending on exactly what results you want. We can't be more specific without seeing your site live, and a mockup of what you want.

[shanesoine]

Sorry not thinking, site is stripeyfrog . com and at the moment there is one image in the header I would like to make that 2 images the frog - float left and a changing promo image - float right with a text area - preferably 2 text areas in the centre. When I tried to position the current image in the centre it dropped down into the login area so I have put the header back in and would like to keep it there.
Thanks so much

[gourmet22]

Sounds like you know how to modify things so why not use a local copy of your site? By that I mean create a copy of your site on a local machine and use this as a test bed. It's standard practice in IT for years, what I do and it saves me messing up the production site. Just keep a note of every change you make (I use Notepad++ as a simple text editor). That way you can also go back if things get screwed up.

[RobertG]

<!--bof-branding display-->
<div id="logoWrapper">
    <div id="logo" class="back"><a href="http://www.tte.ca/"><img src="includes/templates/Tte/images/tte_ca.jpg" alt="The Trailing Edge" title=" The Trailing Edge " width="316" height="138" /></a></div>
    <div class="forward"><a href="http://www.tte.ca/index.php?main_page=corporate_sales"><img src="includes/templates/Tte/images/brookecliff_technology_corporation.jpg" alt="Brookecliff Technology Corporation" title=" Brookecliff Technology Corporation " width="322" height="138" /></a></div>
    <div id="logoPhone">zen_image(DIR_WS_TEMPLATE_IMAGES . 'logophone.gif', 'Your alt text')</div>
    <br class="clearBoth" />
</div>
<!--<br class="clearBoth" /> -->
<!--eof-branding display-->

#logoPhone {margin: auto; width: 250px; text-align: center;}

<div id="logoPhone">zen_image(DIR_WS_TEMPLATE_IMAGES . 'logophone.gif', 'Your alt text')</div>


This div placed after the two floated ones will rise to the top between them, and the CSS will keep it in the center.

gjh42-Do i have to alter the header.php file located in the includes/languages/english/Tte/header.php. Also the #logophone does that go into the stylesheet? Lastly the alt text should consist of what the url of the image?
Thanks for your help

[gjh42]

If you are changing the logo file or size (things that appear in header.php), you should edit that file. A new div does not have to have any mention there.
#logophone {... is a stylesheet rule.
Alt text is intended as a short description of what the image is about, for those who can't see it (like blind visitors). You might say in this case "Call us at 000-000-0000" since that is useful information here.