How to insert the “Product recommendations” block in your own HTML draft

You can create mailings based on templates (using a visual designer) or from scratch using HTML.

In the visual designer, the “Recommended products” block is inserted by dragging the corresponding item from the sidebar. To insert popular products in the HTML newsletter list, you need to write instructions in Liquid – the language of templates.

Using the Liquid language for the “Featured products” element in the HTML mailing allows you to send a fully customized trigger letter.

<table>
    <tr>
        <td>Image</td>
        <td>Product</td>
        <td>Price</td>
    </tr> 
    {% for line_item in visitor.recommended_offers %}
    <tr>
        <td><img src="{{ line_item.picture }}" /></td>
        <td><a href="{{ line_item.url }}">{{ line_item.name }}</a></td>
        <td>{{ line_item.price }}</td>
    </tr>
    {% endfor %}
</table>

For customization, you can use any HTML and CSS constructs supported by email clients. Please note that when laying out HTML mailings you will need to be careful and adhere to a number of recommendations, because email clients are quite capricious and do not understand some of the most recent layout standards.

Important point! Before sending a newsletter, be sure to check how it will look in the preview and send yourself a test email (buttons at the upper right) to make sure that all the items are displayed correctly.