For AI agents: a documentation index is available at the root level at /llms.txt and /llms-full.txt. Append /llms.txt to any URL for a page-level index, or .md for the markdown version of any page.
Resources
Get started
ReferenceChangelog
ReferenceChangelog
  • Browser API
    • wf.ready()
  • Consent Management
    • Get consent status
    • Allow user tracking
    • Deny user tracking
  • Optimize
    • Quickstart
    • Variations
    • Custom attributes
  • Custom Goals
    • On-site conversions
      • sendEvent()
    • Off-site conversions
  • Data Exports
    • Data destinations
    • Data schema
  • Additional Resources
    • Support Documentation
LogoLogo
Resources
Get started
On this page
  • How on-site conversions work
  • Prerequisites
  • Example: HubSpot form submissions
  • Example: Calendly meeting bookings
  • API reference
Custom Goals

On-site conversions

Was this page helpful?
Previous

sendEvent()

Next
Built with

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

1

Trigger a conversion with custom code

On-site conversions use the wf.sendEvent() API to trigger a conversion. When a visitor performs the action you’re tracking, the goal is recorded and attributed to your optimization.

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

1<script>
2// Add necessary logic to trigger the conversion
3wf.ready(function() {
4    wf.sendEvent('form_submitted');
5});
6</script>
2

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.

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.

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() and attach it to the existing trigger.

Prerequisites

Before tracking on-site conversions, you need to create a custom goal in Webflow.

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.

1<!-- Add this to your Page settings Custom Code – before the </body> tag -->
2<script>
3window.addEventListener("message", function (event) {
4    if (event.data.type === "hsFormCallback" && event.data.eventName === "onFormSubmitted") {
5        wf.ready(function() {
6            wf.sendEvent('form_submitted');
7        });
8    }
9});
10</script>
1<!-- Add this to an existing trigger in Google Tag Manager -->
2<script>
3    wf.ready(function() {
4        wf.sendEvent('form_submitted');
5    });
6</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.

1<!-- Add this to your Page settings Custom Code – before the </body> tag -->
2<script>
3window.addEventListener("message", function (event) {
4    if (event.data.event === "calendly.event_scheduled") {
5        wf.ready(function() {
6            wf.sendEvent('meeting_booked');
7        });
8    }
9});
10</script>
1<!-- Add this to an existing trigger in Google Tag Manager -->
2<script>
3    wf.ready(function() {
4        wf.sendEvent('meeting_booked');
5    });
6</script>

API reference

sendEvent()

Client-side API for triggering on-site conversion goals