Separating product families on a page

[skymill]

Is there any way to separate products on a page based on their "product family", which can be defined in a Product Field? For example for a Books page, I want to list Fiction, Non-Fiction, Self-Help, etc. I have created a custom product field with the Family in the field for each product.

It would look like:
***************************************
Fiction
****************
Book1, Book2, Book3
Book4, Book5, Book6

***************************************
Non-Fiction
****************
NFBook1, NFBook2, NFBook3
NFBook4

Self-Help
****************
SHBook1, SHBook2, SHBook3
SHBook4, SHBook5




Using the curved template, I thought I could test the [-- IF PRODUCT.Field1 "Fiction" --] when looping products but I cannot seem to use a Product tag on a page template.

So does anyone have any ideas how to do this?

I am using SS10 Pro. Thank you for any suggestions!

[ShopSite Lauren]

The only way I know how to do this is to loop the products on the page 3 times. This method isn't great for search engines (but it isn't horrible either) because it creates a lot of additional lines of code (mainly empty lines) and will take slightly longer to publish your website, however this method gets the job done. What you would do is loop the products in the template 3 times, each time calling a different product template.

[-- LOOP PRODUCTS --]
[-- PRODUCT Fiction --]
[-- END_LOOP PRODUCTS --]

[-- LOOP PRODUCTS --]
[-- PRODUCT Non-Fiction --]
[-- END_LOOP PRODUCTS --]

[-- LOOP PRODUCTS --]
[-- PRODUCT Self-Help --]
[-- END_LOOP PRODUCTS --]

Next, you would create three different product templates and name them exactly the same names as you have listed in the [-- PRODUCT --] tags (no spaces). So in my example above, the three product templates you would be creating would be named "Fiction" "Non-Fiction" and "Self-Help."

In all three templates you would setup your DEFINES for the DEFINE/END_DEFINE PRODUCT, DEFINE/END_DEFINE SUBPRODUCT, DEFINE/END_DEFINE CROSS_SELL_PRODUCT and DEFINE/END_DEFINE MORE_INFO_PAGE.

Last, within the DEFINE/END_DEFINE PRODUCT section, you would add an IF/END_IF statement around the whole thing. In the "Fiction" template, the IF/END_IF statement would look like this:

[-- IF PRODUCT.Field1 "Fiction" --]
here is the code for the product define
[-- END_IF --]

in the "Non-Fiction" template, the IF/END_IF statement around the contents of the product define would be:

[-- IF PRODUCT.Field1 "Non-Fiction" --]
here is the code for the product define
[-- END_IF --]

in the "Self-Help" template, the IF/END_IF statement around the contents of the product define would be:

[-- IF PRODUCT.Field1 "Self-Help" --]
here is the code for the product define
[-- END_IF --].

So an example of one of the product templates would be:
-------------------------------------------------------------------------------
[-- DEFINE SUBPRODUCT --]
code for the subproduct
[-- END_DEFINE SUBPRODUCT --]

[-- DEFINE PRODUCT --]
[-- IF PRODUCT.Field1 "Fiction" --]
code for the product
[-- END_IF --]
[-- END_DEFINE PRODUCT --]

[-- DEFINE MORE_INFO_PAGE --]
code for the more information page
[-- END_IF --]

[skymill]

Thank you so much Lauren for this suggestion. I had to solve the mismatch from my penchant to use .sst for templates and I have some table formatting to cleanup (see below) but this works great.

<table class="Products" width="100%" align="center" border="[-- VAR.border --]" cellpadding="3">
[-- LOOP PRODUCTS PAGE.Columns --]
<td valign="top" align="[-- VAR.align --]">[-- PRODUCT Fiction--]</td>
[-- END_LOOP PRODUCTS --]
</table>

<table class="Products" width="100%" align="center" border="[-- VAR.border --]" cellpadding="3">
[-- LOOP PRODUCTS PAGE.Columns --]
<td valign="top" align="[-- VAR.align --]">[-- PRODUCT Non-Fiction--]</td>
[-- END_LOOP PRODUCTS --]
</table>

<table class="Products" width="100%" align="center" border="[-- VAR.border --]" cellpadding="3">
[-- LOOP PRODUCTS PAGE.Columns --]
<td valign="top" align="[-- VAR.align --]">[-- PRODUCT Self-Help--]</td>
[-- END_LOOP PRODUCTS --]
</table>

