Add AuditWidget to Webflow

5 minutes. Use the Embed component — don't touch Custom Code settings unless you want it on every page.

Webflow gives you two ways to add custom code: the Embed component (places the widget inline on a specific page) and Custom Code settings (runs on every page). Use the Embed component. You want the widget on your services page or a dedicated SEO audit landing page, not in the site header.

Get your embed code

<script
  src="https://auditwidget.app/embed.js"
  data-token="your_token_here"
  data-theme="light"
  data-width="100%">
</script>

No account yet? Create one free →

Open the Designer

Go to your Webflow project and open the Designer. In the Pages panel on the left, navigate to the page where you want the widget. If you're building a dedicated page, create it now.

Add an Embed component

a. Click the + (Add) icon in the left toolbar to open the Add panel
b. Search for Embed or find it under "Components"
c. Drag the Embed element onto the canvas where you want the widget to sit
d. A code editor will pop up. Paste your embed script tag and click Save & Close

The widget preview won't render inside the Designer — that's normal. It shows a placeholder. The live widget appears after you publish.

Webflow plan note

The Embed component is available on the Basic plan and above. Free sites (*.webflow.io subdomains) can use it in the Designer but cannot publish custom code without upgrading.

Publish and verify

Click Publish in the top right. Open your live site in a new tab and navigate to the page. The audit widget should appear where you placed the Embed element.

If the widget doesn't load, right-click → Inspect → Console. Check for blocked scripts or a missing token error.

Common questions

Why can't I see the widget inside the Webflow Designer?

Webflow's Designer doesn't execute external scripts — it shows a placeholder box instead. Publish to your staging or live domain and open it in a browser. That's where the real render happens.

Can I put it inside a Webflow CMS Collection?

Yes. Add the Embed component to your Collection page template the same way. The widget will appear on every item in that collection. If you only want it on specific pages, use static pages instead.

What about putting it in the site-wide header or footer?

You can, via Project Settings → Custom Code. But then it runs on every page, and a full-width audit form in your site header on every page is almost certainly not what you want. Stick to the Embed component on specific pages.

Can I style the container in Webflow?

Yes. The Embed element is just a container in Webflow. Give it a class, add padding, control its width — the widget will sit inside it. The data-width="100%" attribute in the script tag controls the widget's internal width relative to that container.

Setup guides for other platforms

WordPress Squarespace Live demo