Insert usage examples

AI suite (recommendations)

You can show a set of recommendations to the customer.

Syntax:

{% recommendations2 campaignId=campaign-hash %}
  {{ recommended_products2  }}
{% endrecommendations2 %}

Example:
Personalized on homepage.

<div class="snrs-AI--banner" style="height: auto;">
    <div class="snrs-AI--slider">
        <div class="snrs-AI--products-slider">
            <ul>
                {% recommendations2 campaignId=lTZ1UkK2hz0g %}
                {% for p in recommended_products2 %}
                <li data-snr-ai-product-id="{{p.productRetailerPartNo}}">
                    <a class="snrs-AI--item-link" href="{{p.link}}" title="{{p.title}}">
                        <img src="{{ p.imageLink }}"
                            class="products-slider__item-image snrAI-product-image snrAI-product-image-{{p.productRetailerPartNo}}"
                            width="90" alt="{{p.title}}" id="snrAI-image-{{p.productRetailerPartNo}}">
                        <h3 class="snrs-AI-product--product-name">
                            <span class="snrs-AI-product--name-first">{{p.title}}</span>
                        </h3>
                    </a>
                </li>
                {% endfor %}
                {% endrecommendations2 %}
            </ul>
        </div>
    </div>
</div>

Output:

<div class="snrs-AI--banner" style="height: auto;">
    <div class="snrs-AI--slider">
        <div class="snrs-AI--products-slider">
            <ul>
                <li data-snr-ai-product-id="000097">
                    <a class="snrs-AI--item-link"
                        href="https://example.com/accessories-for-shaver/cleaner-contribution-to-shavers-braun-CCR2,id-2369"
                        title="Cleaning insert for shavers BRAUN CCR2">
                        <img src="https://example.com/temp/thumbs-new/2/other/cd1c73e35b1db186e79e8a0039b27293_250x200w50.jpg"
                            class="products-slider__item-image snrAI-product-image snrAI-product-image-000097"
                            width="90" alt="Cleaning insert for shavers BRAUN CCR2" id="snrAI-image-000097">
                        <h3 class="snrs-AI-product--product-name">
                            <span class="snrs-AI-product--name-first">Cleaning insert for shavers BRAUN CCR2</span>
                        </h3>
                    </a>
                </li>
                <li>...</li>
                <li>...</li>
                <li>...</li>
                <li>...</li>
            </ul>
        </div>
    </div>
</div>

AI Cart Recommendations

In this case, you can use an aggregate which stores the current state of the cart. The aggregate contains items that build the context for generating a set of complementary items.

Syntax:

{% set recommendationProducts = [] %}
{% aggregate aggregate-hash %}
{% for r in aggregate_result|reverse %}
    {% set _noop = recommendationProducts.append(r.sku) %}
{% endfor %}
{% endaggregate %}

{% recommendations2 campaignId=campaign-hash products=recommendationProducts %}
    {{ recommended_products2 }}
{% endrecommendations2 %}

Example:
Recommendation on the cart page.

<div class="snrs-AI--banner" style="height: auto;">
<div class="snrs-AI--slider">
    <div class="snrs-AI--products-slider">
    <ul>
        {% set recommendationProducts = [] %}
        {% aggregate 504847102217171 %}
        {% for r in aggregate_result|reverse %}
            {% set _noop = recommendationProducts.append(r.sku) %}
        {% endfor %}
        {% endaggregate %}

        {% recommendations2 campaignId=jvVD6lmPcBJ6 products=recommendationProducts %}
        {% for p in recommended_products2 %}
            <li data-snr-ai-product-id="{{p.productRetailerPartNo}}">
            <a class="snrs-AI--item-link" href="{{p.link}}" title="{{p.title}}">
                <img src="{{ p.imageLink }}" class="products-slider__item-image snrAI-product-image snrAI-product-image-{{p.productRetailerPartNo}}" width="90" alt="{{p.title}}" id="snrAI-image-{{p.productRetailerPartNo}}">
                <h3 class="snrs-AI-product--product-name">
                <span class="snrs-AI-product--name-first">{{p.title}}</span>
                </h3>
            </a>
            </li>
        {% endfor %}
        {% endrecommendations2 %}
    </ul>
    </div>