[skymill]

To make this a little more robust, I thought I'd embed the categories in the page fields and then test to see if they are there. But I am having trouble using a [ -- PAGE.field --] as the template. I can't seem to embed a tag inside a tag.

Is there anyway to use the Page.Field as the template, like [-- PRODUCT Page.Field4 --]? Nothing I have tried including a VAR has worked.

Thank you again.


[-- IF PAGE.Field3 --]
<tr>
<td><H3>[-- PAGE.Field3 --]</H3></td>
</tr>
<table class="Products" width="100%" align="center" border="[-- VAR.border --]" cellpadding="3">
[-- LOOP PRODUCTS PAGE.Columns --]
<td valign="top" align="[-- VAR.align --]">[-- PRODUCT PAGE.Field3 --]</td>
[-- END_LOOP PRODUCTS --]
</table>
[-- END_IF --]

[skymill]

It may have been obvious but it appears that you can't use a Page.Field in a Product tag, so [-- PRODUCT Page.Field4 --] will not work. In addition, the multi-template technique LOOPS all products, but only displays the pertinent ones. This is fine, except if you want some custom formatting using tables, as it reserves extra cells for all products whether it displays them or not.

[ShopSite Lauren]

There is a way to get around the page field tags only in page templates. You can create a VAR tag. In the page template you could add [-- VAR.PageField4 PAGE.Field4 --]. Then in your product template you can use [-- VAR.PageField4 --] and it will grab the page field 4.

[skymill]

Thank you Lauren. I had tried using a VAR with no success. Sorry if I am missing something, but I tried embedding the tag, multiple variations of [-- PRODUCT VAR.PageField2 --], etc. I know the VAR is assigned correctly because I can print it fine. But I cannot seem to use it ...

[-- IF PAGE.Field2 --]
[-- VAR.PageField2 PAGE.Field2 --]
<tr>
<td><H3>[-- PAGE.Field2 --]</H3>
[-- VAR.PageField2 --]
[-- LOOP PRODUCTS PAGE.Columns --]
[-- PRODUCT VAR.PageField2 --]
[-- END_LOOP PRODUCTS --]
</td>
</tr>
[-- END_IF --]

[ShopSite Lauren]

How are you wanting to use it? If you just want to post the information in that field, then you would use [-- VAR.PageField4 --]. If you want to check what that field says and execute an action based on the text, for example, if the field say "Fiction" and only the fiction books will be displayed, then you could setup an IF/END_IF statement that uses [-- IF VAR.PageField4 "Fiction" --] [-- END_IF --]

[skymill]

Thank you again for your help. I need to use it to assign the correct template, so instead of using [-- PRODUCT Fiction --], I would use [-- PRODUCT VAR.PageField2 --]

[-- IF PAGE.Field2 --]
[-- VAR.PageField2 PAGE.Field2 --]
<tr>
<td><H3>[-- PAGE.Field2 --]</H3>
[-- LOOP PRODUCTS PAGE.Columns --]
[-- PRODUCT VAR.PageField2 --]
[-- END_LOOP PRODUCTS --]
</td>
</tr>
[-- END_IF --]

The reason is that I have to do 20+ of these and it would be much cleaner to use 1 page template and read the custom fields for each page where it is used. It will also make template maintenance less cumbersome.

[Jim]

Are you really going to have a different layout for the products that are Fiction vs the Non-Fiction, vs Self-Help?

Or is your intent to have all of the Fiction books in one section of the page, the non-fiction in another section, the self-help in another section?

If the product layout (i.e. name, image, author, description etc) for the various types of books is going to be the same, you don't need to change the template for each type of book. You just need to indicate the type of books in the section before the [-- Loop Product --] tag. This would be done by setting a VAR to Indicate the book type. Then in your product template check the product.field value to see if it matches the type of book that is to display in that section. If it matches then output the product information in the appropriate layout otherwise don't output anything and the loop will continue to the next product.

[skymill]

I still seem to have a couple of issues. One is more important than the other. Here is the most important.

