Product Recommendations for Website

A website is the main sales channel for ecommerce. The better it converts visitors into customers, the more your profit and ROI.

Blocks with product recommendations can help increase this conversion: visitors purchase more thanks to personal recommendations and upsell offers. At the same time, their shopping experience is being improved as the recommendation algorithms consider the visitor's interests and reduce the search time.

Block examples:

• You may also like;
• People who bought this item also bought;
• Personally for you;
• Similar products;
• Bestsellers;
• Popular on the website, etc.

📘

Important

Personalized recommendations are built based on visitor website behavior data. To collect this data, you need to install web tracking.

To start using product recommendations for your website, subscribe to one of the Extra pricing plans.

How to Create a New Recommendation

Note. You can create a recommendation placement and appearance before creating a recommendation itself and then assign it to the created recommendation.

1. Choose the Page Type

1. Go to Site > Recommendations and click Create recommendation.

2. Choose the page type:

• Main page;
• Category page;
• Product page;
• Cart page;
• 404 page;
• Any page.

Each type has different algorithms for product selections, for example, bestsellers for the main page or personalized recommendations for the category page. Any page type is suitable for a wishlist, blog, promotions, etc.

If you choose no type and click Next, you’ll be directed to the main page settings by default.

2. Choose the Data Source

A data source is a file that contains data on the products that will be shown in recommendations. It’s created based on the product feed you’ve uploaded to the system.

Each page type has its own set of applicable data sources.

Main Page

Recommendations based on visitor data. For any pages. Recommended products will be unique for each visitor.

• Personal recommendations;
• Recommended for you, based on site bestsellers.
  General recommendations. For any pages. Based on general site data on products and visitors.
• Bestsellers of all products;
• Popular on the website.

If there is no data on the visitor, they will be recommended bestsellers by default.

Category Page

Recommendations based on visitor data. For any pages. Recommended products will be unique for each visitor.

• Personally for you from this category;
• Personal recommendations;
• Recommended for you, based on site bestsellers.

General recommendations. For any pages. Based on general site data on products and visitors.

• Bestsellers of all products;
• Popular on the website.

Product Page

Recommendations based on visitor data. For any pages. Recommended products will be unique for each visitor.

• Personally for you from this category;
• Personal recommendations;
• Recommended for you, based on site bestsellers.

Recommendations based on product data. For pages that show a product or product category based on which algorithm returns recommended products.

• Similar products;
• People who bought this item also bought.

General recommendations. Based on general site data on products and visitors.

• Bestsellers of all products;
• Popular on the website.

Cart Page

Recommendations based on visitor data. For any pages. Recommended products will be unique for each visitor.

• Personally for you from this category;
• Recommended for you, based on site bestsellers.

Recommendations based on product data. For pages that show a product or product category based on which algorithm returns recommended products.

• Similar products;
• People who bought this item also bought.

General recommendations. Based on general site data on products and visitors.

• Bestsellers of all products;
• Popular on the website.

Page 404

Recommendations based on the visitor data. For any pages. Recommended products will be unique for each visitor.

• Personal recommendations;
• Recommended for you, based on site bestsellers.

General recommendations. For any pages. Based on general site data on products and visitors.

• Bestsellers of all products;
• Popular on the website.

Rules

You can add additional rules of product display for each algorithm. For example, you can opt to show only products with certain parameters (brand, price, category), exclude products from the recommendation, set display priority, etc.

Go to personal profile > Settings > Data sources, choose the corresponding data source, and click +Add rules.

Enter the rule name, click Add rule and set the necessary conditions.

3. Enter the Name

Enter the recommendation name and description. They will only be used within the system for you to find the necessary recommendation. It won't be shown to website visitors.

4. Set the Appearance

1. Enter the title that will be displayed on the website above the block with recommended items.

2. Select the appearance type of product cards for your recommendations.

You can select any of the ready basic templates or upload your custom template. To do this, go to Appearance and click New appearance.

Enter the title and description and insert the appearance code in the code editor. Click Help on the right to see our recommendations and guidelines on the code insertion.

5. Set the Placement

Click Done.

As for now, we don’t have ready placement templates. You need to create a placement in Placements first, and then assign it to the recommendation.

1. Go to Placements, click New placement and select the page type.

2. Enter the title. For convenience, use the page type and where on the page the recommendation will be placed.

3. Use a CSS selector to specify the element you want to add a placement to.

• Go to the page where the recommendation will be placed and click F12 to open the console. You can also open the console by right-clicking on the page and clicking Inspect.
• Activate Select an element in the page to inspect it by clicking it.

• Click the element relative to which the recommendation will be placed (before, after, inside the element).

