Embedded content touchpoint from scratch

This article explains how to create an embedded content touchpoint from scratch.

Christiaan Proper avatar
Written by Christiaan Proper
Updated over a week ago

Note: This is a follow up on this article.

You can code your own HTML element and instead of using text in the element like a product name, URL, image URL and price, use the following variables:

  • {{item.name}}

  • {{item.description}}

  • {{item.price}}

  • {{item.url}}

  • {{item.image}}

These variables start with item. and the part after it is the content item field name. You can find the names of the fields in the content you filtered or selected:

For example:

<div class="item" style="background-image: url('{{item.image}}')">
<div class="item-content">
<h3 class="h3">{{item.name}}</h3>
<p class="price"><strong>€{{item.price}}</strong></p>
<p class="caption">{{item.description}}</p>
<div class="btn-wrap">
<a class="btn btn-primary" href="{{item.url}}">View product</a>
</div>
</div>
</div>


You now created an embedded content recommendation. To recommend multiple products in one embedded touchpoint, read the following article.

Did this answer your question?