> For the complete documentation index, see [llms.txt](https://help.fluorescent.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.fluorescent.co/stiletto/product-pages/product-page-sections/product-recommendations.md).

# Product recommendations

{% hint style="info" %}
Check out similar features like [Complementary products](/stiletto/product-pages/product-page-blocks/complementary-products.md) for the product page and [Cross sells](/stiletto/cart/cross-sells.md) in the cart to show customers related products that they can purchase in addition to the selected product.
{% endhint %}

In the Product template, the **Product recommendations** section displays similar products to customers on product pages. Product recommendations let customers discover new products and can increase sales.

<div data-with-frame="true"><img src="/files/QUprPOueP0DG7xnZJzSp" alt="" width="563"></div>

***

{% columns %}
{% column width="58.333333333333336%" %}

#### Set up section

In the editor side panel, click **(+) Add section** and select **Product recommendations**. Use the drag handles **`⋮⋮`** to re-order sections.

Click the section to edit general **section styles**, like colors, width, padding, and the section header.

{% hint style="info" %}
Editing templates change all pages that use that template. For unique pages, [use new templates](/stiletto/general/editing-themes/using-templates.md#create-and-assign-multiple-templates) or [dynamic metafields](/stiletto/general/adapting-your-theme/dynamic-content-with-metafields.md)
{% endhint %}
{% endcolumn %}

{% column width="41.666666666666664%" %}

#### <mark style="color:$info;">Section style guides</mark>

<table data-view="cards"><thead><tr><th></th><th data-hidden></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><i class="fa-bookmark" style="color:$primary;">:bookmark:</i> <mark style="color:$primary;"><strong>Section header</strong></mark></td><td></td><td><a href="/pages/nxNcI6zBaofEs4kObMMf#section-header">/pages/nxNcI6zBaofEs4kObMMf#section-header</a></td></tr><tr><td><i class="fa-bookmark" style="color:$primary;">:bookmark:</i> <mark style="color:$primary;"><strong>Section colors</strong></mark></td><td></td><td><a href="/pages/ugnuWgDX3bpXquEJrAeA#color-schemes">/pages/ugnuWgDX3bpXquEJrAeA#color-schemes</a></td></tr><tr><td><i class="fa-bookmark" style="color:$primary;">:bookmark:</i> <mark style="color:$primary;"><strong>Section width</strong></mark></td><td></td><td><a href="/pages/nxNcI6zBaofEs4kObMMf#section-width">/pages/nxNcI6zBaofEs4kObMMf#section-width</a></td></tr><tr><td><i class="fa-bookmark" style="color:$primary;">:bookmark:</i> <mark style="color:$primary;"><strong>Padding and divider</strong></mark></td><td></td><td><a href="/pages/nxNcI6zBaofEs4kObMMf#section-padding">/pages/nxNcI6zBaofEs4kObMMf#section-padding</a></td></tr></tbody></table>
{% endcolumn %}
{% endcolumns %}

***

### <mark style="color:$primary;">Product list layout</mark>

You can customize the number of columns on desktop and mobile, as well as the maximum number of products shown.

<table><thead><tr><th width="285.0625">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:$primary;">Maximum number of products</mark></td><td>Set a limit on how many product recommendations to display within the section: between 3 and 15.</td></tr><tr><td><mark style="color:$primary;">Number of columns on desktop</mark></td><td>Choose how many recommendations to show per row on desktop screens: either 3, 4, or 5 columns.</td></tr><tr><td><mark style="color:$primary;">Number of columns on mobile</mark></td><td>Choose how many collections to show per row on mobile screens: either 1 or 2 columns.</td></tr></tbody></table>

## <mark style="color:$primary;">**Customize recommendations**</mark>

Recommendations are automatically generated based on products in related collections, products that are commonly purchased together, or similar product descriptions. Recommendations improve over time with more customer and product information.

You can **customize product recommendations** by downloading Shopify's [Search & Discovery app](https://apps.shopify.com/search-and-discovery).

Download Shopify's [Search & Discovery app](https://apps.shopify.com/search-and-discovery) and learn how to [choose recommended products](https://help.shopify.com/en/manual/online-store/search-and-discovery/product-recommendations) for your store’s product pages.

{% hint style="warning" %}
Using automated recommendations ensures that only in-stock and published products are displayed. **If you manually select recommended products**, make sure your product list is up-to-date.
{% endhint %}

***

> **Related links**
>
> [Product template](/stiletto/product-pages/product-template.md)\
> [Complementary products](/stiletto/product-pages/product-page-blocks/complementary-products.md)\
> [Recently viewed products](/stiletto/sections/theme-sections/recently-viewed-products.md)\
> [Cross-sells](/stiletto/cart/cross-sells.md)