Skip to main content
All CollectionsProducts
Product expressions
Product expressions

Smart product expressions for catalogs, templates and layouts

Updated over 2 years ago

Catalog Machine provides expressions for iterating and formatting your product data that you can use in your layouts, templates, and catalog pages.

Read more and see practical examples in how to customize product and price layouts.

Expression groups

  1. Catalog

  2. Products

  3. Categories / Collections

  4. Variants

  5. Images

  6. Condition operators

  7. Sort, limit and unique operators

  8. Conditional text (If..Else...)

  9. Parameters

  10. Expressions in HTML

  11. PDF page break

  12. Special expressions

Note: All expressions are enclosed in double brackets – {{…}} ( e.g. {{Price}})- pay attention not to break them by formatting text!

1. Catalog expressions

Most of these expressions can be used inside a catalog page. templates, header or footer

  • {{Current Date}} - current timestamp on the server (UTC time)
    Use custom formatting, e.g. {{Current Date:MMMM dd, yyyy}}, where
    MM, MMM, MMMM - month (digits, short, full), d, dd, ddd, dddd (day, week), yy, yyyy - year

  • {{Section Name}} - defined in Table of Contents  setting

  • {{Page Number}} - a current catalog page number

Flags for a product price list  (or variant, categories, collection lists)

  • {{AltRow}} - even row flag

  • {{IsFirst}}, {{IsLast}} - first or last elements flag

  • {{IsPDF}} - displays in PDF

{{If IsPDF}}PDF{{Else}}Online{{/If}}

<div style="background-color:{{If AltRow}}#54acd2{{Else}}#ffffff{{/If}};">
...
</div>

Any text expression can use character limit. For example

  • {{Description:50}} or {{Name: 20}} that will produce text my description... if it exceeds the limit

Barcodes

  • Use {{BarcodeImage}} or {{BarcodeImageExt}} to display a barcode image, if the field name is different (e.g. MyField) use {{BarcodeImage:MyField}} or {{BarcodeImageExt:MyField}}

  • BarcodeImageExt - display image with a code text below

  • You can use barcode image with a code directly {{BarcodeImageExt:89567894}}

2. Products

Products have built-in fields (e.g. Name, Code, etc.) and custom fields defined by you on the category level (e.g. Price, Image, Retail Price, Shop Link, etc.).

Usage: These fields could be used in product text box or inside product iterator.
Example :
{{Name}} {{Description}}
{{Products}} {{Name}} - {{Price}} {{/Products}}

Product built-in  and standard fields:

  • Code

  • Name

  • Category

  • Rank – also used in showroom for ordering

  • Modified – date product last modified

  • VariantCount – number of product variants

  • Image

  • Description

  • Price

  • Category and collection fields - Category.Name, Collection.Description, etc. (see the following section)

