Back to widget install

Site-level footer code

Install Harlo on Webflow

Add Harlo through Webflow Site settings so it loads on the published site, or add it to only one page when needed.

Webflow

Custom code area

Ready

Placement

Footer / Body end

Scope

All pages or selected high-intent pages

Publish

Save changes, publish, then test live

Harlo snippet
<script src="https://www.harloai.co/widget.js" data-harlo-organization="YOUR_ORGANIZATION_ID" async></script>

Before you start

Get the install ready

You do not need to write code for this install. Copy the Harlo snippet from your dashboard, paste it exactly where the guide says, then publish your site.

Copy the Harlo install code from Dashboard -> Widget.

Make sure the Webflow site has custom code available on its site plan.

Decide whether Harlo should load site-wide or only on selected pages.

Step by step

Add Harlo in Webflow

1

Open Site settings

From the Webflow dashboard, choose the site and open Site settings.

2

Go to Custom code

Choose the Custom code tab. Use site-level custom code if Harlo should appear on every page.

3

Paste in Footer code

Paste the full Harlo code into Footer code so it loads after the page content.

Use page-level custom code only if Harlo should appear on a specific page.
Paste the snippet exactly as copied.
Avoid placing the snippet inside a Designer embed element unless you only need Harlo on that one page area.
4

Save and publish

Save the custom code changes and publish to staging or production. Webflow custom code usually needs a published page before it works fully.

5

Test route changes

Open the live site, visit a few pages, and confirm the Harlo chat button stays available where expected.

Verification

Confirm the widget is live

1

Publish, then open the staging or production URL.

2

Check a static page and a CMS page if the site uses CMS templates.

3

Ask a test question and confirm it appears in Harlo.

Troubleshooting

Fix the usual issues

The widget is missing in Designer preview

Publish to staging or production and test there. Some custom code does not fully run in the Designer.

CMS pages do not show Harlo

Use site-level Footer code for all pages, or add the snippet to the CMS template's custom code area.

Only one page should have Harlo

Move the snippet from Site settings to that page's custom code field.