> ## Documentation Index
> Fetch the complete documentation index at: https://dokumentation.websale.de/llms.txt
> Use this file to discover all available pages before exploring further.

# Displaying grouping products

> How to display a product assortment consisting of a non-orderable main product and several orderable sub-products in WEBSALE V8s.

A grouping product combines an assortment, for example a men's suit consisting of a jacket, shirt, trousers, and tie. The description and images are stored once on the assortment, while the parts are ordered individually.

## Structure

| Part | Role | Orderable |
| - | - | - |
| Main product | carries the description and images of the assortment | no |
| Sub-products | the individual articles of the assortment | yes |

Because the main product handles the presentation, the sub-products need neither a description nor images. The details that distinguish them from one another are sufficient:

* Product name, for example "Tie"
* Product number
* Price
* Variants, if any, for example size and color

## Where main and sub-products appear

Which of the two is visible depends on the template.

| Location | Display |
| - | - |
| Category view | only the main product, because the sub-products are usually not in any category |
| Single product view | main product and sub-products as a fixed unit |
| Basket | only the sub-products, without the main product |
| Search result | the found sub-product alone, without the main product |

The last two rows have two consequences for data maintenance and for the behavior in the shop.

If a thumbnail is to appear in the basket, it must be stored on the sub-product. The image of the main product is not available there.

If the buyer follows the link to a sub-product from the search result, they land on the main product with all sub-products. If, on the other hand, they click "change" in the basket, the main product appears only with the sub-product to be changed.

## Integration into the single product view

The display consists of two mutually exclusive areas. The [`ST-ParentProduct`](https://dokumentation.websale.de/en/v8s/referenz/tags/st/seitenzustand-und-navigation) bracket decides which of them applies.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
...
{!ST-ParentProduct}
   <!-- Daten des Produktsortiments, also des Hauptprodukts -->
{/!ST-ParentProduct}

{ST-ParentProduct}
   {CAT-AdvData($ChildProducts,99)}
      {@PR-Data}
         <!-- Daten des Unterprodukts -->
         ~PR-Name~
         ~PR-Number~
         ~PR-Price~ ~WS-Currency~
      {/@PR-Data}
   {/CAT-AdvData($ChildProducts,99)}
{/ST-ParentProduct}
...
```

Neither the quantity input field nor the order buttons appear in the main product area, because the main product itself cannot be ordered.

[`CAT-AdvData()`](https://dokumentation.websale.de/en/v8s/referenz/tags/cat/navigation-und-kategoriebaum) addresses the sub-products as a list via the pseudo category index `$ChildProducts`. The second argument limits the number, in the example to 99. The loop `{@[PR-Data](/en/v8s/referenz/tags/pr/grundlagen-und-produktdaten)}` iterates through the list.

Only valid sub-products are counted and output. An inactive or deleted sub-product does not appear in the list, without leaving a gap.

If there is no valid sub-product, the entire `CAT-AdvData` area is omitted. When a basket item is changed, the list contains exactly the one sub-product to be changed.

## Related topics

* Guide: [Displaying the selected product](https://dokumentation.websale.de/en/v8s/produkte/gewaehltes-produkt-anzeigen.md)
* Guide: [Set products, if the parts are to be ordered together as one article](https://dokumentation.websale.de/v8s/warenkorb/warenkorb-anzeigen-loeschen.md#set-produkte)


## Related topics

- [Displaying the selected product](https://dokumentation.websale.de/en/v8s/produkte/gewaehltes-produkt-anzeigen.md)
- [Displaying new products](https://dokumentation.websale.de/en/v8s/produkte/neue-produkte-anzeigen.md)
- [Displaying products on an alternative template](https://dokumentation.websale.de/en/v8s/produkte/produkte-auf-alternativem-template-anzeigen.md)
- [Displaying product properties as a list](https://dokumentation.websale.de/en/v8s/produkte/produkteigenschaften-als-liste-anzeigen.md)
- [Paging from product to product](https://dokumentation.websale.de/en/v8s/produkte/blaettern-von-produkt-zu-produkt.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.