Product prices: {{Price:#,###.00}}, {{Calc: Price * 1.13 - Discount}}
You can display price fields (with type Money or Number) with custom formatting and calculation based on other fields. Read more about displaying product prices.

Examples:
{{Price:#,###.00}} displays 1,200.50 for price field 1200.5
{{Sale Price:#}} displays number without fractions 10 for Sales Price field 10.99
{{MSRP: C #.###,00}} displays € 1,200,50 for MSRP field €1200.5, but 1,200,50 if no currency in the field.
{{Calc: 2 + 2}} displays 4
{{Calc: Price * 1.13: #.00}} displays 11.30 for Price field 10
{{Calc: Price * (100 - Discount) / 100: #,###}} displays 8 for fields Price = 10 and Discount = 15

Use parameters for shared values like currency rates or discounts

${{Calc: Price * USD Rate: #.00}}

Link: {{Link: Address Field or address : Field or custom text}} 

You can display a link to any web page based on your product fields. Read more about displaying a link to the external web page.

Examples
{{Link:Store Link:Name}}  will display a link with the address from Store Link field and and link text from product Name field.
{{Link:My Link}} displays a link with the address from My Link product field using the address a link text
{{Link:Site Link:Click here}} displays a link with address from Site Link product field with custom text 'Click here'.
{{Link:www.google.com:Google}} - displays a link to www.google.com with a text 'Google'

Product iterator: {{Products:condition operators}}content…{{/Products}}

Example:
{{Products: Category = Shoes : Price > 0 : Order By > Code }}
{{Name}} - {{Description}} - ${{Price}}
{{/Products}} 

You can use individual iterators {{Product1}} and {{Products2}} to create cross tables. The product iterator should have the prefix Product1. (or Product2.)

Example:

{{Products1: Product1.Category=Feature}}
{{Product1.Image:Fit:40:40}}{{Product1.Name}}
{{/Products1}}

3. Categories / Collection

Usage: Category and collection fields can be used inside category iterator or  product text

Category / Collection fields:

  • Name

  • FullName – includes parent name if exists

  • Description

  • Color

  • Parent –  parent collection  / category

  • ProductCount – number of products in this category

  • FullProductCount – number of products in this and child category

  • Thumbnail – category thumbnail image

Product text box

{{Category.Name}} same as {{Category}}
{{Collection.Description}}

Category iterator: {{Categories:condition operators}}content…{{/Categories}}

Examples:
{{Categories: ProductCount > 0}}
{{Thumbnail:Fit:50:50}}  {{Name}} ({{ProductCount}}) {{Description}}
{{/Categories}}

{{Categories: Parent = Clothing}}{{Name}}{{Products}}{{Name}} - ${{Price}}{{/Products}}{{/Categories}}

4. Variants

Variants have built-in fields and configured on category level options (e.g. Color, Size). You can reference options by name or index – Color or Option:1 (same as Option), Size or Option:2.
Use Option:1:Title for the name of the first option 

Usage: These fields could be used only inside the variant iterator.
Example : 

{{Variants}} {{SKU}} {{Option:1}} / {{Option:2}} - {{Price}} {{/Variants}}
{{Variants}} {{SKU}} {{Color}}/{{Size}} - {{Price}} {{/Variants}}
{{Variants}} {{SKU}} {{Option:1:Title}} : {{Option:1}} {{/Variants}}

Variant fields:

  • SKU

  • Price

  • Description

  • Image

  • Description

  • Price

  • Barcode

  • BarcodeImage or BarcodeImageExt - a barcode image based on Barcode field

  • Quantity

  • Separator – used to separate iterated variants

  • Product.Field - reference containing product fields (e.g. {{Product.Price}})

Variant iterator: {{Variants:condition operators}}content…{{/Variants}}

Example:
{{Products: VariantCount > 0}}
{{Name}}
{{/Variants}}

{{Variants:OrderBy > SKU}}
{{SKU}} - {{Option}}{{Separator:,}}
Barcode: {{Barcode}}
Quantity: {{Quantity}}
Variant Price: {{Price}}
Original Price: {{Product.Price}}
{{/Variants}}


Options iterator

  • Display all variant options. You can use {{OptionTitle}} and {{OptionValue}}

{{Variants}}
{{Options}} {{OptionTitle}}: {{OptionValue}} {{/Options}}
{{/Variants}}
  • You can iterate product and category options titles with {{OptionTitle}} .

{{Categories}}
{{Options}} {{OptionTitle}} {{/Options}}
{{/Categories}}

 It could be used in table headers html (switch to edit in code view)

<!--{{Categories: ProductCount > 0 }}-->
{{Name}}
<table>
<tr>
    <th>Name</th>
    <!--{{Options}}-->
    <th>{{OptionTitle}}</th>
    <!--{{/Options}}-->
</tr>
<!--{{Products}}-->
<tr>
    <td>{{Name}}</td>
    <!--{{Options}}-->
    <td>{{Variants}}{{OptionValue}}{{/Variants}}</td>
    <!--{{/Options}}-->
</tr>
<!--{{/Products}}-->
</table>
<!--{{/Categories}}-->

5. Images

Image fields (product, variants, category thumbnail) could have additional parameters – positioning, width, and height to align with rest of text.

Format: {{Image:Position:Width:Height}}

Position could be  Fit, Fill, Stretch,Center,Default

Example:
{{Image}} - automatically sized
{{Image:Fit:200:100}} - sized to fit into box 200 x 100 pixels 

6. Condition Operators

These are condition operators you can use in any iterator or {{If}}

Operators:

  • ~ contains as sub string: {{Products:Description ~ Sale}}

  • = – text is equal {{Products: Category = Shoes}}

  • <> – text is not equal {{Products: Category <> Shoes}}

  • <,<=,>,>= – compare numbers (or text in alphabetical order){{Products: Price > = 10 : Price <= 100}}{{Categories: ProductCount > 0}} 

  • ! in front of condition makes it negative {{Products: !Description~Sale}}

  • ^ field is included in comma delimited list: {{Products: Category ^ Shirts, Jeans}}

7. Sort, limit and unique operators

These expressions can be used in any iterator. You can also use them in paging scenario

  • OrderBy – sort by descending (>) or ascending order (<)
    {{Products: OrderBy > Price}} – price in descending order
    {{Products: OrderBy < Price}} – price in ascending order

  • LimitBy – take only limited number of items
    {{Products: LimitBy = 50 }} – first 50 products
    {{Products: LimitBy = 10 : OrderBy > Price}} – top 10 products by price

  • SkipBy – skip first number of items
    {{Products: SkipBy = 10 }} – skip first 10 products
    {{Products: Category = Shoes : SkipBy = 20: LimitBy = 10 : OrderBy > Code }} – skip first 20 products  and show next 10 products in category Shoes ordered by Code

  • Unique - display only unique values from the list Unique = [Field Name]

    {{Products: VariantCount > 0}} 
    {{Name}}
    {{Variants: Unique=Color}}{{Color}}{{/Variants}}
    {{/Products}}
  • show products page links - the iterator displays only if the category changes

    <table>
    <!--{{Products : Unique = Category }}-->
    <tr>
    <td>{{Category}}</td>
    <td>{{Product Page Link}}</td>
    </tr>
    <!--{{/Products}}-->
    </table>

8. Conditional text

Use {{If condition}}…{{/If}} to show text if condition is true. You can use extended version {{If...}}...yes...{{Else}}...no...{{/If}}

Examples:
{{If Price > 100}} High price {{Else}} Low price {{/If}}
{{If Tag~sale}} Sale: {{Sale Price}} {{/If}} 

Check empty fields:
{{If Price}} Price: {{Price}} {{/If}}

For negative condition put ! before expression
{{If !Price}} No price {{/If}}
{{If !Description}}{{Category.Description}}{{/If}}
​ 

Or combine both outcomes with {{Else}}:
{{If Price > 0 }} Price: {{Price}} {{Else}} No price {{/If}}}
{{If Description}}{{Description}}{{Else}}{{Category.Description}}{{/If}}

You can use it inside any iterator

{{Products}} {{Name}} - {{If Price=0}} N/A {{/If}} {{If Price>0}} ${{Price}} {{/If}} {{/Products}}

Check variant properties of the product 

{{If Variants:Color=Red}}Red exists{{/If}}

9. Parameters

Add parameters to your catalog product content, headers, templates, showrooms, and any place. You can override parameter values for catalogs, showrooms, categories, or collections.

Add a parameter to any text content block as {{Parameter Name}}

  • Text - phones, address, sale conditions
    {{Contact Information}}

  • Numbers - discounts, currency rates for calculation
    ${{Calc: Price * USD Rate: #.00}}

  • Images - logo, stamps
    {{Business Logo:Fit:100:50}}

Use parameters in

  • Catalog text boxes, headers, or footers

  • Templates and layouts

  • Showroom site content

  • Product fields

  • Inside other parameters


10. Expressions in HTML code

Expressions can be used inside text box HTML (switch with code button). Please switch back after to store your HTML changes.

<span style="color:{{Collection.Color}};">{{Name}}</span>

<span style="color:{{If Collection.Color}}{{Collection.Color}}{{Else}}#efefef{{/If}};">{{Name}}</span>

 

11. PDF Page Break

You can put a page break anywhere in HTML, that will force PDF to break a page. 

<!-- pagebreak -->

It could be useful in expandable elements, e.g. at the end of category section 

12. Special expressions

{{Referral}} returns my-referral 

Link with referral in HTML code:
<a href="{{Store Link}}referral={{Referral}}">Link</a>


Did this answer your question?