Help · Add to Webflow

How to add OhhChats to Webflow

Add the OhhChats chat bubble to your Webflow site via Site Settings → Custom Code. Takes about 5 minutes.

What you'll need

A Webflow project you can edit and publish.
A paid Webflow Site plan — site-wide custom code requires a Basic Site plan or higher (it isn't available on the free/Starter plan).
Your OhhChats snippet (below).

Plan requiredSite-wide custom code needs a paid Site plan (Basic or higher).

Your OhhChats snippet

<script
  src="https://ohhchats.onrender.com/widget.js?siteId=YOUR_SITE_ID"
  data-site-id="YOUR_SITE_ID"
  async></script>

Use your own snippetCopy the exact line from your OhhChats dashboard — it carries your unique site ID (shown here as YOUR_SITE_ID). {{CONFIRM}}: the host above (ohhchats.onrender.com) is the address used in this codebase — confirm the production widget domain before publishing these articles.

Open Site Settings
From your Webflow Dashboard, open your project's Site Settings.
/help/img/webflow-01-site-settings.pngDashboard → Site Settings
Open the Custom Code tab
Click the Custom Code tab.
/help/img/webflow-02-custom-code.pngSite Settings → Custom Code
Paste into Footer Code
Paste your OhhChats snippet into the Footer Code box (this loads just before </body>), then click Save Changes.
/help/img/webflow-03-footer-code.pngFooter Code → Save
Publish
Click Publish and confirm. Custom code only goes live after you publish.
/help/img/webflow-04-publish.pngPublish your site
Check it worked
Open your live site (the published URL) and refresh — the OhhChats bubble should appear in the corner.
/help/img/webflow-05-live-test.pngBubble live on your site