Insert usage examples

AI suite (recommendations)

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

For 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, we use an aggregate, which stores the current state of the cart. The aggregate contains products that are served for recommendation campaigns. On this basis, recommended complementary products will be selected for those in the aggregate.

{% 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 %}

For 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.

{% 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.

{% aggregate aggregate-hash %}
  {{ aggregate_result[0] }}
{% endaggregate %}
Note: The aggregate value is always returned in the list.

Example:
An aggregate that holds an 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.

{% 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.

{% 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. You can use any attribute of a customer attribute as a variable. The name, surname, email, phone number, etc. can be a variable. By means of those variables, you can personalize the content, e.g. you can use the name of the user in the beginning of the email.

{% customer attr-name %}

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">
            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>

Social proof

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

{% socialproof %} metrics-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>

Pools

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

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

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">
            Take your promotional code and use it durning teh 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 durning teh 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 HTML code for the image of the barcode.

If you want to get only a 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
  • 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.