</div>
</div>

Output:

<div class="snrs-AI--banner" style="height: auto;">
    <div class="snrs-AI--slider">
        <div class="snrs-AI--products-slider">
            <ul>
                <li data-snr-ai-product-id="000097">
                    <a class="snrs-AI--item-link"
                        href="https://example.com/accessories-for-shaver/cleaner-contribution-to-shavers-braun-CCR2,id-2369"
                        title="Cleaning insert for shavers BRAUN CCR2">
                        <img src="https://example.com/temp/thumbs-new/2/other/cd1c73e35b1db186e79e8a0039b27293_250x200w50.jpg"
                            class="products-slider__item-image snrAI-product-image snrAI-product-image-000097"
                            width="90" alt="Cleaning insert for shavers BRAUN CCR2" id="snrAI-image-000097">
                        <h3 class="snrs-AI-product--product-name">
                            <span class="snrs-AI-product--name-first">Cleaning insert for shavers BRAUN CCR2</span>
                        </h3>
                    </a>
                </li>
                <li>...</li>
                <li>...</li>
                <li>...</li>
                <li>...</li>
            </ul>
        </div>
    </div>
</div>

Expressions

To find out what expressions are and how to create them, read this article.

Syntax:

{% expression %} expression-hash {% endexpression %}

Or as a variable that you can modify:

{% expressionvar expression-hash %}
    {{ expression_result }}
{% endexpressionvar %}

Example:
An expression that holds the value of an abandoned cart.

<h1>
  Total amount: {% expression %} 4085025a-313e-4a63-a6b4-d19820853912 {% endexpression %}$
</h1>

Output:

<h1>
  Total amount: 345$
</h1>

Aggregates

To find out what aggregates are and how to create them, read this article.

Syntax:

{% aggregate aggregate-hash %}
  {{ aggregate_result[0] }}
{% endaggregate %}

Note: The aggregate result is always returned as a list.

Example:
An aggregate that holds a list of categories that have recently been added to the cart.

{% aggregate 504847102217171 %}
<ul>
  {% for item in aggregate_result %}
  <li>{{ item }}</li>
  {% endfor %}
</ul>
{% endaggregate %}

Output:

<ul>
  <li>Home</li>
  <li>Sports</li>
  <li>Toys</li>
  <li>Electronics</li>
</ul>

Catalogs

To find out what catalogs are and how to create them, read this article.

Syntax:

{% catalog.catalogName(keyName).columnName %}

Or as a variable that you can modify:

{% catalogvar.catalogName(keyName).columnName %}
  {{ catalog_result }}
{% endcatalogvar %}

Example:
The aggregate contains a list of 10 SKUs of recently viewed products.
Now, using the SKUs from the aggregate, you can refer to a catalog automatically by OG:tags.

<ul>
    {% aggregate 504847102217171 %}
    {% for sku in aggregate_result %}
    <li data-snr-ai-product-id="{% catalog.Snrs-produktu-ogTag(sku).product:retailer_part_no %}">
        <a class="snrs-AI--item-link" href="{% catalog.Snrs-produktu-ogTag(sku).og:url %}" title="{% catalog.Snrs-produktu-ogTag(sku).og:title %}">
            <img src="{% catalog.Snrs-produktu-ogTag(sku).og:image %}"
                class="products-slider__item-image snrAI-product-image snrAI-product-image-{% catalog.Snrs-produktu-ogTag(sku).og:image %}"
                width="90" alt="{% catalog.Snrs-produktu-ogTag(sku).og:title %}" id="snrAI-image-{% catalog.Snrs-produktu-ogTag(sku).product:retailer_part_no %}">
            <h3 class="snrs-AI-product--product-name">
                <span class="snrs-AI-product--name-first">{% catalog.Snrs-produktu-ogTag(sku).og:title %}</span>
            </h3>
        </a>
    </li>
    {% endfor %}
    {% endaggregate %}
