Section reference · Piéra & Émeraude

Product detail explorer

Reveal selected product details through image markers and accompanying text.

Source: theme/sections/product-detail-explorer.liquid

Where to find it

In the theme editor, open the appropriate template and use Add section.

Unavailable in: header, footer section groups.

Images & video

Detail image 4:5, recommended minimum 1800 × 2250 px. Keep the lower third clear for detail text.

Sizes are recommended source minimums, not upload restrictions. Prepare and crop media.

Set it up

  1. Choose a detailed image and add Product detail blocks. Position each marker with percentage coordinates.
  2. Move the image to the selected detail controls the image movement; ensure each description still makes sense without animation.

Read the step-by-step guide →

Section settings

Names match the English theme editor. The installed preset may override schema defaults. A conditional field appears only when its related control is enabled.

Color scheme

color_scheme

Schema default: scheme-2. Presets can override it.

Applies a coordinated set of background, text, accent and button colors.

Recommended: Start with the preset scheme. Check contrast after changing colors or photography.

Eyebrow

eyebrow

Schema default: Look closer. Presets can override it.

Sets the visible eyebrow.

Recommended: Replace demonstration copy with a short, specific label; confirm it makes sense out of context.

Heading

heading

Schema default: Every line has a reason.. Presets can override it.

Sets the visible heading with inline emphasis.

Recommended: Replace demonstration copy with a short, specific label; confirm it makes sense out of context.

Text

text

Schema default: Pair a detailed product image with the construction facts customers care about.. Presets can override it.

Sets the visible text with rich-text formatting.

Recommended: Replace demonstration copy with concise, accurate store content. Avoid unsupported claims and translate it for active languages.

Detail image

image

No schema default; the installed preset may supply a value.

Supplies detail image for this section or block.

Recommended: Use the image dimensions on this page; choose a focal point where supported and inspect the actual crop. Leave optional images blank when they add no value.

Move the image to the selected detail

reveal_zoom

Schema default: true. Presets can override it.

Turns “Move the image to the selected detail” on or off.

Editor note: When a customer opens a detail, the image eases towards its marker. Turned off automatically for reduced motion.

Recommended: Start with the preset choice. Enable only when the relevant content or store feature is configured, then preview the result.

Blocks

Add and reorder supported blocks within this section. Settings below apply to each block instance.

Product detail

Maximum of this block type: 6.

Heading

heading

Schema default: Construction detail. Presets can override it.

Sets the visible heading.

Recommended: Replace demonstration copy with a short, specific label; confirm it makes sense out of context.

Text

text

Schema default: Explain the material, finish, fit, or function shown by this point.. Presets can override it.

Sets the visible text with rich-text formatting.

Recommended: Replace demonstration copy with concise, accurate store content. Avoid unsupported claims and translate it for active languages.

Horizontal marker position

x

Schema default: 50%. Presets can override it.

Range: 5–95%; step 1.

Positions the marker or card horizontally from the left as a percentage of the image.

Recommended: Place it on the actual piece or detail; inspect both screen sizes. Only fields labelled mobile have independent mobile coordinates.

Vertical marker position

y

Schema default: 50%. Presets can override it.

Range: 5–95%; step 1.

Positions the marker or card vertically from the top as a percentage of the image.

Recommended: Place it on the actual piece or detail; inspect both screen sizes. Only fields labelled mobile have independent mobile coordinates.

← All sections · Theme settings · Get support