Google Tag Manager
If your site uses Google Tag Manager (GTM), you can deploy the A vs B snippet as a GTM tag instead of editing your site's code directly. This is handy for teams where marketers manage tags without a developer's help.
Before you start
You'll need access to a GTM container that's already installed on your site. If GTM isn't set up yet, install it first using Google's instructions, then come back here.
You'll also need your A vs B snippet from Project Settings → Snippet in
the A vs B dashboard. It looks like this, with your real key in place of
YOUR_SNIPPET_KEY:
<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>The first tag is a stub that makes avsb.ready(...), avsb.on(...) and
avsb.consent.set(...) calls safe regardless of load order, and hides the page
until the variation is applied. The second loads the bundle asynchronously.
Loading the snippet through GTM means it only runs after GTM itself has loaded, which is normally after the browser has already painted your page. The stub's hide then arrives too late to prevent a flash, and no install method can fix that from inside the tag manager. If you run experiments that change content above the fold, paste both tags directly into your HTML instead. See Anti-Flicker and Quick Install.
Step-by-step
Open your GTM container
Log in to tagmanager.google.com and open the container for your site. Make sure you're in the correct workspace.
Create a new tag
In the left sidebar, click Tags, then click New in the top right. Give the tag a clear name like "A vs B Snippet".
Choose Custom HTML as the tag type
Click Tag Configuration. In the tag type picker, scroll down and select Custom HTML.
Paste the snippet
In the HTML box, paste both A vs B snippet tags shown above, with
YOUR_SNIPPET_KEY replaced by your real key.
Set the trigger to All Pages
Click Triggering and select All Pages. This makes the snippet load on every page of your site. If you only want experiments on specific pages, create a custom trigger for those, but most teams want the snippet everywhere.
Save the tag
Click Save. Your tag is configured but not yet live.
Submit and publish the container
Click Submit in the top right of GTM. Add a version name like "Add A vs B snippet" and click Publish. GTM pushes the updated container to your site.
Verify installation
Go back to Project Settings → Snippet in A vs B. Wait a minute, then check whether the status turned green. You can also verify with GTM's Preview mode; see below.
Testing with GTM Preview mode
Before publishing, use GTM's built-in Preview mode to confirm the tag fires:
- Click Preview in the GTM workspace header.
- Enter your site URL and click Connect. GTM opens your site in a new tab with the debug panel.
- In the debug panel, look for your "A vs B Snippet" tag in the Tags list. It should show a green check and say Fired.
- You can also open your browser's DevTools Network tab and filter by "snippet.js" to confirm the file loaded.
Single-page app considerations
If your site is a single-page application (React, Vue, Angular, and so on), GTM's "All Pages" trigger fires once on the first load; it doesn't automatically re-fire on client-side navigation. See Single Page Apps for how A vs B handles SPA navigation internally (no extra GTM setup needed).