Product Wizard — Placement (Floating Button, Page Block, Link)

The wizard opens in three ways: a floating button in the corner, a block inside a page and a shareable link. Visibility rules show the button only on…

Where to find: Product Wizards → a wizard → Placement tab · Theme Editor → Product Wizard block Who it's for: Anyone who decides where, to whom and when the wizard appears on the storefront In short: The wizard opens in three ways: a floating button in the corner, a block inside a page and a shareable link. Visibility rules show the button only on the pages and devices you want.

Screen layout

The Placement tab is a regular settings page: cards on the left, a Live preview on the right. The preview also shows changes you haven't saved yet. Save with the Save button at the bottom of the page; Reset form returns to the last saved state.

Warning: Placement settings reach the storefront right away; no Publish is needed. (If the wizard itself is not live, the button does not appear either.)

1. Floating button

A button in the bottom-right or bottom-left corner of the storefront, right above WhatsApp and the other floating buttons. When clicked, the wizard opens in a popover window on desktop (above the button, growing upwards) and in a bottom sheet on mobile.

Field	Description
Show the floating button	When off, the wizard only opens from a page block or a link.
Position	Bottom right or Bottom left
Shape	Circle or Rounded
Size	Automatic (your store's floating button size — it lines up with the WhatsApp button), Small (40 px), Medium (52 px), Large (64 px)
Content	Icon (sparkles, magic wand, gift, compass, magnifier, question mark, message bubble, heart), Image (a square image such as a logo) or Video bubble (a short, muted, looping MP4)
Button color / Icon color	If empty, Use the store's primary color
Label bubble	A short call-to-action next to the button ("Discover your scent"). Bubble text, Delay (s), Let visitors close the bubble.
Screen reader label	Read out as the button's name to visually impaired visitors. If empty, "Open product wizard" is read.
Priority	If buttons of several wizards match the same page, the one with the highest priority is shown (−1000 to 1000).

Tip: The video bubble stops for visitors who prefer reduced motion; they see a still button.

FAQ: Can the wizard and live chat be open at the same time? No. While the wizard window is open, the live chat button is hidden; if live chat is opened, the wizard closes. They never cover each other.

FAQ: What if the customer closes the window and opens it again later? The answers are kept in the browser for the Resume window (Wizard settings, 30 minutes by default). When the customer opens it again, they are asked "Would you like to continue where you left off?": Continue where I left off or Start over.

2. Visibility rules

Decide on which pages, on which devices and when the floating button appears. Page blocks and links are not affected by these rules.

Rule	Description	Example
Page types	All pages, Home page, Category pages, Product pages, Cart, Other pages. With "All pages" selected, the others are ignored.	Only home + category
Specific categories	On category pages only in these categories, on product pages only for products in these categories.	Perfume category
Specific products	On product pages only for these products (or products in the categories next to it).	Top 10 best-selling perfumes
Show if the address contains	Shown on pages whose address contains one of these (at most 20 patterns, add with Enter).	`/campaign`
Hide if the address contains	Hidden on pages whose address contains one of these.	`/blog`
Device	All devices, Mobile only, Desktop only
Delay (s)	How many seconds after the page opens it appears.	5
Scroll (%)	How much of the page must be scrolled; 0 means immediately.	30
Hide after completion (days)	Visitors who completed the wizard don't see the button for this many days; 0 always shows it.	7

Warning: The button is never shown on checkout pages. This is not a setting; it is a fixed storefront rule so that nothing distracts from the payment flow.

3. Opening

The size of the window the wizard opens in (applies when opened from the button and the link):

Field	Options
Desktop window width	360 px, 400 px, 440 px — a wide window is recommended for image-heavy options or product cards.
Mobile sheet height	At most 70%, 80% or 92% of the screen height; the sheet is shorter if the content is short.
Show the header bar	The wizard icon, name and close button at the top of the window.

Tip: On a short screen (for example while the cookie notice is open), the window moves down a little so that the options stay visible; it returns to the button by itself when the notice closes.

4. Page block (in the theme editor)

To show the wizard full width inside a page:

In the Page block card of the Placement tab, click Add in the theme editor (or open Storefront → Theme Editor).
Open the page where you want the wizard (home page, a custom page or the product page template).
Add a block and choose the Product Wizard block.
In the right panel, choose your wizard in the Wizard field. (The block does not change the wizard's content; the Edit wizard link takes you to the builder.)
Adjust the settings and publish the template.

Block setting	Description
Layout	One question (one question at a time, progress at the top) or Accordion steps (numbered steps; a completed step folds into a "Question: answer · Change" line)
Content width	Narrow (560 px), Medium (720 px), Wide (960 px), Full width
Alignment	Left, centre or right
Show title	The wizard name is shown above the block.
Sticky summary bar	(Accordion only) the given answers stay visible at the top while scrolling; scrolls horizontally on mobile.
Motivation badges	"Last step", "One step to go", "Almost done". Not shown if badges are off in the wizard settings.
Show option counts	On steps with counts enabled, the number of products is shown under each option. If you turn it off, counts never appear in this block.

The wizard's first question loads together with the page (search engines see it too); the next steps load as the customer moves on.
The block remembers the wizard by its ID: it keeps working even if you rename the wizard or change its link name.
If the wizard is not live, the block does not appear at all on the storefront; the theme editor shows a "not live; not visible on the storefront" notice.

Templates using this wizard: The Page block card lists the templates the wizard is used in: Live, Draft only or Block hidden. Click a template name to open it in the theme editor.

Warning: In the accordion layout, if you Change an earlier answer, later answers that are no longer valid with the new answer are cleared and the customer is told how many were cleared.

5. Link

To open the wizard from any menu, banner, social media post or campaign email:

Field	Description
Wizard link	An address like `https://yourstore.com/?sihirbaz=scent-compass`. Copy it with Copy.
Link name	The short name in the address. Lowercase letters, digits and hyphens.

You can add the parameter to any page address of your store: if you add ?sihirbaz=scent-compass to the end of a category page address, that page opens and the wizard starts on top of it. The parameter is removed from the address bar once the wizard opens.
The link opens the wizard even if the floating button is off.
The link doesn't work while the wizard is a draft or paused; the card warns you.

Warning: If you change the Link name, old links stop working. Don't change it if you have already shared the address.