Product Listing

    Overview

    When to use

    The product listing is used to list products in a responsive grid view, so each element in a row has the same height. The product listing can be complemented by multiple insertion patterns or a promotional teaser element. This can be used to enrich the listed products through additional information regarding their usage.

    When to consider an alternative

    If the desired listing does not contain multiple products, but the elements should be presented grid-like, use the element listing.


    Component

    Default

    1024px
    375px768px1400px

    Examples

    Add .snx-product-listing__content-element as utilClassNames for Promo Teaser or Insertion.

    1024px
    375px768px1400px

    Product-listing categories

    1024px
    375px768px1400px

    Properties

    PropertyTypeRequiredDefault
    childrenNodefalse-
    categoriesBoolfalse-