Measurements & fit (product page block)

A block for the product information section of the product page. It shows only the part of a content source (typically the product description) that follows a marker string, inside an collapsible row — useful for separating the size chart from the marketing copy. An ask-the-concierge field can sit alongside it.

How to add

In the theme editor (admin “Online Store → Themes → Customize”), open a product page and choose “Measurements & fit” from the product information section’s “Add block” menu. Note that this is a block, not a section.

This block belongs to the “Product information” section. On any product template you can add it from Add block in that template’s “Product information” section. The bundled product.focused and product.modern templates do not include it by default, so add it yourself when you want it.

Settings

• Heading: The collapsible row heading (default: Measurements & fit).
• Icon: The icon shown beside the heading (default: ruler).
• Source content: The text the block is based on. Connect product description (product.description) via the dynamic source button on the right.
• Start marker: Show only the part after this text. Leave empty to show all of it. If the marker is not found in the source content, all of it is shown.
• Show an ask-the-concierge field: Shows an input field above the collapsible row (default ON). Appears only on pages where the AI chat is available. The question is sent to the AI chat, and the answer appears in the chat window.

Note

The ask field appears only on pages where chat is available. Without a chat connection the field never appears and the collapsible row works on its own. Enable Hellostore AI Staff through the theme editor’s app embed; manage answers and data in the app. See the Hellostore AI Staff integration guide.

Separating the size chart from the description

Use this block to show only the size chart from the product description:

1. In the product description, insert a unique marker string right before the size chart (for example <!-- size-chart -->)
2. In this block, connect the product description to Source content and enter the same string in Start marker

The size chart after the marker is then shown in this block.