Place the Flow widget

After publishing an Advice flow, place the Flow widget on the webshop pages where visitors need help choosing.

Where to configure this

• Share & Publish: publish and copy the Flow widget code.
• Team -> Allowed embed domains: allow webshop domains and set the webshop platform.
• Styling: check the public look before rollout.
• Settings -> Tracking: enable external tracking when needed.

Choose placement and mode

Start on the page where visitors already make a choice.

• Category page: useful when visitors compare many products.
• Buying guide page: useful when visitors first need advice.
• Product page: useful when visitors should check whether one product fits.

Choose Inline for page content, Pop-up for a button and Sidebar when the page should stay visible.

Add the widget code

Copy the code from BerryPath when you can. It already contains the right values for the published Advice flow.

Basic inline example:

<script async src="https://www.berrypath.eu/embed/berrypath.js"></script>

<div
  data-berrypath-flow="YOUR_FLOW"
  data-berrypath-type="inline"
></div>

For a pop-up or sidebar, use a button and set data-berrypath-type to popup or sidebar.

When one page has multiple Flow widgets, add the script once and repeat only the widget element or button.

Use platform plugins

Magento, Shopware and WooCommerce stores can use a plugin or module instead of placing every Flow widget by hand.

Set the webshop platform in onboarding or Team so Share & Publish opens with the right platform selected by default.

• Magento module docs
• Shopware plugin docs
• WooCommerce plugin docs

Allow the webshop domain

Only allow domains where the Flow widget should load.

1. Open Team.
2. Go to Allowed embed domains.
3. Add the webshop domain, for example example.com.
4. Add subdomains separately when needed.

Pass product, language or market

For product pages, pass the current Product ID:

data-berrypath-product-id="YOUR_PRODUCT_ID"

For translations or market feeds, copy the right version from Share & Publish or add:

data-berrypath-locale="nl"
data-berrypath-market="aurora-de"

Use the same Product IDs and market codes as in product data.

Measure completed orders

Add the conversion measurement code from Share & Publish on the order confirmation page.

<script src="https://www.berrypath.eu/embed/berrypath.js"></script>
<script>
window.BerryPath.conversion({
  order_total: 129.95,
  items: [{ product_id: "PRODUCT_ID" }]
});
</script>

Use the same Product IDs as in product data. Do not send personal visitor data.

Test before rollout

1. Open the webshop page in a private browser window.
2. Check that the Flow widget opens without a login page.
3. Complete the Advice flow and review recommendations.
4. Test mobile and desktop.
5. Check analytics after the first visits arrive.

If the Flow widget does not load on a strict webshop setup, ask your developer to allow the domain from the copied Flow widget code.