klaviyo-back-in-stock
Klaviyo back-in-stock form, in a dialog or popover, for the current variant.
At a glance
dialog
A dialog over the page
- Built with
- A Custom element with the tag
dialog. - Opens
- With the button that has
type="button". - Closes
- Escape, or a click outside the first element inside the dialog. Keep everything in one Div block inside it.
popover="auto"
A popover by the button
- Built with
- A Div block with the custom attribute
popoverset toauto, in place of the dialog. - Opens
- With the same button,
type="button". - Closes
- Escape, a click outside, or its own close button.
More in the guide.
Where it can go
- Inside
smootify-product. - Must contain
form,button[type="button"]. - Must contain one of
dialog,[popover]. - Out of place, Smootify removes it from the page: also without data-company-id.
What it requires
Nothing beyond Smootify: it works on every plan.
Fields in the form
Each field’s Name setting in Webflow tells Smootify what the field holds. It is a setting of the field, not a custom attribute.
| Name | Field | What it does |
|---|---|---|
email (any case), else the first input[type="email"] | Text field, Text field, Type Email | Required (“Invalid Email” without it). The address Klaviyo alerts (Webflow’s default Email field works: data-name="Email"); every other field is ignored. |
Attributes on the element
- It reads
data-company-id.
Loading
Its code loads only on pages that have klaviyo-back-in-stock.