Satisfaction Guarantee

Where to find it

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 · Legacy compatibility

Shopify color schemeConditional

Choose an available Shopify color scheme.

Use Theme ColorsConditional

Apply the global theme colors to this section. When OFF, use custom color settings below.

Show Photos

When disabled, photos will be hidden from the section

Allow Content Overflow

When enabled, polaroid images can extend beyond section boundaries (prevents cutoff)

Shield Icon Style

Choose the presentation or source that fits this component.Options: Original Shield · Filled Shield · Outline Shield · Detailed Shield · Custom SVG

Custom Icon Image

Upload a custom image to use as the shield icon. Will only be used when 'Custom SVG' is selected. If no image is uploaded, custom SVG code will be used instead.

Custom SVG Code

Paste your SVG code here. Will only be used when 'Custom SVG' is selected and no custom icon image is uploaded.

Shield Icon ColorConditional

Choose a local color when the relevant custom source is enabled.

Shield Icon Margin Bottom

Adjust within the range offered by the theme editor.

Accent Text (Part 1)

Edit the text shown by this component.

Heading Text (Part 2)

Edit the text shown by this component.

Description Text

Use the matching control in the theme editor and preview the component before publishing.

Product Name

Edit the text shown by this component.

Heading Text ColorConditional

Choose a local color when the relevant custom source is enabled.

Description Text ColorConditional

Choose a local color when the relevant custom source is enabled.

Benefit Text ColorConditional

Choose a local color when the relevant custom source is enabled.

Checkmark Icon ColorConditional

Color for the checkmark icons next to benefits

Heading Size (Desktop)

Adjust within the range offered by the theme editor.

Heading Size (Mobile)

Adjust within the range offered by the theme editor.

Heading Line Height

Controls the spacing between lines in the heading text

Description Text Size (Desktop)

Adjust within the range offered by the theme editor.

Description Text Size (Mobile)

Adjust within the range offered by the theme editor.

Benefit Text Size (Desktop)

Adjust within the range offered by the theme editor.

Benefit Text Size (Mobile)

Adjust within the range offered by the theme editor.

Description Line Height

Controls the spacing between lines in the description text

Accent Text ColorConditional

Leave blank to use the theme's accent text color

Accent Text Left Margin

Adjust the spacing between the accent text and the regular text

Use Global Accent Typography

When enabled, the accent text will use the global accent typography settings from Theme Settings > Typography > Accent Typography. When disabled, the section-specific settings below will be used.

Use Accent Gradient

Apply gradient effect to the accent text. This will override the solid accent color.

Accent Text GradientConditional

Choose a gradient for the accent text using Shopify's gradient editor.

Accent Text Font Family

Choose a custom font family for the accent text (only used when Global Accent Typography is disabled)Options: Default (Inherit) · System Serif · Georgia Pro · Bodoni Moda · Instrument Serif · DM Serif Text · Nothing You Could Do

Accent Text Font Style

Choose the font style for the accent text (only used when Global Accent Typography is disabled)Options: Normal · Italic

Accent Text Font Weight

Choose the font weight (boldness) for the accent text (only used when Global Accent Typography is disabled)Options: Default (Inherit) · Light (300) · Normal (400) · Medium (500) · Semi Bold (600) · Bold (700) · Extra Bold (800) · Black (900)

Button Text

Edit the text shown by this component.

Button Action

Choose what happens when the button is clickedOptions: Redirect to Product Page · Scroll to Section · Custom URL

Product to Redirect To

Select the product page to redirect to (only used when 'Redirect to Product Page' is selected)

Custom URL

Enter a custom URL to redirect to (only used when 'Custom URL' is selected)

Button style

Choose the presentation or source that fits this component.Options: Existing section styling · Tertiary — animated

Use Global Button Style

When enabled, uses theme's global button styling. Only works if 'Enable Global Button Styling for Sections' is turned on in Theme Settings > Button Styling.

Button Background ColorConditional

Choose a local color when the relevant custom source is enabled.

Button Text ColorConditional

Choose a local color when the relevant custom source is enabled.

Button Font Size

Adjust within the range offered by the theme editor.

Button Font Weight

Choose the presentation or source that fits this component.Options: Regular (400) · Medium (500) · Semibold (600) · Bold (700)

Button Border Radius

Adjust within the range offered by the theme editor.

Button Padding (Vertical)

Adjust within the range offered by the theme editor.

Button Padding (Horizontal)