• Right-click the selected element and click Copy → Copy selector.

• Paste the copied CSS selector in the input field above.

4. Select where the recommendation will be placed relative to the selected element and click Done.

5. To assign the created placement to the recommendation, go to Recommendations _and click the necessary recommendation in the general list. Click _Parameters, and in Placement select the necessary placement.

6. Post the Recommendation on the Website

After creation, the recommendation is visible only to you. Click View on page, to see how it will be displayed on the website.

If the card layout is fine, and all items are inserted as intended, switch the status to Visible to website visitors.

After that, the recommendation will be published on the site, and any changes made to it will be displayed in Change history.

Recommendation Management

General

You can use the following tools to sort out your recommendations:

1. Search by keyword.
2. Filtering by page type. By switching pages on the left, you will see only recommendations placed on the selected page. The color of the placement font in the list corresponds to the color of the page marker on the left. For example, placements on the main page are in purple, on the category page – in pink, etc.
3. Filtering by date.
4. Filtering by statistics.

After publishing the recommendation on the site, the statistics on it will be given in the list:

• Views;
• Clicks;
• CTR (ration of clicks to impressions);
• Purchases (transactions);
• Conversion (ration of purchases to clicks);
• Item quantity;
• Purchase amount;
• Average order value.

The start icon before the recommendation indicates that it is displayed on the site. The crossed eye icon indicates that the recommendation is visible only to you.

To delete the recommendation, click three points at the end of the line.

Click the recommendation to see the statistics on it.

Analytics

The Analytics tab shows the statistics from the general list which you can filter by date.

The following Activity dynamics visualize the same indicators in the form of the chart.

Change history shows changes with the date and description. Changes are recorded only when a recommendation is visible to website visitors.

A/B Testing

A/B tests are used to determine the effectiveness of various recommendation elements: title, appearance, placement, or data source.

In the A/B testing tab, you can start a new test and later view its results.

To run a new test, click Start A/B testing. You’ll be directed to Parameters to specify test conditions.

You can also start testing in Parameters by clicking the self-titled button.

Parameters

First, specify the number of variants to be tested, distribute weight, and enter a description.

Weight is the share of the audience that will see the corresponding variant. You can distribute it evenly by clicking the self-titled button, or manually specify the ratio by hovering over the digit in the line. Recommendations with zero weight won’t be displayed on the site.

By default, two variants are set for A/B testing. This is the required minimum. To add a new one, click Add variant. You can test up to 8 variants.

Next, specify the parameter to be tested. We recommend testing one parameter at a time.

Placement. Click the arrow at the end of the title to choose the variant from the available placements.

Appearance. Similarly to placements, click the arrow at the end of the title to choose the variant from the available appearances.

Title. Enter the title variants.

Data source. Click the corresponding data source to replace it with the variant to be tested.

Click Save after all settings are done.

If you don't run any A/B test, the Parameters tab will display only the parameters of the recommendation.

A/B Testing Report

Each recommendation that has been A/B tested is labeled with the corresponding button in the general list. Hover over it, to preview the results in brief.

Depending on the current status (complete/incomplete) and results for two tested indicators (CTR, Conversion), the button has different colors:

• Green: testing is complete, both winners (CTR, Conversion) are determined.
• Grey and yellow: there is not enough data to determine the winner for CTR, the results for Conversion are the same.
• Yellow: the results for CTR and for Conversion are the same, testing is in progress.
• Green and yellow: the winner for CTR is determined, the results for Conversion are the same.
• Yellow and green: the results for CTA are the same, the winner for Conversion is determined.
• Grey: there is not enough data to determine the winner for any indicator.

There are several ways to open the detailed report:

1. Click the corresponding recommendation in the general list and go to A/B testing.
2. Click A/B testing in the general list;
3. Click View test in the preview.

First, the report shows the winner for both indicators. To become a winner, a variant must perform better with a confidence of at least 90%, and the confidence interval between variants must be over 5%. Testing will continue until this minimum threshold is reached.

If there is not enough data, you can finish the test by clicking Choose Variant A and finish test (the variant that has been performing better will be in bold).

If different winners variants perform better for CTR and Conversion, the winner will be the variant that performs better for Conversion, as sales are more important than clicks.

Results show indicators for each variant. Indicators for the winner are highlighted green. Hover any to see the confidence interval – a metric that determines the accuracy of testing. The more people saw the recommendations and performed the target action, the higher the interval and the lower the standard error. If % of the standard error is high, wait until enough data is collected.

Activity dynamics visualizes the results in the form of histograms. Hover over the graph to see details.

At the bottom, there is a history of completed tests with the date of testing and the winner.