Install a website toolbar with GTM or a direct script

Choose the ownership model first

Direct installation belongs to the site release; GTM installation belongs to the container's governance and publishing workflow.

Use the direct route when developers manage the site template, consent sequencing and production deployment. Use GTM when an established web container already controls approved third-party scripts and the right team can review, preview and publish changes.

Do not choose GTM only to bypass a release or security review. Google recommends clear account administration and container ownership because one published container can affect every domain it serves.

Install the hosted Barra script directly

Add the canonical Barra script to the site's shared template and keep the loading attributes intact.

The current install snippet is `<script src="https://app.barra.ai/Barra.js" async defer></script>`. The browser hostname is used to resolve runtime configuration, so publish the intended domain and configuration in Barra Admin before testing.

MDN documents how `async` and `defer` affect classic scripts. Barra's snippet includes both as the supported install contract; retain the canonical form rather than inventing a new loader.

1. Publish the website domain and toolbar configuration in Barra Admin.
2. Add the canonical script to the shared site template.
3. Deploy the site through its normal review process.
4. Load the public production URL and verify the network request, toolbar and selected actions.

Install through Google Tag Manager

Use a Custom HTML tag, fire it on the intended production pages and publish the container after Preview testing.

Google's web-container guidance requires an installed GTM container and access to the website. Barra then runs as a tag inside that governed container; GTM Preview is a diagnostic step, not the production release.

Preview hosts can expose a different hostname from the saved customer domain. Barra fails closed when runtime config cannot be resolved, so a preview-domain failure does not prove that the production domain is misconfigured. Test the canonical live URL after publishing the container.

1. Confirm the site's GTM web container is installed and owned by the right team.
2. Create a Custom HTML tag containing the canonical Barra script.
3. Choose the required production trigger and review consent dependencies.
4. Use GTM Preview, then submit and publish a named container version.
5. Verify the public production URL after the version is live.

Run the same production checks for both paths

A successful installation proves config resolution, rendering and interaction on the live hostname.

Check that `Barra.js` returns successfully, the runtime config request uses the expected domain and the toolbar matches the published module order. Exercise links, actions, responsive visibility, docked spacing or floating overlay behaviour, and any selected analytics path.

If the toolbar does not render, check that the domain is published, the snippet or GTM version is actually live, the request is not blocked by Content Security Policy and the page is not an unsupported preview hostname. Barra intentionally does not display demo configuration when runtime config is missing.

Further reading

• Persistent mobile actions without covering content
• Barra website toolbar

Sources

1. Install a web container — Google Tag Manager Help
2. Publishing, versions, and approvals — Google Tag Manager Help
3. The script element — MDN Web Docs
4. Install Barra — Barra

Frequently asked questions