Adjust within the range offered by the theme editor.

Benefit 1

Edit the text shown by this component.

Benefit 2

Edit the text shown by this component.

Benefit 3

Edit the text shown by this component.

Image 1

Choose an image from your shop. Preview its crop on desktop and mobile.

Image 2

Choose an image from your shop. Preview its crop on desktop and mobile.

Image 3

Choose an image from your shop. Preview its crop on desktop and mobile.

Image 4

Choose an image from your shop. Preview its crop on desktop and mobile.

Image 5

Choose an image from your shop. Preview its crop on desktop and mobile.

Polaroid Size (Desktop)

Width of the polaroid photos (height scales proportionally)

Polaroid Size (Mobile)

Width of the polaroid photos (height scales proportionally)

Image Extension Into Padding

Controls how far images extend into the padding space (100% = aligned with section edge)

Additional Vertical Offset

Adjust images up or down from their calculated position

Content Padding (Mobile)

Horizontal padding on mobile devices

Content Padding (Desktop)

Horizontal padding around content on desktop

Content Width (With Photos)

Width of content area when photos are shown

Content Max Width (With Photos)

Maximum width of content when photos are shown

Content Max Width (No Photos)

Maximum width of content when photos are hidden

Top Padding (Desktop)

Adjust within the range offered by the theme editor.

Bottom Padding (Desktop)

Adjust within the range offered by the theme editor.

Top Padding (Mobile)

Adjust within the range offered by the theme editor.

Bottom Padding (Mobile)

Adjust within the range offered by the theme editor.

Additional Top Padding When Photos Hidden (Mobile)

Extra internal top padding when 'Show Photos' is disabled on mobile

Additional Top Padding When Photos Hidden (Desktop)

Extra internal top padding when 'Show Photos' is disabled on desktop

Section Vertical Padding

Adjust within the range offered by the theme editor.

Section Horizontal Padding

Adjust within the range offered by the theme editor.

Section Vertical Padding (Mobile)

Adjust within the range offered by the theme editor.

Section Horizontal Padding (Mobile)

Adjust within the range offered by the theme editor.

Enable Top Border

Enable or disable this option and preview the result.

Top Border Width

Adjust within the range offered by the theme editor.

Top Border ColorConditional

Choose a local color when the relevant custom source is enabled.

Enable Bottom Border

Enable or disable this option and preview the result.

Bottom Border Width

Adjust within the range offered by the theme editor.

Bottom Border ColorConditional

Choose a local color when the relevant custom source is enabled.

Section BackgroundConditional

Use the matching control in the theme editor and preview the component before publishing.

Background Image (Desktop)

Choose an image from your shop. Preview its crop on desktop and mobile.

Background Image (Mobile)

Optional separate image for mobile devices. If not set, desktop image will be used.

Background Image Position

Choose the presentation or source that fits this component.Options: Center · Left · Right · Top · Bottom

Background Image Size

Choose the presentation or source that fits this component.Options: Cover · Contain · Auto

Background Image Repeat

Choose the presentation or source that fits this component.Options: No Repeat · Repeat · Repeat Horizontally · Repeat Vertically

Contain Section

Add padding and border around the section content

Container Padding

Adjust within the range offered by the theme editor.

Container BackgroundConditional

Use the matching control in the theme editor and preview the component before publishing.

Container Background Image (Desktop)

Background image for the container when Contain Section is enabled

Container Background Image (Mobile)

Mobile background image. If not set, desktop image will be used.

Background Size

Choose the presentation or source that fits this component.Options: Cover · Contain · Auto

Background Position

Choose the presentation or source that fits this component.Options: Center · Top Center · Bottom Center · Left Center · Right Center · Top Left · Top Right · Bottom Left · Bottom Right

Enable Background Image Overlay

Add an overlay over the background image for better text readability

Background Overlay Color

Choose a local color when the relevant custom source is enabled.

Background Overlay Opacity

Adjust within the range offered by the theme editor.

Enable Border

Enable or disable this option and preview the result.

Border Width

Adjust within the range offered by the theme editor.

Border Style

Choose the presentation or source that fits this component.Options: Solid · Dashed · Dotted

Border ColorConditional

Choose a local color when the relevant custom source is enabled.

Border Radius

Adjust within the range offered by the theme editor.

Enable Shadow

Enable or disable this option and preview the result.

Reveal on scroll

Original section reveal. Respects reduced motion and low-capacity devices.