# Ecommerce Recommendations: Related, Complementary and Personalised

> Design related, complementary and personalised recommendation rows that earn their place: where each type belongs, what to build first and what breaks them.

- Type: Pattern guide
- Level: Intermediate
- Reading time: About 25 minutes
- Audience: Written for store owners, builders, and designers refining high-performance ecommerce stores.
- Last updated: 2026-10-30
- Canonical page: https://academy.getzenbasket.com/patterns/ecommerce-recommendations/
- Part of: [Pattern library](https://academy.getzenbasket.com/patterns/) on ZenBasket Academy

---

## 1. What a recommendation is for

A recommendation row answers a question the shopper has not asked yet. That makes it the most easily wasted block on a page: it takes space next to the buy decision, and if the answer is wrong the shopper learns to stop reading it.

> **Short answer:** The three kinds of recommendation answer three different shopper questions. Related products answer "is there something better than this?" Complementary products answer "what goes with this?" Personalized products answer "what is for me?" Put each one where its question is actually being asked, label it by what it promises, and never merge all three under one vague "You may also like" box.

**The shop-assistant test.** Read the row aloud as a sentence a good assistant would say to the person holding this product: "if it isn't quite right, these are similar", or "people usually need these to use it". If you would feel awkward saying it, the row is not ready.

---

---

## 2. The three types

### 2.1 Related products (alternatives)

Items the shopper might choose instead of the one they are viewing: the same category, a similar price band, a different brand, size or finish. The doubt it answers is "is this the right one?"

- **Wins when:** the shopper is comparing, or is on a product that is out of stock, too expensive or not quite right.
- **Fails when:** it sits next to the buy button. An alternative placed beside the add-to-cart restarts a decision the shopper was about to finish.
- **Data it needs:** category, price band and a few shared attributes. No behavioural data required.


### 2.2 Complementary products

Items the shopper needs in addition to the one they are viewing: the cable, the filter, the matching belt, the shade that goes with the base. The doubt it answers is "will I be able to use this?" or "what goes with it?"

- **Wins when:** the companion is required or near-required, so the suggestion reads as service rather than selling. Compatibility-dependent suggestions are the strongest of all.
- **Fails when:** it offers alternatives dressed as companions, or items that do not fit this exact model. A wrong accessory undoes the trust your compatibility information built.
- **Data it needs:** an explicit relationship (this fits that), either hand-set or from a compatibility field. Purchase patterns alone are a weak substitute.


### 2.3 Personalised recommendations

Items chosen because of what this shopper has viewed, bought or searched for. The doubt it answers is "what should I look at next?" It is the only type that changes between visitors.

- **Wins when:** you have repeat visitors and enough behavioural data for the picks to be right, typically on the homepage and account pages.
- **Fails when:** data is thin. A personalised row built on two page views looks randomly assembled and is hard to debug.
- **Data it needs:** sessions or accounts, browsing and purchase history, and a sensible fallback for everyone without them.


![1](https://bloggallery.s3.us-west-2.amazonaws.com/Zenbasket%20Docs/1_1791279982559.png)


### One question to choose the type

| The shopper's doubt | Type | Label it |
|---|---|---|
| "Is this the right one?" | Related (alternatives) | "Similar items" · "You may prefer" |
| "What do I need to go with it?" | Complementary | "Works with this" · "Completes the set" |
| "What should I look at next?" | Personalised | "Picked for you" · "Because you viewed …" |
| "Where was I?" | Recently viewed | "Recently viewed" |

---

---

## 3. Where each type belongs

The article lays out recommendations by page: homepage, product page, cart and category pages. We follow the same journey and add one stage it doesn't cover.

| Page | Main job | Recommendation types that fit | Example blocks |
|---|---|---|---|
| Homepage | Orient someone with no product in view | Personalized first, then curated | A "For you" section from browsing and purchase behaviour, featured collections, seasonal or holiday picks |
| Category page | Help people choose within a range | Curated and popularity-based | Best sellers, new arrivals, editor's picks |
| Product page | Support the decision | Related, plus a little complementary | "Customers also bought", "You might also like", a premium version or add-on |
| Cart | Complete the purchase | Complementary | "Frequently bought together", "Complete the look", bundle deals |
| After purchase (our addition) | Prepare the next visit | Personalized, light | Order-confirmation suggestions based on what was just bought |

Three things follow from this table.

1. **Personalized earns its place on pages with no anchor product.** On a homepage there is nothing to relate things to, so the shopper's own behaviour is the only signal worth using.
2. **Category-page blocks are mostly curation, not personalization.** Best sellers, new arrivals and editor's picks are shared by everyone. They are useful, but don't call them "for you".
3. **The cart is for complementary items only.** By this point the shopper has chosen. Showing alternatives to the item they just added reopens a decision they have closed.

---

---

## 4. How to choose what to build first

Not every store should build all three at once. Work down this list and stop when you've covered your biggest gap.

1. **Do shoppers add one item and leave?** Start with complementary blocks in the cart, such as "frequently bought together" and bundle offers. These raise order value without needing any personal data.
2. **Do shoppers bounce from product pages without choosing?** Add related recommendations beside the product, so the next-best option is one click away.
3. **Do you have many returning visitors?** Add a personalized "For you" section on the homepage, because it uses repeat behaviour that you only have for returning shoppers.
4. **Do you have a premium version or an obvious add-on?** Offer it as a clearly labelled upsell on the product page, where the shopper is comparing, not in the cart.

If your catalogue is small, hand-picked related and complementary products often work as well as an automated engine, and are easier to keep sensible. This is craft guidance and worth testing against your own results.

---

---

## 5. The data behind each type

The reference article's central point is that recommendation engines work from customer data and behaviour, such as purchase history, browsing patterns and demographics, and can update suggestions in real time. A few practical consequences:

- **Related needs good product data.** If attributes and categories are messy, similar-product suggestions will be messy too.
- **Complementary needs purchase pairs.** A new store with few orders has little to learn from, so start with hand-made pairings.
- **Personalized needs behaviour signals.** The article notes that many retailers have low registration rates, so it matters whether the system can work for anonymous visitors. It says some AI-powered tools, such as Coveo, do this by reading behaviour rather than requiring a login. That is a vendor claim, so check it against a demo of your own data.
- **Techniques vary.** The article describes one example, matrix factorization, which looks for hidden patterns across customer interactions and product attributes. You don't need to know the maths, but ask any vendor what signals they use and how they handle new products and new visitors.
- **Plan a fallback.** When there isn't enough data for a new visitor or a new product, show best sellers or a curated set instead of an empty or random block. This is our craft guidance.

![2](https://bloggallery.s3.us-west-2.amazonaws.com/Zenbasket%20Docs/2_1791280248337.png)

---

---

## 6. Design rules

Everything here is craft guidance, not research. Treat numbers as starting points to test.

- **Label by promise.** "Frequently bought together" tells the shopper why each item appears. "Recommended for you" tells them nothing. Honest labels build trust and clicks.
- **Keep the set short.** A handful of items is easier to compare than a long carousel. Start at four to six and test.
- **Match the card to the product card.** Same image ratio, price format and rating style as the rest of the store, so recommendations feel native, not like ads.
- **Never recommend what is already in the cart or out of stock.** This is the quickest way to look careless.
- **Price sanity.** Complementary items should feel like small additions. An accessory costing more than the main product feels like a trick.
- **Upsell where people compare.** The article suggests recommending premium versions or add-ons to raise order value. Place that on the product page, not in the cart.
- **Make carousels usable.** Show a partial next card so people see there is more, provide arrow buttons that work with a keyboard, and give images text alternatives.
- **Keep it light on mobile.** A swipeable row with a clear heading works better than a long stacked list.


---

---

## 7. What breaks recommendations

| Failure | How it shows up | Fix |
|---|---|---|
| One box for everything | "You may also like" mixes alternatives, add-ons and personal picks | Separate by job and label each by what it promises |
| Wrong moment | Alternatives shown in the cart, add-ons shown before the shopper has chosen | Related on product page, complementary at product and cart |
| Fake personalization | A "For you" label on best sellers everyone sees | Call shared lists "Best sellers", and keep "For you" for behaviour-based picks |
| Repeat suggestions | Recommends something already bought or in the cart | Exclude purchased and carted items |
| Cold-start gaps | Empty or random blocks for new visitors and new products | Fall back to best sellers or curated sets |
| Bad product data | Similar-product box shows unrelated items | Clean attributes and categories first |
| Too many widgets | Four recommendation rows on one page push the main content away | One or two per page, each with a clear job |
| Slow loading | Blocks pop in late and shift the layout | Reserve space and load below the fold |

---

---

## 8. Knowing whether yours works

The reference article lists the expected benefits (more sales, higher average order value, better customer satisfaction and loyalty) but gives no figures. Don't borrow anyone's numbers. Measure your own:

- **Click-through rate per widget.** Compare related, complementary and personalized blocks separately, not as one number.
- **Add-to-cart from each widget.** A click that doesn't lead to a basket is curiosity, not conversion.
- **Average order value** for sessions that used a recommendation versus those that didn't.
- **Revenue per session** after you add or change a block.
- **Returns on recommended items.** A rise suggests the suggestions are misleading.
- **One change at a time.** Test a single block or label, then move on.

---

---

## 9. Building it in ZenBasket

In ZenBasket, recommendations are set up from your product catalogue, not dragged into a page. Most of the work happens under Products and [Plugins](https://help.getzenbasket.com/plugins/), and every tool below is curated: you choose the products yourself. In the help pages we checked, we did not find a feature that picks products automatically from each shopper's behaviour, so confirm with ZenBasket before promising a true "For you" block.

### What this guide asks for, and what to use

| This guide asks for | ZenBasket tool | Where shoppers see it |
|---|---|---|
| Related: a better option than the product in view | [Related Products](https://help.getzenbasket.com/products/related-products/), Upsell Products type | Product detail page |
| Complementary: add-ons that go with it | [Related Products](https://help.getzenbasket.com/products/related-products/), Cross Sell Products type | Product detail page |
| Complementary with a bundle price | [Frequently Bought Together](https://help.getzenbasket.com/products/frequently-bought-together/) | Product detail page, beside the main product |
| Homepage picks (curated, shared by everyone) | [Featured Products](https://help.getzenbasket.com/products/featured-products/) | "Featured Products" section on the home page |
| Homepage routing by category | [Featured Categories](https://help.getzenbasket.com/products/featured-categories/) | "Top Categories" section on the home page |
| Comparing alternatives side by side | [Product Comparison](https://help.getzenbasket.com/products/product-comparison/) (paid plugin) | Storefront, as a page or popup |
| Personalized "For you" | Not found in the help pages we checked | Confirm with ZenBasket |

### Set up each tool

#### Related Products (upsell and cross-sell)

1. Go to Plugins, search for "Related Products" and click Activate.
2. Go to Products > All Products, then choose Related product under More actions.
3. Pick Upsell Products or Cross Sell Products.
4. Click + Add, search for the products, tick them and click Save.
5. Optional: click Link Back so the link works both ways. Disable Link Back removes it.

**Watch for:** the settings apply to the base product across all its variants. The block's title ("You might also like" or "Customers also bought") depends on your theme. ZenBasket's own [help page](https://help.getzenbasket.com/products/related-products/) suggests 3 to 6 well-chosen products, which fits the "start small and test" advice in section 5.

#### Frequently Bought Together

1. Turn on the Frequently Bought Together toggle under Plugins.
2. Go to Products > All Products, choose More Actions, then Frequently Bought Together.
3. Click Add, search for products and add them to the list.
4. Optional: give each product a fixed or percentage discount. It cannot exceed the product's selling price.
5. Switch on the Active toggle and click Save.

**Watch for:** it works only with physical products, not custom sell or subscription products. Shoppers must select every product in the list to get the discount. Quantities can't be changed at checkout, and automatic discounts don't apply to these products. See [Frequently Bought Together](https://help.getzenbasket.com/products/frequently-bought-together/).

#### Featured Products and Featured Categories

1. Go to Products > [Featured Products](https://help.getzenbasket.com/products/featured-products/) (or [Featured Categories](https://help.getzenbasket.com/products/featured-categories/)) and click Add Featured Products (or Add Featured Categories).
2. Select items with the + button or by ticking several, then click Save.
3. Use the drag-and-drop icon to set the order.

**Watch for:** featured products must have availability enabled. Removing an item only hides it from the section; it stays in your catalogue. Sub-categories can be featured like parent categories.

#### Product Comparison

1. In Plugin Lists, search for "Product Comparison", click Activate and open its settings.
2. Set the Add to Compare Text and Remove from Compare Text, and choose All Category or Specific Categories.
3. Choose to show the comparison as a Page or Popup, and optionally turn on Show only Differences.
4. Pick the attributes to show (for example selling price, MRP, reviews) and the maximum number of products to compare.
5. Switch on Show Compare Products under Website Features.

**Watch for:** customers can compare 2 to 5 products, depending on your plan. Add specifications under Products > [Product Specification](https://help.getzenbasket.com/products/product-specification/) first, or the comparison will have little to show. See [Product Comparison](https://help.getzenbasket.com/products/product-comparison/).

### Where this guide and ZenBasket differ

- **Cart placement.** Earlier we recommend complementary blocks in the cart. The ZenBasket help pages we read show Frequently Bought Together and Related Products on the product detail page only, and don't describe a cart recommendation block. Check your theme before planning one.
- **"Related" means higher-end here.** ZenBasket defines Upsell as a higher-end version of a product. That covers "a better option", but the help page doesn't describe a separate setting for like-for-like alternatives at a similar price.
- **Link Back needs care.** Two-way links suit cross-sell pairs, such as a phone and its case. For upsell, a two-way link would show the premium product's page a cheaper item, which can work against you. This is craft guidance, so test it.
- **Featured is not personalized.** Featured Products shows the same list to everyone. Label it "Best sellers" or "Featured", not "For you".

New to the builder? Start with [Getting started](https://help.getzenbasket.com/zenbasket-builder/getting-started/). Check the storefront on mobile before you publish, because recommendation rows are often where small screens go wrong.

---

---

## 9. Frequently asked questions

### What is the difference between related and complementary products?
Related products are alternatives to the item being viewed, for shoppers still deciding. Complementary products are additions that go with it, for shoppers who have decided. They answer different questions and belong at different moments.

### What does "personalized" actually mean in recommendations?
It means suggestions based on the individual shopper's behaviour, such as browsing patterns, purchase history and demographics, rather than on the product alone. A list of best sellers shown to everyone is not personalized.

### Where should I place product recommendations?
Personalized sections on the homepage, related products and a premium upsell on the product page, complementary items in the cart, and curated lists such as best sellers and new arrivals on category pages.

### Can I personalize for visitors who haven't registered?
Some tools infer preferences from behaviour without a login. Many retailers have low registration rates, so ask any vendor how it handles anonymous visitors, and test it on your own traffic.

### What goes in the cart page?
Complementary suggestions: frequently bought together, complete-the-look and bundle deals. Avoid alternatives to what the shopper has already chosen.

### How many recommendations should I show?
Enough to compare without overwhelming. Four to six is a reasonable start. This is a starting point to test, not a rule.

### Do I need an AI engine to start?
No. A small catalogue can work well with hand-picked related and complementary pairs. Automation helps most as your catalogue and order history grow.

### What should I show when there isn't enough data?
A fallback, such as best sellers or a curated set, rather than an empty or random block.

### How do I know if recommendations are working?
Track click-through, add-to-cart and order value for each block separately, plus returns on recommended items, and test one change at a time.

---