The inline button
A labelled control that sits inside your own content flow instead of a corner of the screen: what you configure, what it inherits, and the rules that differ from a floating widget.
A button is the first engagement widget that renders inside your page rather than against a corner of the viewport. It's a labelled control you place where the question comes up (under an add-to-cart, beside a size table, in a cart summary), and activating it opens the conversation panel.
Button: in the content flow, under the merchant's own call to action.
Create one from Engagement → Widgets → New widget, in the catalog's Inline section. Everything about drafts, going live, versions and taking offline works exactly as it does for the other formats.
Two things it needs that a floating widget doesn't
- A mount point. Its position is a point in your own markup, and you choose how the tag finds it. That choice is the one decision on this page worth taking seriously. See Place an inline button on your pages.
- A label. Required in every language your site has enabled. The editor refuses to save a draft with one missing.
A label is optional on a chat bubble because a round control docked to a corner reads as "chat" with no text. A control sitting inside a product page, among your own buttons, does not: an unlabelled one is indistinguishable from decoration and tells the shopper nothing about what pressing it does.
What you configure
On the Content tab, Text: up to 60 characters per language enabled on your site, required in every one of them. With several languages, a compact language list sits before the field, your site's default language first (see the editor's Content tab). A new button, and any language with no text when the editor opens, starts from "Ask a question" ("Poser une question" in French, "Frage stellen" in German), as an unsaved change. Empty a language and the language list shows a red dot, the field reads "Required in French" under it, beside the character count, and the draft won't save. (The optional First message sits under it.)
A shopper gets the text for their own language, falling back to your site's default language. If neither has text, which only a button published before every language was required can reach, the button doesn't render on that page at all. An empty control among your own buttons says nothing about what pressing it does, so nothing is better than something unlabelled.
On the Placement tab, in the Placement on the page card, under Width and alignment, below the mount point:
| Field | Values |
|---|---|
| Width | Fits its text (the default), or Full width of its container |
| Alignment | Start (the default), Centre or End |
These two decide whether the button reads as part of your interface or as something dropped on top of it: a full-width button under a full-width add-to-cart matches; a content-fitted one beside it doesn't. Alignment has no effect at full width: the editor greys it out and says so, keeping your selection for when you switch back.
On the Appearance tab, a Button card with the same fields as a chat bubble's (icon, fill, icon and label colour, corners, label weight, and under Advanced the border), then Size and shadow. All of them follow your brand until you change them. A button always carries text, so its Icon menu always offers No icon. A button's Size defaults to Medium (56 px), matching the chat bubble rather than the shorter question bar, because it stands next to your own controls.
What it doesn't have
- No position, no offsets, no stacking order. Its position is its mount point. A stacking rank would be meaningless inside your page's own stacking contexts, so it isn't offered and isn't stored.
- No "Show on every page instead". An inline widget needs page types you pick, on the General tab. A new one starts with Home, Category and Product selected. See An inline widget needs page types.
- No font field. The label inherits your page's font, because the button renders in a shadow root whose host sits in your document. That costs no network request, needs no
font-srcin your Content Security Policy, and lets the button blend in. To change it, setfont-familyon the host or on::part(launcher-label). See Style engagement widgets with CSS.
An optional first message
A button can carry a First message (optional), on the Content tab under its text: up to 200 characters per language, optional in every one. When it's set, the shopper's click opens the panel and sends that sentence as their first message, in one action, which is what makes a button next to a specific product, size table or delivery block different from a second chat bubble placed lower down the page.
It follows the same language rule as the label: the shopper's own language, falling back to your site's default. Unlike the label, it's never filled in for you and an empty language never blocks the save. Under an empty language's field, a line reads "Empty, shoppers see the English text" (your default language's name) while the default is written, and "Empty, the conversation opens with no message" once it isn't. Leave every language empty and activating the button just opens the panel, sending nothing.
To fill the other languages from one, use Translate into the other languages, under the label and under this field.
It rides the tag's existing auto-send path (the same one data-iadvize-message uses on a trigger of your own), so if the panel is still loading, the message is sent as soon as it's ready rather than lost.
What a shopper gets
- Activating it opens the conversation panel, through the same path as your own
data-iadvize-opentrigger. There is no second way to open a conversation. - The button stays where it is while the panel is open. A chat bubble and a question bar hide themselves; an inline button doesn't. Hiding it would collapse its box and shove your product page around on every open and close.
- Activating it again while the panel is open does nothing. The panel stays open, and nothing is sent.
- It carries the AI disclosure, like every other surface the tag renders. It's part of the button's accessible name and its
title, and no field you set and no CSS you write removes it. - It's counted. When it scrolls into view, the tag records that this widget was seen, once per widget per browser-tab session. Every widget on the page shares a single request for that. See Web tag performance.
The dashboard preview shows appearance, not placement
The editor's Sample store scene draws the button on a short page excerpt, with a notice under the scene saying "Appearance only, not placement". That's honest rather than lazy: the dashboard cannot read your document, so any position it chose would be a guess rendered as a preview, and you'd discover the truth on your own site, after publishing.
To see where it actually lands, mint a Preview link and switch the scene to Your site: your page loads with your tag active and this draft previewed, and the button appears at its real mount point. That's also what feeds the mount check.
The question bar
How the question bar behaves for a shopper: its resting state with a typewriter, its engaged state with chips, the mobile fold into a bubble, and what each state changes in your measurements.
Starters
A composite inline widget (a heading you can switch off, up to three starter-question chips and a free-text field) that sits inside your own content flow and lets a shopper tap a suggestion or type their own question.