Connect your site to ActiveCampaign

Integrate your site with ActiveCampaign to manage website forms.

With Webflow’s ActiveCampaign integration, you can connect multiple Webflow websites and forms to your ActiveCampaign account. The integration supports single Webflow website customers as well as scaling agencies managing multiple end-client accounts. You’ll need to install the integration on each website where you’ll want to use ActiveCampaign.

With this integration, you can:

• Sync and map Webflow forms to ActiveCampaign
• Embed ActiveCampaign forms in your site
• Create lists, tags, and custom fields in Webflow
• Enable site and event tracking
• View form history in your contact record (ActiveCampaign Enterprise plan only)

How to connect your Webflow account to ActiveCampaign

Go to the site in which you’d like to integrate ActiveCampaign, then:

1. Open the Apps panel
2. Search for ActiveCampaign in the search bar
3. Hover over ActiveCampaign, then click Install
4. In the ActiveCampaign login modal:
   • Enter your ActiveCampaign URL
   • Enter your ActiveCampaign API Key
   • (Optional) Give your ActiveCampaign account a Friendly Name to easily identify accounts in Webflow
   • Check the “Add to this site” checkbox if you want the ActiveCampaign account to be connected to this site only
   • Check the “Add to Workspace” checkbox if you want the ActiveCampaign account available across all sites in your Workspace
5. Click Sign in

How to sync Webflow forms with ActiveCampaign

Syncing your Webflow form allows you to map Webflow fields to ActiveCampaign fields and create/retrieve lists, tags, and custom fields. Once you map your fields, all new form submissions will reflect the new mapping rules.

To sync forms:

1. Launch the ActiveCampaign App from the Apps panel
2. Choose your ActiveCampaign account
3. Click "Sync Webflow forms with ActiveCampaign"
4. Click the form on the canvas you want to sync
5. Click Set up form sync
6. Open the Select ActiveCampaign List dropdown
7. Choose an existing list or create a new list
8. Click Continue to Field Mapping
9. Review the sync configuration and click Continue to Field Mapping
10. Map your form fields to ActiveCampaign fields (if field types are misaligned, a warning message will appear)
11. Add tags to associate with a contact in the Tags input field
    • Existing tags: type the entire tag name, then click the tag name when it appears below the field
    • New tags: type the name of the tag, then click Create (tag name)
12. Click Start Sync
13. Publish your site

If you modify your Webflow form field names after setting up this sync, you must update your sync configuration.

To edit or delete your form sync, click View All Syncs.

Field type warning messages

Custom objects

Custom objects let you record multiple submissions from the same contact. This feature is available for accounts on ActiveCampaign Enterprise’s plan.

ActiveCampaign automatically creates a historical record of each Webflow form submission from the same contact. You can find this in your contact record > Webflow Custom Object section. To view the fields related to your Webflow form and their field value, click the “three dots” icon in the contact record’s custom object section.

You can name the custom object in your form's settings in Webflow.

Use custom objects with automations

You can use custom objects to trigger automations, as well as personalize your messaging and create conditions with the segment builder. Additionally, you can reference custom objects when creating list segments, advanced searches, campaigns, lead scores, and webhooks.

Embed an ActiveCampaign form in your Webflow site

You can embed any of your ActiveCampaign inline, floating bar, floating box, or modal forms in your Webflow site.

When embedding an ActiveCampaign form in your Webflow site:

• You will not have a preview of your ActiveCampaign form on the Webflow canvas
• You don’t need to map your ActiveCampaign form
• Form submissions will be recorded according to your standard and custom fields
• Multiple submissions of the same form from the same contact may be overwritten unless you have a custom object set up for the form
• If you use the “File Upload” element in your form, the file will not sync in your custom field or upload to ActiveCampaign

To embed an ActiveCampaign form in your Webflow site:

1. Launch the ActiveCampaign App from the Apps panel
2. Choose your ActiveCampaign account
3. Click Embed ActiveCampaign forms in Webflow
4. Search for your ActiveCampaign form
5. Choose an element on the canvas into which you want to embed the form
6. Click Embed next to the form you want to add
7. Publish your site

How to enable ActiveCampaign site tracking

Site tracking connects your marketing and sales processes to your website activity. It allows ActiveCampaign to "see" and "react" in real time as contacts visit your site and view specific categories and pages.

To enable site tracking:

1. Launch the ActiveCampaign App from the Apps panel
2. Choose your ActiveCampaign account
3. Click Enable ActiveCampaign site tracking
4. Publish your site

To check the status of any whitelisted domains, go to ActiveCampaign > Website > Whitelist and Install Code.

If you want to disable site tracking, click Disable site tracking.

How to enable ActiveCampaign event tracking

You can add event tracking to your Webflow site to capture user interactions and trigger automations in ActiveCampaign. The event types available for tracking include:

• Click — tracks clicks for images, fields, buttons, etc. for a known contact
• Element visible — tracks if a known contact has viewed certain website sections
• Time on page — measures the time (in seconds) a known contact spends on a specific page

To enable event tracking:

1. Launch the ActiveCampaign App from the Apps panel
2. Choose your ActiveCampaign account
3. Click Enable ActiveCampaign event tracking
4. Retrieve your Event Key and Act ID:
   • Go to ActiveCampaign > Website > Site tracking > Event Tracking
   • Toggle event tracking “on”
   • Copy the Event Key
   • Click the Event Tracking API hyperlink
   • Copy the Act ID
5. Enter your Event Key and Act ID in Webflow
6. Publish your site

To set up event tracking on your site:

1. Select an element on the canvas to track
2. Choose an Event Type and an ActiveCampaign Event (create a new ActiveCampaign event if needed)
3. Add an Event Description
4. Click Add Event (the newly created event will be in the Event Tracking section of your ActiveCampaign account)
5. Publish your site

To delete event tracking from elements, click the “trash can” icon next to the event tracking configuration.

Time on Page event tracking

Tracking Time on Page events lets you gauge user engagement on your website. This metric measures the duration a user spends on a specific page, from the moment the page loads until they navigate away or close the browser. This data is valuable for marketers looking to optimize their site for user experience and content relevance.

You can track the event in the Recent Activities log in your contact record. The event can also act as a trigger to start an automation or personalize emails, and can be used for segmentation.

To enable Time on Page tracking, toggle Time on Page “on.”

How to disconnect your ActiveCampaign account from a Webflow site

1. Launch the ActiveCampaign App from the Apps panel
2. Click the “trash can” icon next to the ActiveCampaign account you want to disconnect

You’ll be given the option to keep syncing your form after your account is removed