Images Again!!
 

Ok getting a little better at this but...want to replace the rectangular area at the top of page next to logo.I beleive it's the top1.gif skin1/images and where a banner goes... but in propertis says this tp1.gif is 48x60 pix and the area is way larger than that.Can't find any gif that matches this area so where do I take care of this...Thanks

OK back to edit:I found this head.tpl and think this is the place to make changes. When it says repeat:repeat-x"> dose that mean top1.gif will fill the area even though the gif is only 60px wide. If I make my image the same size (48x60) and overwrite the top1.give will that do the trick.

{* $Id: head.tpl,v 1.28 2003/04/24 09:50:33 svowl Exp $ *}
<TABLE align=center border=0 cellPadding=0 cellSpacing=0 class=HeadBox width=100%>
<TR>
<TD valign="top" width="284">[img]{$ImagesDir}/logo.gif[/img]</TD>
<TD background="{$ImagesDir}/top1.gif" align=right valign=middle>
{if $main eq "catalog" and $current_category.category eq "" and $all_languages_numba gt 1}
<FORM action="home.php" method=GET name=sl_form>
<SELECT name=sl onChange="javascript: document.sl_form.submit()">
{section name=ai loop=$all_languages}
<OPTION value="{$all_languages[ai].code}"{if $store_language eq $all_languages[ai].code} selected{/if}>{$all_languages[ai].language}</OPTION>
{/section}
</SELECT>
</FORM>
{elseif ($usertype eq "P" or $usertype eq "A") and $login}
<table border=0 cellpadding=0 cellspacing=0>
<FORM action="{$smarty.server.REQUEST_URI}" method=POST name=asl_form>
<tr>
<td>Current language:</td>
<td>
<INPUT type=hidden name="redirect" value="{$smarty.server.QUERY_STRING}">
<SELECT name=asl onChange="javascript: document.asl_form.submit()">
{section name=ai loop=$all_languages}
<OPTION value="{$all_languages[ai].code}"{if $current_language eq $all_languages[ai].code} selected{/if}>{$all_languages[ai].language}</OPTION>
{/section}
</SELECT>
</td></tr>
</FORM>
</table>
{else}

{/if}
</TD>
</TR>
<TR>
<TD>
{if $usertype eq "C"}
{ include file="customer/search.tpl" }
{else}

{/if}
</TD>
<TD width=99% valign=top class=HeadBox background="{$ImagesDir}/top2.gif" style="background-repeat: repeat-x">



<P align=right><SPAN class=NumberOfArticles>{insert name="productsonline"} {$lng.lbl_products} {if $config.Appearance.show_in_stock eq "Y"}{$lng.lbl_and} {insert name="itemsonline"} {$lng.lbl_items} {/if}{$lng.lbl_online}</SPAN></P>
</TD>
</TR>
</TABLE>

Top1.gif is set as a background for that cell.

It will tile to fill the whole area. That is why the design is vertically symmetrical.

<TD background="{$ImagesDir}/top1.gif" align=right valign=middle>

If you make a like sized image it will also tile it, so be sure to keep your image able to be "joined at the butts".

If you make a particular sized image that is also fine (be sure to change the width and height properties in the tpl) however you will lose some of your aesthetic appeal when users with different browser resolutions visit your site.

Good Luck!

:)

Ok adpboss... Is that what the repeat:repeat-x">refers to?
Just wondering how it knows how much to tile because I have not seen any definate size in the tpl...Thanks

repeat x just mean that it will repeat the graphic along the x axis ie left to right for as long as it needs to be.

This way you can stretch the windows width and the header stays looking right