Skip to content
Pengo Help Center
Browse all guides

Install Pengo on Webflow

Add the Pengo chat widget to your Webflow site by pasting one snippet into your site's footer code, then publishing. Takes about five minutes.

Install the widget 1 min read Updated
On this page

On Webflow, you add Pengo once in your site’s settings and it appears on every page. The snippet goes in the footer code, which Webflow adds to the end of each page when you publish.

#Add the snippet to your site

  1. Open your site’s settings.

    From the Webflow dashboard, open the site’s settings. In older versions of Webflow this page is called Project Settings, newer versions call it Site settings.

  2. Open the Custom Code tab (labelled Custom code in newer versions).

  3. Paste the snippet into the Footer Code 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 Save Changes.

  5. Publish your site.

    Custom code only goes live when you publish. Publish to every domain you use, including your webflow.io address if you test there.

  6. Open the published site in a new tab. The chat bubble appears in the corner.

#Check that it works

Look for the bubble on the published site, not in the Designer, 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

Why don't I see the chat in the Webflow Designer?

Webflow doesn't run custom code inside the Designer. Publish the site and check the live or webflow.io address instead.

Can I add the chat to only some pages?

Install it site-wide, then choose the pages it shows on in Pengo's widget settings. See the visibility and branding guide.

Was this guide helpful?

Your answer helps us improve it.

Related guides

Install the widgetVerify your installationInstall the widgetInstall Pengo on any website (HTML)Getting startedAdd Pengo to your website