Recommended products

Layout, content and available controls for Recommended products.

Scale Theme · v1.9.3 · 1 min read

Where to find it

Add this section from the theme editor on a supported template.

Usage notes

Complementary products must be set up using the Search & Discovery app. [Learn more](https://help.shopify.com/manual/online-store/search-and-discovery)

Editor controls

Conditional controls appear after choosing the relevant source, style or option. Saved values may differ from new defaults.

Display section ID: ID is used in the Sections group section to create anchor links. Toggle on to show a copy button on this section.
Display on: Choose the presentation or source that fits this component.Options: All devices · Desktop only · Mobile only
Color source: Theme colors follow Theme settings > Colors. Other sources apply only to this section.Options: Use theme colors · Choose a color scheme · Set custom colors
BackgroundConditional: Choose a local color when the relevant custom source is enabled.
Text and cardsConditional: Choose a local color when the relevant custom source is enabled.
BordersConditional: Choose a local color when the relevant custom source is enabled.
Product: Select a real product from this shop.
Type: Choose the presentation or source that fits this component.Options: Related · Complementary
Style: Choose the presentation or source that fits this component.Options: Grid · Carousel
Carousel on mobileConditional: Enable or disable this option and preview the result.
Product count: Adjust within the range offered by the theme editor.
Columns: Adjust within the range offered by the theme editor.
Mobile columnsConditional: Choose the presentation or source that fits this component.Options: 1 · 2
Horizontal gapConditional: Adjust within the range offered by the theme editor.
Vertical gapConditional: Adjust within the range offered by the theme editor.
IconConditional: Choose the presentation or source that fits this component.Options: Arrows · Chevrons · Large arrows · Large chevrons · None
Icon backgroundConditional: Choose the presentation or source that fits this component.Options: None · Circle · Square
Width: Choose the presentation or source that fits this component.Options: Page · Full
Gap: Adjust within the range offered by the theme editor.
Color schemeConditional: Choose an available Shopify color scheme.
Top: Adjust within the range offered by the theme editor.
Bottom: Adjust within the range offered by the theme editor.