Adding multiple content items to embedded content touchpoints

This article explains how to add multiple content items to an embedded touchpoint.

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

When you are displaying one content item, you use variables like this:

  • {{item.name}}

  • {{item.description}}

  • {{item.price}}

  • {{item.url}}

  • {{item.image}}

When displaying multiple content items in an embedded touchpoint, you need to loop through multiple items. You can do this as follows:

{{#each items}} itemcount='3'
{{name}}
{{description}}
{{price}}
{{url}}
{{image}}
{{/each}}


As you can see, you need to declare the amount of items you want to show, which is 3 in the example above. The thing that’s different from displaying single items, is that you don’t need to declare in every variable you are displaying an item with item. because you are already looping through items. So the variable for the URL is {{url}} instead of {{item.url}}. Below you will find an example of an embedded content touchpoint with three product recommendations:

{{#each items}} itemcount='3'
<div class="item" style="background-image: url('{{image}}')">
<div class="item-content">
<h3 class="h3">{{name}}</h3>
<p class="price"><strong>€{{price}}</strong></p>
<p class="caption">{{description}}</p>
<div class="btn-wrap">
<a class="btn btn-primary" href="{{url}}">View product</a>
</div>
</div>
</div>
{{/each}}
Did this answer your question?