Product Upsell

Placement and available controls for the Product Upsell block.

Scale Theme · v1.9.3 · 1 min read

Where to find it

Open the parent section and use Add block where this block is offered.

Editor controls

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

Layout: Toggle rows use the first available variant. Turning off removes only the line added by this block.Options: Product cards · Compact toggle row
Color source: Theme colors use Color DNA, Color scheme uses a shared Shopify preset, and Custom affects only this block.Options: Theme colors · Color scheme · Custom
Color schemeConditional: Choose an available Shopify color scheme.
Heading and product nameConditional: Choose a local color when the relevant custom source is enabled.
Description and priceConditional: Choose a local color when the relevant custom source is enabled.
Badge and actionConditional: Choose a local color when the relevant custom source is enabled.
Accent textConditional: Choose a local color when the relevant custom source is enabled.
Card borderConditional: Choose a local color when the relevant custom source is enabled.
Card backgroundConditional: Choose a local color when the relevant custom source is enabled.
HeadingConditional: Edit the text shown by this component.
Heading TagConditional: Choose the presentation or source that fits this component.Options: H2 · H3 · H4 · Paragraph
Heading SizeConditional: Adjust within the range offered by the theme editor.
Heading WeightConditional: Choose the presentation or source that fits this component.Options: Normal · Medium · Semi Bold · Bold
Heading ColorConditional: Choose a local color when the relevant custom source is enabled.
Button TextConditional: Edit the text shown by this component.
Button styleConditional: Primary, Secondary and Tertiary inherit from Theme Settings > Buttons. Custom uses the local controls below.Options: Primary · Secondary · Tertiary · Custom
Button Text ColorConditional: Choose a local color when the relevant custom source is enabled.
Button Background ColorConditional: Choose a local color when the relevant custom source is enabled.
Button Border ColorConditional: Choose a local color when the relevant custom source is enabled.
Hover Background ColorConditional: Choose a local color when the relevant custom source is enabled.
Hover Text ColorConditional: Choose a local color when the relevant custom source is enabled.
Hover Border ColorConditional: Choose a local color when the relevant custom source is enabled.
Shadow ColorConditional: Choose a local color when the relevant custom source is enabled.
Button Border WidthConditional: Adjust within the range offered by the theme editor.
Button Border RadiusConditional: Adjust within the range offered by the theme editor.
Button Added State ColorConditional: Choose a local color when the relevant custom source is enabled.
Item Background ColorConditional: Choose a local color when the relevant custom source is enabled.
Item Border ColorConditional: Choose a local color when the relevant custom source is enabled.
Item Border Radius: Adjust within the range offered by the theme editor.
Gap Between ItemsConditional: Adjust within the range offered by the theme editor.
Product Name ColorConditional: Choose a local color when the relevant custom source is enabled.
Product Description ColorConditional: Choose a local color when the relevant custom source is enabled.
Price ColorConditional: Choose a local color when the relevant custom source is enabled.
Compare Price ColorConditional: Choose a local color when the relevant custom source is enabled.
Badge Text ColorConditional: Choose a local color when the relevant custom source is enabled.
Badge Background ColorConditional: Choose a local color when the relevant custom source is enabled.
Show Product 1: Enable or disable this option and preview the result.
Product 1: Select a real product from this shop.
Show DescriptionConditional: Enable or disable this option and preview the result.
Product 1 DescriptionConditional: Edit the text shown by this component.
Show Variant SelectorConditional: Enable or disable this option and preview the result.
Show BadgeConditional: Enable or disable this option and preview the result.
Badge TextConditional: Edit the text shown by this component.
Show Product 2: Enable or disable this option and preview the result.
Product 2: Select a real product from this shop.
Show DescriptionConditional: Enable or disable this option and preview the result.
Product 2 DescriptionConditional: Edit the text shown by this component.
Show Variant SelectorConditional: Enable or disable this option and preview the result.
Show BadgeConditional: Enable or disable this option and preview the result.
Badge TextConditional: Edit the text shown by this component.
Top Margin: Adjust within the range offered by the theme editor.
Bottom Margin: Adjust within the range offered by the theme editor.
Show product review metafieldConditional: Uses reviews.rating and reviews.rating_count only. No sample rating is generated.
Show percentage savingConditional: Calculated from the selected variant compare-at price.
Saving labelConditional: Edit the text shown by this component.
Saving pill backgroundConditional: Choose a local color when the relevant custom source is enabled.
Saving pill textConditional: Choose a local color when the relevant custom source is enabled.
Product image size: Adjust within the range offered by the theme editor.
Card border styleConditional: Choose the presentation or source that fits this component.Options: Solid · Dashed · Dotted · None
Card border widthConditional: Adjust within the range offered by the theme editor.
Add button shapeConditional: Choose the presentation or source that fits this component.Options: Label · Circular plus