View Single Post
  #14  
Old 11-14-2005, 11:57 AM
 
balinor balinor is offline
 

Veteran
  
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 

Default

Ok, here's what you need to do. Basically you need to insert two new table columns to the main layout, one on each side of the 'main' table cell. You are going to be editing rectangle_top.tpl and rectangle_bottom.tpl, both of which are in your root skin1/ directory. Make a backup of these files first in case this doesn't work!

First, in rectangle_top.tpl, add a new cell by replacing this:

Code:
<TD valign="top"><DIV style="position: absolute;" id="div_null"></DIV>

with this:

Code:
<td class="left" width="x">[img]{$ImagesDir}/spacer.gif[/img]</td> <TD valign="top"><DIV style="position: absolute;" id="div_null"></DIV>

Replace 'x' with the width you want for the border.

Next, open up rectangle_bottom.tpl and add a new right hand cell by replacing this:

Code:
</TD> </TR> {if $config.Adaptives.browser eq 'MSIE' || $config.Adaptives.browser eq ''} <TR><TD height="100%">[img]{$ImagesDir}/spacer.gif[/img]</TD></TR> {else} <TR><TD>[img]{$ImagesDir}/spacer.gif[/img]</TD></TR> {/if} <TR> <TD> {if $printable ne ''} <HR size="1"> {/if} { include file="bottom.tpl" } </TD></TR> </TABLE>

with this:

Code:
<table width="100%" cellpadding="0" cellspacing="0"><tr><td align="center">{ include file="bottom.tpl" } </TD></TR> </TABLE> </TD> <td class="right"><image src="{$ImagesDir}/spacer.gif" width="x"></td> </TR> </TABLE>

Again, replace "x" with the width you want for the border.

Now open up skin1.css and paste the following code in at the bottom:

Code:
.left {background: url(images/left-border.gif); background-repeat: repeat-y;} .right {background: url(images/right-border.gif); background-repeat: repeat-y;}

You'll need to name the images you want to use for the borders left-border.gif and right-border.gif (or just replace the code above with teh image names you want) and upload them to the skin1/images folder. They will tile vertically using the code above. If you don't want them to tile, just remove the background-repeat: y part.

Let me know if this works the way you want it to
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote