Appearance
Product recommendations
This guide describes setting up the Product recommendations section.
Use the section to display related (recommended) products on a Product page. Refer to Shopify help: Adding a recommended products section. The section's recommendations are generated automatically. To use customized recommendations, refer to Shopify help: Customize product recommendations.
The previous video shows a Product recommendations section on a store's (default) Product page. In the lower left, part of Theme editor's section menu is displayed. The menu's Number of products option is set at 3
. This setting displays 3 recommended products inside the section.
For general guidance with modifying sections, refer to Sections overview, and Shopify help: Sections and blocks.
Set up a product recommendations section
To set up a Product recommendations section:
Go to Customize theme.
In Theme editor, at the top of the page, use the dropdown to select a page that contains a Product recommendations section. For example, select Products > Default product.
Note
The section is available only on the Products > Default product, Products > Split, and Products > Cascade pages.
From the side menu, select Product recommendations.
Select a setting described in the following table.
Setting name | Description |
---|---|
Heading | In the Heading box, enter text to display as a heading (title) inside the section. |
Heading > Insert dynamic source | To display (heading) text from a dynamic source, if available, select the Insert dynamic source icon beside the Heading box, and then choose a metafield to add. Refer to Shopify help: Metafields. |
Number of products | Use the dropdown Number of products to set the total number of items (product recommendations) to display inside the section. The options are: 3 , 4 , 6 or 8 products. |
Carousel > Enable on mobile | Select the checkbox Enable on mobile to turn on/off carousel mode. With carousel mode enabled, the section's product recommendations are displayed as a carousel (slideshow) on mobile devices. Refer to Shopify help: Slideshow. |
Carousel > Enable on desktop | Select the checkbox Enable on desktop to turn on/off carousel mode. With carousel mode enabled, the section's product recommendations are displayed as a carousel (slideshow) on desktop devices. Refer to Shopify help: Slideshow. |
Color > Color scheme | Use the Color scheme options to select a color scheme for the section. Refer to Colors. |
Theme settings | If available, select Theme settings to access additional settings for the section. Refer to Section theme settings menu. |
Custom CSS | Select Custom CSS. In the box, enter custom CSS styles to apply only to the current section. Refer to Shopify help: Add custom CSS. To apply custom styles to your entire online store, refer to Theme settings > Custom CSS. |