Fragments in various layouts

[Sutty]

I want to layout fragments on the home page in a range of different ways, (view Jpg attached) to create the basis of my shop window.

Is it possible to layout fragments in both rows and columns on the same page?

If not, how do other people get round this?

Mike

[Bruce]

Hi Sutty,

This has been covered in the Advanced Users Guide page 19

Laying Out Your Brochure Fragments In Columns
This section of the guide will show you how to lay out your brochure fragments out in columns within your brochure pages. Note that the new brochure fragment template you create below can be used for fragments within section pages, as long as you make the changes described in the section above on ‘Laying Out Your Products In Multiple Columns’.
First, locate the following code in Act_BrochurePrimary.html:

<table width="CUSTOMVAR:ACTSTDWIDTH" cellpadding="5" cellspacing="0" border="0" cols="3">
NETQUOTEVAR:BROCHUREBODY
</table>

Change it to read...

<script language=JavaScript>
<!--
var currentcol = 0;
var colwidth = Math.floor(100 / CUSTOMVAR:NUMCOLS);
// -->
</script>

<table width="CUSTOMVAR:ACTSTDWIDTH" cellpadding="5" cellspacing="0" border="0" cols="3">

NETQUOTEVAR:BROCHUREBODY

<script language=JavaScript>
<!--
if ( currentcol != 0 )
{
while ( currentcol++ < CUSTOMVAR:NUMCOLS ) document.write('<td width="' + colwidth + '%">&nbsp;</td>');
document.write('</tr></table></td></tr>');
currentcol = 0;
}
// -->
</script>

</table>

Then edit the code of your chosen fragment layout template and replace it with:

<script language=JavaScript>
<!--
if ( currentcol++ == 0 ) document.write('<tr><td colspan=3><table border=0><tr>');
document.write('<td width="' + colwidth + '%" valign=top>');
// -->
</script>

<noscript><tr><td width="100%"></noscript>

NETQUOTEVAR:FRAGMENTANCHOR
<table border="0" width="100%" cellpadding="5" cellspacing="1">
<tr>
<td valign="top" align="left">NETQUOTEVAR:BROCHURE_IMAGE</td>
</tr>
<tr>
<td valign="top">
<strong>NETQUOTEVAR:BROCHURE_TITLE</strong><br><br>
NETQUOTEVAR:BROCHURE_TEXT</td>
</tr>
</table>

</td>

<script language=JavaScript>
<!--
if ( currentcol >= CUSTOMVAR:NUMCOLS )
{
document.write('</tr></table></td></tr>');
currentcol = 0;
}
// -->
</script>

<noscript></tr></noscript>

Finally, go to 'Advanced | Custom Properties' and create a new custom property called 'NUMCOLS'.
Then go to 'Design | Options | Site Defaults' and add 'NUMCOLS' to the grid (selecting 'Use as CUSTOMVAR' if the option is given). Set the value to however many columns you want your fragments laid out in.

Kind regards,