Skip to content
Pengo Help Center
Browse all guides

Install Pengo with Google Tag Manager

Add the Pengo chat widget through Google Tag Manager with a Custom HTML tag that fires on all pages. No changes to your site's code.

Install the widget 2 min read Updated
On this page

If your site already runs Google Tag Manager, you can add Pengo without touching your site’s code. You create one Custom HTML tag, set it to fire on every page and publish your container.

#Add a Custom HTML tag

  1. Open your container in Google Tag Manager and go to Tags.

  2. Click New, name the tag (for example Pengo chat) and click Tag Configuration.

  3. Choose Custom HTML and paste the snippet into the HTML box.

    Pengo snippet 
    <!-- Pengo Widget -->
<script>
  (function() {
    // A stub, so pengo('identify', …) and other calls work before the widget has loaded.
    window.pengo = window.pengo || function() { (window.pengo.q = window.pengo.q || []).push(arguments); };
    window.pengo.propertyId = 'YOUR_PROPERTY_ID';
    window.pengo.q = window.pengo.q || [];
    var script = document.createElement('script');
    script.async = true;
    script.src = 'https://app.pengo.chat/embed.js?v=2';
    var firstScript = document.getElementsByTagName('script')[0];
    firstScript.parentNode.insertBefore(script, firstScript);
  })();
</script>

  4. Click Triggering and choose All Pages.

  5. Click Save.

  6. Click Preview to test the tag before it goes live.

    GTM’s Tag Assistant opens your site in a new tab. Check that the Pengo tag is listed under Tags Fired and that the chat bubble appears.

  7. Back in GTM, click Submit, add a version name, then click Publish.

  8. Open your site in a new tab. The chat bubble appears in the corner.

#Things to know

  • Nothing happens until you publish. Saving a tag only changes your workspace. Visitors see the widget after you click Publish.
  • Ad blockers can block GTM itself. If a browser blocks Google Tag Manager, every tag in it, including Pengo, stops loading. Visitors who block GTM won’t see the chat. If that’s a concern, paste the snippet straight into your site instead, using the HTML guide.
  • Calling the API from other tags. You can use pengo(...) calls from other Custom HTML tags. Calls made before the widget is ready wait in a queue. See the JavaScript API.

#Check that it works

Open your site in a private window and look for the bubble, then confirm that Pengo has detected the install. Verify your installation walks through it, with a troubleshooting checklist if the bubble doesn’t show.

#Other platforms

HTML WordPress Shopify Webflow Next.js Wix Squarespace Google Tag Manager

Common questions

Can I install Pengo with GTM and in my site's code at the same time?

Pengo only shows one chat bubble even if the snippet runs twice, but keep one install so there's only one place to change it.

Do I need to set up any variables or consent settings in GTM?

No. The tag only needs the snippet and the All Pages trigger.

Was this guide helpful?

Your answer helps us improve it.

Related guides

Install the widgetVerify your installationInstall the widgetInstall Pengo on any website (HTML)DevelopersJavaScript API