</ul>

Output:

<ul>
    <li data-snr-ai-product-id="000097">
        <a class="snrs-AI--item-link"
            href="https://example.com/accessories-for-shaver/cleaner-contribution-to-shavers-braun-CCR2,id-2369"
            title="Cleaning insert for shavers BRAUN CCR2">
            <img src="https://example.com/temp/thumbs-new/2/other/cd1c73e35b1db186e79e8a0039b27293_250x200w50.jpg"
                class="products-slider__item-image snrAI-product-image snrAI-product-image-000097" width="90"
                alt="Cleaning insert for shavers BRAUN CCR2" id="snrAI-image-000097">
            <h3 class="snrs-AI-product--product-name">
                <span class="snrs-AI-product--name-first">Cleaning insert for shavers BRAUN CCR2</span>
            </h3>
        </a>
    </li>
    <li>...</li>
    <li>...</li>
    <li>...</li>
    <li>...</li>
    <li>...</li>
    <li>...</li>
    <li>...</li>
    <li>...</li>
    <li>...</li>
</ul>

Metrics

To find out what metrics are and how to create them, read this article.

Syntax:

{% metrics %} metrics-hash {% endmetrics %}

Or as a variable that you can modify:

{% metricsvar metric_id:metrics-hash %}
    {{ metric_result }}
{% endmetricsvar %}

Example:
A metric that holds the value of products sold in the last 30 days.

{% metricsvar metric_id:07e93207-4dd4-4239-ab1a-9267118276b0 %}

  {% set result = metric_result|int %}

  {% if result > 4500 %}
  Bravo! we achieved the set goal
  {% else %}
  {{ 4500 - result }} USD more to get a goal
  {% endif %}

{% endmetricsvar %}

Output (metric result is 2356):

2144 USD more to get a goal

Variables

Variables are connected with customers’ attributes, such as the name, surname, email, phone number, and more. You can use any customer attribute as a variable.
By means of those variables, you can personalize the content, for example you can use the name of the user in the greeting at the beginning of an email.

Syntax:

{% customer attr-name %}

Example:
A welcome message.

<div class="snrs-wrapper">
  <div id="snrsCornerMessage" class="snrs-corner-message-wrap">
    <div class="snrs-corner-message">
      <div class="snrs-corner-main">
        <div class="snrs-corner-message-text">
            Hello {% customer $firstname %}!
        </div>
      </div>
    </div>
  </div>
</div>

Output (the result of the variable is “John”):

<div class="snrs-wrapper">
  <div id="snrsCornerMessage" class="snrs-corner-message-wrap">
    <div class="snrs-corner-message">
      <div class="snrs-corner-main">
        <div class="snrs-corner-message-text">
            Hello John!
        </div>
      </div>
    </div>
  </div>
</div>

Advanced use

You can check if a customer has an attribute set and act accordingly.
For example, this can be used to set up a single campaign for customers who have an attribute and those who don’t. Without the check, you would need to create two separate campaigns.

Example 1: Check if a customer belongs to a loyalty club and what kind of membership they have:

{% if "club_member" in customer.keySet() %} // checks if the club_member attribute exists
  {% if customer["club_member"] == "highPriority" %}
    <!-- insert HTML code -->
  {% elif customer["club_member"] == "mediumPriority" %}
    <!-- insert HTML code -->
  {% elif customer["club_member"] == "lowPriority" %}
    <!-- insert HTML code -->
  {% endif %}
{% endif %}

Example 2: Check if the customer profile includes an entry about the city of residence:

{% if "city" in customer.keySet() %}
  Check the best prices in {{ customer["city"] }}!
{% else %}
  Check the best prices in your city!
{% endif %}

