Add to cart trigger
The Add to cart trigger (Adding to cart in the app) shows a widget when the visitor adds a product to the cart. It's the trigger behind upsell and cross-sell popups ("Complete the look"), free-shipping nudges and post-add offers. You can fire it for any product or only for the products and variants you pick.
Available on: Shopify · Shopify Hydrogen · Wix
How it works
- The visitor adds a product to the cart.
- If you picked specific products, Personizely checks that the added product (and, on Shopify, the variant) is one of them.
- The trigger checks its conditions and the trigger-time rules, then shows the widget.
- The product is added to the cart as usual. What the visitor sees next depends on the platform, below.
Shopify
- Which adds count. Standard product forms on product pages, quick-add forms on collection pages, and product forms that appear later (for example in quick-view windows) are detected. Themes and apps that announce their own add-to-cart events are covered too.
- Themes that stay on the page. If your theme adds to the cart without leaving the page (a cart drawer or notification), the add happens as usual and the widget appears alongside.
- Themes that go to the cart page. If your theme normally sends visitors to the cart page after adding, Personizely adds the product in the background, keeps the visitor on the page while the widget is open, and takes them to the cart page when the widget closes.
- When no widget shows, the add continues exactly as your theme would do it.
Shopify Hydrogen
Your product form calls the function returned by the useCartAdd() hook from @personizely/shopify-hydrogen. It resolves to true when a widget was shown, so your code decides whether to add the product right away or wait. Product and variant filters work as on Shopify. See Install on Shopify Hydrogen.
Wix
The trigger fires when Wix reports that a product was added to the cart. You can pick specific products, but not variants.
Configuration
Option | What it does | Values / default |
|---|---|---|
Any product / Specific products | Fire for every add, or only when one of the selected products is added | Any product by default |
Products (Specific products) | The products, and on Shopify optionally their variants, that fire the trigger. Add them one by one or in bulk by title, path or collection | Product picker |
Conditions: Time spent on current page | Only fire if the visitor has been on the page more (or less) than N seconds; optionally the total time on your site in this session, including the current page | Optional |
Conditions: Max scroll reached | Only fire if the deepest scroll on this page is more (or less) than N% | Optional |
When the widget contains a Products element in Rules mode, the first option reads Products specified in product rules: the widget only appears when its product rules return products for the item just added. With the Replace button action, the widget only appears if a more expensive variant of the added product exists.
Behavior details and limitations
- Upsells need the added product. The Products element's Added to cart item source and Just added item reference use the product from this trigger. They require Adding to cart to be the widget's only trigger.
- Bulk adds are a snapshot. Adding products by collection adds the products in the collection at that moment. Products added to the collection later aren't included.
- Exclude a button. On Shopify, an add-to-cart button with the data-ply-ignore attribute doesn't fire the trigger.
- Personizely's own adds don't fire it. A product added by the Add a product to the cart automation or a Products element doesn't trigger another widget.
- Several widgets can fire on the same add. Each widget with this trigger is checked independently. Use a Widgets interaction rule to stop them from stacking.
- One show per page. After the widget has been shown, the trigger stops until the next page load. A second add on the same page doesn't show it again.
- Custom add-to-cart code. A theme that adds to the cart with its own script, without a product form or an add-to-cart event, isn't detected. Show the widget from that script with ply.showWidget.
Examples
- Accessory upsell: Popup with a Products element in Rules mode ("Customers who add a camera see lenses"), Adding to cart trigger, Products specified in product rules.
- Upgrade offer: Products element with the Replace action, offering the larger size of the item just added.
- Free-shipping nudge: Callout with a Cart progress element, Adding to cart trigger for any product.
Troubleshooting
- Widget never shows on add → the theme uses custom add-to-cart code, or the product isn't in the selected list. Check the console with ?ply_debug=1.
- Visitor isn't taken to the cart page → expected on themes with a cart drawer; the theme's own behavior applies.
- Hydrogen: product is never added → your code skips the add when useCartAdd returns true. Add the product from your code after the widget closes, or add it right away.