All Collections
Commerce
Product recommendations
Product recommendations in campaigns, pages, or forms
Product recommendations in campaigns, pages, or forms

Insert and customise product recommendations in your email campaigns, pages, and forms.

Laura Russell avatar
Written by Laura Russell
Updated over a week ago

Our product recommendations feature lets you generate and add dynamic and tailored product recommendations to your communications.

Use our product recommendations builder to quickly build recommendations for:


Before you start

Things you need to know:

  • To use product recommendations, you must be synchronising the correct Insight data from your ecommerce store. Once these Insight data collections are present and contain data, you can use the product recommendations block.


Watch the video


1. Create a product recommendation

Before you can add product recommendations to your campaigns or pages, you must create your recommendation in the Product recommendations builder.


2. Insert a product recommendation

  1. While editing your campaign or page in EasyEditor, expand the Product recommendations block menu.​

    prod-recs.png

  2. Drag the product recommendation block you want to use onto the EasyEditor canvas.

    You can see a preview of the recommendation in EasyEditor, with placeholders for images and text.

    ee_edit_product_recommendations_block.PNG

3. Change the layout

  1. On the EasyEditor canvas, select your product recommendation.

  2. In the side panel, expand the Layout menu.

  3. For Layout, you can choose the positioning of your product image and text. Select either Image with text underneath or Image with text on the right-hand side.

  4. For Number of rows, choose either one row or two rows for your recommendation.

  5. For Number of recommendations per row, choose the number of product recommendations you want to show on each row. You can choose between one and four recommendations.

prod-rec-menu.png

4. Choose and reorder the fields

  1. On the EasyEditor canvas, select your product recommendation.

  2. In the left-side panel, expand the Fields menu.

  3. Select the check box for any of the fields you want to show in your recommendation.

  4. To reorder the fields, select the left side of the field block and drag it into position.

prod-rec-order.png

Using the price field

The price field gives you three options for displaying the price on your product recommendations:

  • Price
    Only the price of the product

  • Show special price with price
    The original price alongside the special price.

  • Show special price
    Only the special price of the product.

Using older product recommendations?

Older product recommendation blocks are not compatible with the Fields controls. To access this control, delete the block and re-add it.


5. Set and show the currency code

To set the currency of your product recommendations and choose whether to show the currency symbol or not:

  1. On the EasyEditor canvas, select your product recommendation.

  2. In the side panel, expand the Settings menu.

  3. Expand the Currency drop-down menu, then choose the currency of your product recommendations.

  4. If you'd like to display the currency's code, select the Show currency code check box.

prod-rec-settings.png

6. Add UTM tracking analytics

If you want to track the performance of your product recommendations, you can add UTM tracking parameters.

Tracking information can be added using any of the UTM parameters you have set up in your account. If you have set link tracking at a campaign-specific level, you see the campaign-level tracking parameters. Otherwise, you see your default account-level parameters.

To add UTM tracking parameters:

  1. On the EasyEditor canvas, select the Product recommendation block.

  2. In the side panel, expand the Analytics menu.

  3. To apply your default tracking values to links in the product block, select the Reset to defaults checkbox.

  4. To change the values applied to your tracking parameters for links in your product block, clear the Reset to defaults checkbox, and enter the values you want to use in each text field.


7. Add and style a button

  1. On the EasyEditor canvas, select your product recommendation.

  2. In the side panel, expand the Button settings menu.

  3. To show a button, select the Display button check box.

  4. For Button text, enter the text you want to show on your button.

  5. To style the button, select Manage buttons styles and then select the button you want to style. On the Edit style side-panel, you can edit:

    1. Text styles
      Change the font, size, and add additional styling to your text.

    2. Colour
      Choose a fill colour for your button.

    3. Alignment
      Expand the Alignment drop-down menu and choose to align your button Left, Centre, Right, or Full width.

    4. Padding
      Enter a padding amount in pixels for both horizontal and vertical padding.

    5. Minimum width
      Enter a minimum width in pixels for your button.

    6. Border
      Add a border to your button and then edit the colour width and radius of your border.

prod-rec-button-style.png

8. Change the size of images

Our product recommendations use technology that dynamically re-sizes images when a contact opens the email. Unlike a static product grid, product recommendations are dynamic and depending on how images are handled in your store this can cause some unexpected layout issues for some email clients.

For example, current versions of Outlook cannot proportionally scale images; this can be a problem if your dynamic grid of products contains a long image such as a pair of skis and a square image such as a pair of goggles. You end up with uneven column heights.

For this reason, we recommend that you leave the “Override image sizes” box checked. This will see images sized to squares such that your grid’s columns are of equal height.

If you want to change the size of the images in your product recommendation:

  1. On the EasyEditor canvas, select your product recommendation.

  2. In the side panel, expand the Image settings menu.

  3. To show a button, select the Override image sizes check box.

  4. For Image ratio, enter the ratio you want to use for your images.

prod-rec-override-image-size.png

9. Test your product recommendations

Once you've added a recommendation block to your email, page or form, you can use our preview feature to swap out your placeholder images and text with your real product recommendations.

When using the preview feature, there may be a delay of up to 15 seconds if we need to generate new recommendations.

Did this answer your question?