Social proof

To create social proof, you need to create a metric with a dynamic key. To find out how to do it, read this article.

Syntax:

{% socialproof %} metric-hash {% endsocialproof %}

Example:
The number of times the product was added to cart during the last 30 days.

<div class="snrs-wrapper">
  <div id="snrsCornerMessage" class="snrs-corner-message-wrap">
    <div class="snrs-corner-message">
      <div class="snrs-corner-main">
        <div class="snrs-corner-message-text">
            This product has been added to the cart {% socialproof %} 537165da-9d8c-4460-a3a2-6294f1f7aef9 {% endsocialproof %} times in the last 30 days!
        </div>
      </div>
    </div>
  </div>
</div>

Output (metric result is “235”):

<div class="snrs-wrapper">
  <div id="snrsCornerMessage" class="snrs-corner-message-wrap">
    <div class="snrs-corner-message">
      <div class="snrs-corner-main">
        <div class="snrs-corner-message-text">
            This product has been added to the cart 235 times in the last 30 days!
        </div>
      </div>
    </div>
  </div>
</div>

Code pools

To find out what code pools are and how to create them, read this article.

Syntax:

{% voucher %} voucher-hash {% endvoucher %}

Example:
A promotion code from a selected code pool

<div class="snrs-wrapper">
  <div id="snrsCornerMessage" class="snrs-corner-message-wrap">
    <div class="snrs-corner-message">
      <div class="snrs-corner-main">
        <div class="snrs-corner-message-text">
            Take your promotional code and use it durning the transaction to get a 50% discount!
            <strong>{% voucher %} 274a18d5-e8bd-4fec-82d1-cea0af19af01 {% endvoucher %}</strong>
        </div>
      </div>
    </div>
  </div>
</div>

Output (voucher result is “5510018091219”):

<div class="snrs-wrapper">
  <div id="snrsCornerMessage" class="snrs-corner-message-wrap">
    <div class="snrs-corner-message">
      <div class="snrs-corner-main">
        <div class="snrs-corner-message-text">
            Take your promotional code and use it during the transaction to get a 50% discount!
            <strong>5510018091219</strong>
        </div>
      </div>
    </div>
  </div>
</div>

Barcodes

To add a barcode of a voucher to an email template, paste the following code:

{% vouchervar id=51bc866c-8dcb-447e-8353-77401c9f1335  %} 
{% barcode code= {{voucher_result}}, gray=true, type=EAN_13, hrp=BOTTOM %}
{% endvouchervar %}

The result of that insert will be the HTML code for the image of the barcode.

If you want to get only the URL of the barcode, use the following code:

{% vouchervar id=51bc866c-8dcb-447e-8353-77401c9f1335  %}
{% barcode-url code= {{voucher_result}}, gray=true, type=EAN_13, hrp=BOTTOM %}
{% endvouchervar %}

Explanation of parameters:

  • vouchervar id is a UUID of a voucher pool available on the platform (Assets > Code pools).
  • gray defines the color of the barcode. Parameter values:
    • TRUE - The code is generated in grayscale.
    • FALSE - The code consists of black and white pixels.
  • type defines the type of barcode. Parameter values:
    • EAN_13
    • EAN_8
    • EAN_128
    • CODE_39
    • CODE_128
    • ITF_14
    • POSTNET
    • UPC-A
    • UPC-E
    • QR_CODE
  • hrp (human readable part) defines the position of the readable part of the code for users (usually it takes the form of a string of numbers). Parameter values:
    • NONE - There is no readable part of the code.
    • BOTTOM - The readable string is at the bottom of the barcode.
  • resolution defines the resolution of a bar code in dpi and indirectly affects the width of the narrowest bar.
😕

We are sorry to hear that

Thank you for helping improve out documentation. If you need help or have any questions, please consider contacting support.

😉

Awesome!

Thank you for helping improve out documentation. If you need help or have any questions, please consider contacting support.