How We Built It

The Collection We Added: related-products

The related-products collection we added has the following fields:

Product A: A reference to a product in the Products collection
Product B: A reference to a product in the Products collection

This collection is where we manually created a relationship between products. Each item in the collection represents two items in the Products collection that we decided should relate to each other. Note that a product may appear in both the Product A and Product B fields.

Displaying Related Products

On the Product page, we created the Related Products area in a repeater that is inside a strip. The repeater is set to display a maximum of four items, and each repeated item has elements that display the related product’s image, name, and price.

When the Product page loads, it tries to find related products in the following ways:

It queries both the Product A and Product B fields in the related-products collection to find any products that are related to the current product.
It queries the Products collection for any products whose price is 20% greater or 20% less than the current product.

If either query returns results, it displays those results in the repeater. If no related products are found, the repeater is hidden.