Introduction

Webflow helps teams collaborate and develop the website. It reduces development time as teams develop and design the website simultaneously. Similarly, content teams can edit while the design continues. Webflow also makes it easy for project managers to oversee the process.

MoEngage <> Webflow 

With the MoEngage and Webflow integration, you can capture your Webflow landing page inputs and send them personalized, targeted campaigns via MoEngage to drive conversions. With this integration, you can:

• Create or update users in MoEngage when a  is submitted
• Create events with details submitted from the form

Integration

Step 1: Get your MoEngage endpoint

Reach out to to your MoEngage Customer Success Manager to get a dedicated endpoint for your Webflow integration. You also need to specify the common identifier between MoEngage and Webflow- it can be email id or phone number of the user.

Step 2: Set up the webhook in Webflow 

Get your site ID: 

You can access the ID via site settings. 

1. In the designer, click the Webflow Icon in the top left corner, and select “Site Settings” from the menu.
2. In site settings, scroll down to the “Overview” section to find your Site ID.
   

Create API key 

1. Navigate to Site >> Apps and Integration. 
2. Scroll down to API access section 
3. Click Generate Key
4. Provide a name to the key and add the relevant permissions
   
   
5. Click Generate Token

Create a webhook

Send a POST request to the Create Webhook endpoint. In the request, you’ll include the site_id, url (MoEngage Endpoint), and triggerType of ‘form_submission’.

You can also access it from here directly or use the following curl to create a webhook. 

curl --location 'https://api.webflow.com/v2/sites/6745f3f6b40250a60ab0f815/webhooks' \
--header 'Authorization: Bearer <API key>' \
--header 'Content-Type: application/json' \
--data '{
"triggerType": "form_submission",
"url": "<MoEngage endpoint>"
}'

Test the webhook

Once you’ve successfully created the Webhook to listen for new form submissions, you can test it by navigating to the form on your site and submitting a response.

Step 3: View details on MoEngage

Your users and events should start showing up in MoEngage. You can validate these from the user profile. Event name will be "webflow form submission". You can now run event-triggered campaigns to your users.