> This page is for Browser API.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers.webflow.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.webflow.com/_mcp/server.

# On-site conversions

> Track custom conversions that happen on your Webflow site

On-site conversions track actions that happen on your Webflow site. Use them to measure third-party form submissions, dynamic interactions, or any custom user action that other goal types don't capture.

## How on-site conversions work

### Trigger a conversion with custom code

On-site conversions use the [`wf.sendEvent()`](/browser/custom-goals/on-site-conversions/sendEvent) API to trigger a conversion. When a visitor performs the action you're tracking, the goal is recorded and attributed to your optimization.

> **Note**
>
> Your development team will need to add the necessary logic to trigger the conversion when the action occurs.

```html
<script>
// Add necessary logic to trigger the conversion
wf.ready(function() {
    wf.sendEvent('form_submitted');
});
</script>
```

### Add the custom code to your site

When the conversion occurs on a specific page, add the code snippet to the custom code section of your page settings before the `</body>` tag.
For more information, see [Custom code in Page settings](https://help.webflow.com/hc/en-us/articles/33961357265299-Custom-code-in-head-and-body-tags#custom-code-in-page-settings).

If the conversion can occur on any page across your site, add the code snippet to the footer code in the site settings.
For more information, see [Footer code in Site settings](https://help.webflow.com/hc/en-us/articles/33961357265299-Custom-code-in-head-and-body-tags#custom-code-in-site-settings).

> **Using Google Tag Manager (GTM)**
>
> If you use Google Tag Manager and already have a trigger for this action, create a custom HTML tag that calls [`wf.sendEvent()`](/browser/custom-goals/on-site-conversions/sendEvent) and attach it to the existing trigger.

## Prerequisites

Before tracking on-site conversions, you need to [create a custom goal in Webflow.](https://help.webflow.com/hc/en-us/articles/49675035413523)

## Example: HubSpot form submissions

In this example, a visitor fills out a form on your site to request a demo. Assumes you've created a custom goal in Webflow with the event name `form_submitted`.

```html
<!-- Add this to your Page settings Custom Code – before the </body> tag -->
<script>
window.addEventListener("message", function (event) {
    if (event.data.type === "hsFormCallback" && event.data.eventName === "onFormSubmitted") {
        wf.ready(function() {
            wf.sendEvent('form_submitted');
        });
    }
});
</script>
```

```html
<!-- Add this to an existing trigger in Google Tag Manager -->
<script>
    wf.ready(function() {
        wf.sendEvent('form_submitted');
    });
</script>
```

## Example: Calendly meeting bookings

In this example, a visitor books a meeting through an embedded Calendly widget. Assumes you've created a custom goal in Webflow with the event name `meeting_booked`.

```html
<!-- Add this to your Page settings Custom Code – before the </body> tag -->
<script>
window.addEventListener("message", function (event) {
    if (event.data.event === "calendly.event_scheduled") {
        wf.ready(function() {
            wf.sendEvent('meeting_booked');
        });
    }
});
</script>
```

```html
<!-- Add this to an existing trigger in Google Tag Manager -->
<script>
    wf.ready(function() {
        wf.sendEvent('meeting_booked');
    });
</script>
```

## API reference

#### [sendEvent()](/browser/custom-goals/on-site-conversions/sendEvent)

Client-side API for triggering on-site conversion goals