Prints a customizable list of product bundles that contain the product set in the scope.

Description

If the value <ProductBundles supported="false" /> has been set in theme settings, the {ProductShortDesc} tag will print the list of product bundles that include the product.

If theme settings contain the value <ProductBundles supported="true" />, {ProductShortDesc} won't print product bundles, and the listing will have to be added to the theme by using the {ProductBundles} tag.

If any of the products included in the product bundle is not visible in the version that the customer is visiting, the product bundle won't be displayed on the list at all.

Learn more about implementing product bundles in a theme.

Syntax

{ProductBundles(
    classes: string,
    type: string,
    helper: string
)}

Scope

Required scope: tuote

Scope in helper attribute: tuotepaketti

Including product bundles on product lists

By using the {ProductBundles} tag, you can print product bundles' details on product lists in a way so that next to each product the list will include details of all product bundles that the product belongs to.

<!-- Main product list -->
{Products(
    before: '<ul>',
    helper: 'helpers/list-product',
    after: '</ul>'
)}

<!-- helpers/list-product.html -->
<li>
    <a href="{ProductURL}">
        <h3>{ProductName}</h3>
        {ProductImage}
    </a>
    {ProductAddToCart}
    {ProductBundles(
        before: '
            <small><strong>The product belongs to the following product bundles:</strong></small>
            <ul>
        ',
        helper: 'helpers/product-bundle-list-item',
        after: '</ul>'
    )}
</li>

<!-- helpers/product-bundle-list-item.html -->
<li>
    <a href="{BundleURL}">
       <small>{BundleName}</small>
    </a>
</li>

The example's nested helper attributes wouldn't actually work; to work properly, they'd have to be placed in separate files.

Printing product details on a product bundle listing

In the example below, the product bundles including the products Amplifier, Guitar and 4x12 speaker will be printed as separate rows so that each row will display the product's and product bundles' names.

{Products(
    id: 1|2|3,
    helper: 'helpers/list-product',
)}

<!-- helpers/list-product.html -->
{ProductBundles(
    helper: {{
        {ProductName}: {BundleName}
    }}
)}

The example's nested helper attributes wouldn't actually work; to work properly, they'd have to be placed in separate files.

In such case, the following output would be produced:

Amplifier: Beginner Guitarist's Starter Pack
Amplifier: Noise Package
Guitar: Beginner Guitarist's Starter Pack
Guitar: Noise Package
4x12 Speaker: Noise Package

In the example, there are two product bundles in the online store with the following contents:

  • Beginner Guitarist's Starter Pack (Amplifier, Guitar)
  • Noise Package (Amplifier, Guitar, 4x12 Speaker)

Attribuutit

classes:

Class names that are given to every list element.

Class names are printed in the tag's helper attribute by using the {BundleClass} tag. If the tag hasn't been used, the class names won't appear on the list.

Allowed values: class names as strings.

Use space characters to separate the classes that are to be given to the same element. Use pipes to separate the classes that are to be given to different list elements.

E.g. classes:'ekaLuokka tokaLuokka | jokaToisenLuokka jokaToisenTokaLuokka'

type:

Defines the list's output format if no additional markup has been defined in the helper attribute.

Allowed values:

  • 'default': prints only the product bundles' names and links as a <ul> list
  • 'normal': prints the product bundle's name and image on the list
helper:

Defines the content and output format of a single list element.

Allowed values: the Interface and HTML markup that define the output's markup and content.

The helper attribute can be used in two ways:

  1. you can indicate the desired markup directly as the attribute's value, or
  2. you can indicate a reference to a file with the desired markup as the attribute's value.

    The reference should be indicated in relation to the theme's root directory.

See also detailed instructions on using the helper attribute.

after/before:

By using the after and before attributes you can define content that is output either after or before the tag's output.

Allowed values:The HTML and Interface markup

E.g.

  • before: '<p>Tämä merkkaus näkyy ennen tagin omaa sisältöä.</p>'
  • after: '<p>Tämä taas näkyy tagin oman sisällön jälkeen.</p>'

If the tag does not produce any content, neither the content of the after and before attributes will be output.

escape:

Adds an escape character before quotation marks in the output.

The attribute makes it easier to process the tag-produced content when using JavaScript.

Allowed values:true/false. The default value is false.

or:

Defines alternative content that is displayed if the tag itself does not produce any content.

Allowed values:The HTML and Interface markup

E.g. or:'Sisältöä ei löytynyt.'