1) Although nothing is output for products not in that section, a table cell is used for every product in the LOOP. So if I have 3 Fiction, 2 NF and 3 Self-Help, I get 8+ table cells in each section although the correct products are displayed in each section. The other cells of the table are empty. It looks convoluted. I have tried a dozen things to no avail so I am not sure how to get around that.

Here is the code I am using, customized for each section.

[-- IF PAGE.Field2 Fiction --]
# VAR Is not necessary but I am using it anyway
[-- VAR.Type1 PAGE.Field2 --]
<tr>
<P></P><H3>[-- VAR.Type1 --]</H3>
<td>
<table class="Products" width="100%" align="center" border="[-- VAR.border --]" cellpadding="3">
[-- LOOP PRODUCTS PAGE.Columns --]
<td valign="top" align="[-- VAR.align --]">[-- PRODUCT Fiction --]</td>
[-- END_LOOP PRODUCTS --]
</table>
[-- END_IF --]


#2) I have a few other types of products to sell. So other pages will have different productType1, productType2, etc. That is why I would like to read a variable from the page and assign it to the product type/template like [-- PRODUCT PAGE.Field3 --] or [-- PRODUCT VAR.Type --]. But this is less important right now.

[ShopSite Lauren]

For your first question, since you are not using all the products in each loop, only some, I would not suggest using the [-- LOOP PRODUCTS Page.Columns --] tag. Instead, I would suggest setting up your code like the following (this is in the page template).

[-- IF PAGE.Field2 --]
# VAR Is not necessary but I am using it anyway
[-- VAR.Type PAGE.Field2 --]
[-- VAR.ColumnCount "0" --]
<P></P><H3>[-- VAR.Type --]</H3>
<table class="Products" width="100%" align="center" border="[-- VAR.border --]" cellpadding="3">
<tr>
[-- LOOP PRODUCTS --]
[-- PRODUCT Generic-Category --]
[-- END_LOOP PRODUCTS --]
</tr>
</table>
[-- END_IF --]

then in your product template (and in this case you would only need one product template which I have named "Generic-Category"), you would setup your code similar to:
[-- DEFINE PRODUCT --]
[-- IF PRODUCT.Field1 VAR.Type --]
[-- VAR.ColumnCount INC --]
<td valign="top" align="[-- VAR.align --]">
[-- IF PRODUCT.Graphic --]
[-- IF PRODUCT.DisplayGraphic --]
[-- IF PRODUCT.DisplayMoreInformationPage --]
<a href="[-- PRODUCT.MoreInfoURL --]">[-- PRODUCT.Graphic --]</a><br>
[-- ELSE --]
[-- PRODUCT.Graphic --]<br>
[-- END_IF --]
[-- END_IF --]
[-- END_IF --]
[-- IF PRODUCT.DisplayName --]
[-- IF PRODUCT.DisplayMoreInformationPage --]
<a href="[-- PRODUCT.MoreInfoURL --]">[-- PRODUCT.Name --]</a>
[-- ELSE --]
[-- PRODUCT.Name --]
[-- END_IF --]
[-- END_IF --]
[-- IF PRODUCT.ProductDescription --]
<p>[-- PRODUCT.ProductDescription --]</p>
[-- END_IF --]
<form action="[-- SHOPPING_CART_URL BASE --]/order.cgi" method="post">
<input type="hidden" name="storeid" value="[-- STORE.ID --]">
<input type="hidden" name="dbname" value="products">
<input type="hidden" name="function" value="add">
<input type="hidden" name="itemnum" value="[-- PRODUCT.RecordNumber --]">
[-- STORE.OrderQuantity --] <input type="text" size="2" name="[-- PRODUCT.RecordNumber --]:qnty" value="1"><br>
[-- IF ADDIMAGE? --]
<input type="image" [--ADDIMAGE--]>
[-- ELSE --]
<input class="add" type="submit" value="[-- ADDTEXT --]">
[-- END_IF --]
</form>
</td>
[-- IF VAR.ColumnCount "3" --]
</tr>
<tr>
[-- VAR.ColumnCount "0" --]
[-- END_IF --]
[-- END_IF --]
[-- END_DEFINE PRODUCT --]

I have bolded and changed the font color of the important elements in both sections above. This will also address your second question.

[skymill]

This worked perfectly. Thank you so much for the help.