Composerie supports three storefront configurations for connected products. Their availability and placement depend on the product setup, installed theme integration, and app-proxy configuration. Preview the published product in the active theme before making it available to shoppers.
The three modes at a glance
You set the mode in the connected-store card on a product. There are three choices, and each one changes what the shopper sees on your storefront.
Linked (no widget). This mode does not add a visible customizer component for shopper input. It can suit catalog products with a configured variant-to-design mapping, but you should still preview the product page and verify the resulting cart and order data.
On-page customizer. A compatible theme placement can show personalization controls and a preview on the product page. Its exact location and layout depend on the theme and app-block placement.
Full-page customizer. With a working app-proxy route and product-page entry point, a shopper can open a dedicated customizer and then return to the purchase flow. Test the full navigation, cart, and checkout path on the published theme.
The configured mode is stored per product. Use the options currently shown for that product in the connected-store area as the source of truth, because eligibility can differ by setup.
How to choose a mode
The right mode depends on whether the shopper needs to type or upload anything, and on how much room your product page has.
Pick Linked when the product has no fields for the shopper to fill in and you only need the correct design attached to the order. Linked shows no customizer UI at all, so it suits ready-made designs that vary by variant.
Pick On-page when you want shoppers to personalize without leaving the product page and you have verified a compatible placement in the active theme.
Pick Full-page for richer or multi-step designs after the app proxy and product-page entry point have both been configured and tested.
Two guardrails decide whether a mode is available:
- Linked is greyed out when the product has personalization fields. Linked renders no interface, so a shopper would have no way to fill those fields in. Hover the dimmed segment and you will see a tooltip pointing you to On-page or Full-page instead.
- Full-page is greyed out until a proxy route is configured. Full-page sends shoppers to a customizer page served on your own domain through the Shopify App Proxy. Until that route is set up on the publication, the option stays disabled, with a tooltip telling you to configure the proxy route first.
If you have not made Composerie visible on your store yet, start with make Composerie visible on your store. To learn how the customizer block sits in your theme, see the customizer theme block.
A note on older mode names
If you have read older Composerie material, you may see modes called Mode 0, 0+, A, B, C, or D. Those names are retired. Do not look for them in the dashboard.
Today there are three modes you can pick: Linked, On-page, and Full-page. The older Minimal and Options plus Preview variants now both fall under On-page. So if a guide mentions a separate Mode B options-and-preview screen, treat it as the current On-page customizer.
Does the mode I choose affect what reaches the cart and checkout?
The cart data depends on the selected mode, product mapping, theme integration, and completed shopper flow. Place a test order and verify the line-item data required by your fulfillment setup before launch.
Can I change a product's mode later?
Yes. The mode is per product, so you can switch it at any time from the connected-store card. The change applies the next time a shopper views that product.
Why can I only select two of the three modes on one product?
A mode is disabled when it cannot work for that product. Linked is disabled when the product has personalization fields, and Full-page is disabled until a proxy route is configured. Hover the dimmed option to read the reason.
Next
Once you have set a mode, check how the design and variant carry through to checkout in variant sync and checkout.