ShopSite Forums

Hi: I have a serious problem with looping cross-sell products.
The looping goes on under the "You may also enjoy" section.

Sometimes it looks like I intended, with 2-3 products (sometimes 4, actually) running across the page like this:
http://stellaandjames.com/store/NK0001AQU_Sterling_Silver_&_Aquamarine_Pear-Shaped_Swarovski_Crystal_Necklace.html


Other times it looks like this:
http://stellaandjames.com/store/NK2042_Sterling_Silver_Organic_Circle_&_Oval_Necklace.html

OUCH! Painful to look at. Notice how the one product under the first version of "you may also enjoy" is centered, and then the "You may also..." repeats over and over with another product or two....PLUS, the footer repeats over and over and that has nothing to do with the looping code.

Both of these products have the same product and page templates and as far as I can tell are set up identically in Shopsite.

HELP!

Thanks,

Vernon

Forgot to provide the code for the product template looping cross sell products:

############################################ Cross Sell ###################
[-- DEFINE PRODUCT_CROSS_SELL --]
<div class="main_more-info_product_box" id=".main_more_info-product_box">

<div class="more_info_prod_photo" id=".more_info_prod_photo">[-- IF PRODUCT.Graphic --][-- IF PRODUCT.DisplayMoreInformationPage --]<a href="[-- PRODUCT.MoreInfoURL --]">[-- PRODUCT.Graphic --]</a>[-- ELSE --][-- PRODUCT.Graphic --][-- END_IF --][-- END_IF --]</div>

<div class="more_info_prod_name" id=".more_info_prod_name">[-- IF PRODUCT.DisplayName --][-- IF PRODUCT.DisplayName --]<a href="[-- PRODUCT.MoreInfoURL --]" class="product_name_cross_sell">[-- PRODUCT.Name --]</a>[-- END_IF --]</div>


<div class="more_info_product_price" id="more_info_product_price">[-- IF PRODUCT.DisplayPrice --][-- IF PRODUCT.SaleAmount --][-- PRODUCT.SaleAmount --]
[-- ELSE --][-- PRODUCT.Price --][--IF PRODUCT.AltPrice--][-- PRODUCT.AltPrice --][-- END_IF --]</div>
</div>[-- END_DEFINE PRODUCT_CROSS_SELL --]




Then the actual looping code is this (actually the following code goes right to the end of the template html):
<td><table width="702" style="border-collapse: collapse"border="0" cellspacing="0" cellpadding="0">[-- IF PRODUCT.CrossSell "0" --]
#do nothing
[-- ELSE --][-- LOOP PRODUCT_CROSS_SELL --]
<tr>
<th width="233" style="border-collapse: collapse" border="0"align="center" valign="top" scope="col">[-- PRODUCT_CROSS_SELL --]</th>
<th width="233" style="border-collapse: collapse" border="0"align="center" valign="top" scope="col">[-- PRODUCT_CROSS_SELL --]</th>
<th width="233" style="border-collapse: collapse" border="0"align="center" valign="top" scope="col">[-- PRODUCT_CROSS_SELL --]</th>
</tr>[-- END_LOOP PRODUCT_CROSS_SELL --][-- END_IF --]
</table></td>
</tr>
<tr>
<td><div class="cross-sell-spacer" id=".cross-sell-spacer"></div><div align="center">[-- INCLUDE Stella-James-Footer PROCESS --]</div></td>
</tr>
</table></th>
</tr>
</table></td>
</tr>
</table></th>
</tr>
</table>
</body>
</html>
[-- END_DEFINE MORE_INFO_PAGE --]

This is incorrect code.

Code: Select all

[-- LOOP PRODUCT_CROSS_SELL --]
<tr>
<th width="233" style="border-collapse: collapse" border="0"align="center" valign="top" scope="col">[-- PRODUCT_CROSS_SELL --]</th>
<th width="233" style="border-collapse: collapse" border="0"align="center" valign="top" scope="col">[-- PRODUCT_CROSS_SELL --]</th>
<th width="233" style="border-collapse: collapse" border="0"align="center" valign="top" scope="col">[-- PRODUCT_CROSS_SELL --]</th>
</tr>[-- END_LOOP PRODUCT_CROSS_SELL --]

The way any Loop tag functions is it puts out the code between the starting Loop tag and the End_loop tag as many times as there are items that fit that category. If you have 2 cross sell items with the above code you should see each item 3 times, If you have 4 cross sell items you would see each of the 4 3 times. The code should be

Code: Select all

[-- LOOP PRODUCT_CROSS_SELL --]
<tr>
<th width="233" style="border-collapse: collapse" border="0"align="center" valign="top" scope="col">[-- PRODUCT_CROSS_SELL --]</th>
[-- END_LOOP PRODUCT_CROSS_SELL --]

With only one [-- PRODUCT_CROSS_SELL --] between the beginning and ending LOOP tags.

Any formatting that you need to do may need to be done in the in the section of the template that specifies the layout of each cross-sell item. Generally the Loop outputs a <tr> at the beginning of the loop and a closing </tr> at the end of the loop. If you want 3 columns for the cross-sell items you need to have the opening loop tag like [-- LOOP PRODUCT_CROSS_SELL 3 --] so the loop will occur 3 times once for each product and a <tr> will be output before the 3 products and a closing </tr> will be output after the 3 products. If you have 6 cross sell it would output
<tr>product product product </tr><tr>product product product </tr> It would be up to you to actually format what the "product" part would look like including any opening and closing <div> or <td> tags. and you also need to output the opening and closing <table> tags before the loop starts and close it after it is finished.

Thanks Jim, Very helpful.

So it looks like it would not be that hard to change this. And in fact, I had already suspected that I shouldn't have it set up like it was with 3 areas for looping products going across the page. But for looping products, then, how do i get them to go 3 across and then possibly return for a forth?

Thanks,

Vernon