Webflow

You will install the snippet site-wide through Webflow's custom code settings, then record purchases on the Webflow Ecommerce order confirmation page.

Custom code requires a paid Webflow site plan: it is not included on the free Starter plan. Custom code also only runs on the published site, never inside the Designer preview.

Install the snippet

Your snippet comes from Project Settings → Snippet in the A vs B dashboard:

The Snippet tab in Project Settings, showing the snippet ready to copy with a Copy button, and a live installation status badge. — Copy your snippet from Project Settings → Snippet.

HTML

<script>window.avsb=window.avsb||{};window.avsb.q=window.avsb.q||[];window.avsb.ready=window.avsb.ready||function(f){window.avsb.q.push(f)};window.avsb.on=window.avsb.on||function(n,f){var t=['on',n,f];window.avsb.q.push(t);return function(){t[0]=null}};window.avsb.consent=window.avsb.consent||{set:function(s){window.avsb.q.push(['consent.set',s])},get:function(){return{}}};window.avsb.track=window.avsb.track||{};['event','segment','purchase','cart'].forEach(function(m){window.avsb.track[m]=window.avsb.track[m]||function(a,b){window.avsb.q.push(['track.'+m,a,b])}});(function(){window.avsb._t0=Date.now();window.avsb._df=fetch('https://cdn.avsb.cloud/YOUR_SNIPPET_KEY/datafile.json').catch(function(){});var d=document,e=d.documentElement,s=d.currentScript,a=s&&s.getAttribute('data-avsb-timeout'),t=a==null?3000:+a;if(!(t>0)||window.avsb.version)return;e.style.opacity='0';e.style.pointerEvents='none';window.avsb._t=setTimeout(function(){e.style.removeProperty('opacity');e.style.removeProperty('pointer-events')},t)})();</script><script src="https://cdn.avsb.cloud/snippet.js?id=YOUR_SNIPPET_KEY" data-avsb="YOUR_SNIPPET_KEY" async></script>

HTML9 lines

The first tag is a stub that makes avsb.ready(...), avsb.on(...) and avsb.consent.set(...) calls safe before the bundle loads. Paste both tags into the Head code box.

Open site settings

In your Webflow dashboard, open your site's Site settings and go to the Custom code tab.

Paste into Head code

Paste the snippet tag into the Head code box. Webflow injects this into the head of every page.

Save and publish

Click Save, then publish your site. Check Project Settings → Snippet in A vs B: the badge turns green and reads Installed once your published site sends its first page view.

Record purchases (Webflow Ecommerce)

Webflow does not push a purchase event to a dataLayer, so record purchases with an explicit avsb.track.purchase call on the Order confirmation page.

Bind order fields to elements

In the Designer, open the Ecommerce Order confirmation page. Add (or reuse) text elements bound to the order's Order ID and Total fields, and give them IDs like avsb-order-id and avsb-order-total in the element settings panel. You can style them to fit the page: they just need to exist in the markup.

Add page-level footer code

Still on the Order confirmation page, open the page settings and paste the script below into Before body tag code. It reads the bound values and reports the purchase.

Publish

Publish the site and place a test order.

HTML

<script>  window.addEventListener('load', function () {    var idEl = document.getElementById('avsb-order-id');    var totalEl = document.getElementById('avsb-order-total');    if (!idEl || !totalEl || !window.avsb) return;    var total = parseFloat(totalEl.textContent.replace(/[^0-9.]/g, ''));    if (!total) return;    window.avsb.track.purchase({      orderId: idEl.textContent.trim(),      total: total,      currency: 'USD' // your store currency: ISO 4217    });  });</script>

HTML16 lines

orderId and total (a decimal, for example 49.99) are required; currency is optional and defaults to your A vs B project's configured currency. Orders are deduplicated by orderId with last-write-wins, so a buyer refreshing the confirmation page never double-counts.

The total bound on the confirmation page is a formatted price (with a currency symbol). The example strips non-numeric characters before parsing: if your store formats prices with comma decimal separators, adjust the parsing accordingly.

Verify

Open Commerce → Orders in the A vs B dashboard to confirm your test order arrived. Then check it was credited to an experiment exposure, the moment a visitor is counted in a test. See the orders & attribution guide for the details.