This document explains how to transfer the embedded product blocks written in code from Datatrics to Squeezely.
Note: this document does not show how to set up basic settings and how to connect content to your personalization. Please check this document for that: Custom Productsets (EN) and Personalizations (EN)
When you transfer to Squeezely from the Datatrics platform, we can imagine that you would like to use the already working embedded product blocks from Datatrics and copy these to Squeezely.
Squeezely does not work the same way as Datatrics, so you do need to change parts of the code within your embedded content.
For example, you have the following embedded code in Datatrics:
In Datatrics, you would make use of an each loop to loop through your products and show a row of products, like the code example below:
{{#each items}} itemcount='4'
<!-- YOUR HTML -->
{{/each}}
Because you loop through products, you have all item properties defined as:
{{property}}, without “item.”.
Simplified, it looks like this:
{{#each items}} itemcount='4'{{name}}{{description}}{{/each}}
First, copy the HTML code from Datatrics to your personalization in Squeezely.
The big difference in Squeezely is that we don’t use an each loop but make use of Nunjucks. To show a row of products in Squeezely, you can make use of the following code:
{% for item in items %}{% endfor %}
So you replace {{#each items}} itemcount='4' with {% for item in items %} and the closing of the {{/each}} loop with {% endfor %}. The desired item count is set up in the personalization template.
The code will look as follows:
From:{{#each items}} itemcount='4'{{name}}{{description}}{{/each}}
To: {% for item in items %}{{item.name }}{{item.description}}{% endfor %}
Next to that, you will need to alter all the item properties that are set in the code from {{property}} to {{item.property}} as this is necessary for the {% for item in items %} property to render the products correctly on your website. Furthermore, you also have to use the correct query selector for the content to load; this can also be set up in your template.
You can use your CSS styling and place it in the CSS tab within Squeezely, and of course, you can use other Nunjucks in your code as you see fit. See the above link in the documentation for that.
See the following documentation for other topics regarding the transfer from Datatrics to Squeezely.