LeadConnector

How to integrate LeadConnector with Webflow

Form submissions from Webflow can automatically create contacts, trigger SMS/email sequences, and route leads to sales pipelines.

The integration methods include the following:

• Native features: External Tracking Script and embedded form components  
• Custom logic: LeadConnector REST API for routing and two-way sync  
• No-code: Zapier, Make.com, and n8n pre-built workflows

Native features, direct embeds and widgets

Two methods capture Webflow form data without custom API code. Both work with published sites and sync automatically to LeadConnector CRM.

External tracking script

Automatically captures submissions from Webflow's native form builder. It "works with WordPress, Webflow, Shopify, Wix, and custom HTML sites."

Tracks page views, form submissions (dropdowns, checkboxes, ratings, numbers, file upload metadata), and visitor sessions. Maps form fields to contacts based on HTML name attributes. Does not support iframe-based or widget-based forms.

The setup includes the following:

1. Copy tracking script from LeadConnector account settings  
2. In Webflow: Site settings → Custom code → Footer code  
3. Paste before closing </body> tag  
4. Publish site (script doesn't work in preview mode)

The capabilities are as follows:

• Automatic contact creation with email/phone mapping  
• Page view and session tracking  
• Form field mapping via name attributes (email, phone, first_name, last_name)  
• Tag application based on form source/page location  
• Workflow triggers via contact creation events

Notes: Place in footer, not header. Script loads asynchronously. Use standard name attributes for automatic mapping. Works only with Webflow's native form element.

Embedded LeadConnector forms

Embed directly via JavaScript or iframe. The forms work on Squarespace, Wix, Shopify, WordPress, Webflow, and Duda.

Supports conditional logic, multi-step forms, and custom fields with automatic CRM sync and workflow triggers.

The setup includes:

1. Create a form in the LeadConnector dashboard  
2. Navigate to the Integrate tab  
3. Copy JavaScript or iframe embed code  
4. Add a custom code embed element in Webflow  
5. Paste the code and publish

The capabilities are as follows:

• Custom fields: dropdowns, radio buttons, checkboxes, date pickers, file uploads, signatures, ratings    
• Conditional logic and multi-step forms with progress indicators  
• CSS customization and popup behavior (exit-intent, scroll-triggered, time-delayed)  
• Survey/quiz modes with scoring

Styling options:

• Within LeadConnector: Settings → Custom CSS  
• From Webflow: Site settings → Custom code → Head code

Use !important to override defaults:

button[type="submit"] {
  background-color: #ff5733 !important;
  color: white !important;
}

Build with Webflow and LeadConnector API

The LeadConnector REST API enables server-side contact creation, webhook automation, and custom routing. Provides access to contacts, opportunities, tasks, and calendar functions for lead scoring, geographic routing, external service integration, or two-way sync.

For an introduction to working with APIs in Webflow, see Iintro to Webflow APIs.

Contact creation via API

Creates/updates contacts when Webflow forms submit, with control over data transformation, validation, and routing logic.

For most use cases, the External Tracking Script is simpler — add to Footer code and it captures submissions automatically.

For custom integrations, implement server-side endpoints receiving Webflow webhook data and calling LeadConnector's REST API.

Recommended endpoint (OAuth 2.0):

POST https://rest.gohighlevel.com/v1/contacts/
Authorization: Bearer {token}

Note: https://services.leadconnectorhq.com/contacts/ is the older Private Integrations endpoint.

The implementation includes the following steps:

1. Create server-side endpoint (Node.js, Python, etc.) for Webflow form data  
2. Transform fields to LeadConnector schema (firstName, lastName, email, phone, customFields, tags)  
3. Authenticate via Bearer token; add Version: 2021-07-28 header for Private Integrations  
4. POST to Create Contact endpoint  
5. Handle responses (HTTP 201 success; 400, 401, 422 errors); implement idempotency

Authentication: Generate Private Integration tokens from Settings → Private Integrations. For multi-user production apps, use OAuth 2.0 per OAuth documentation. OAuth tokens valid up to one year; Private tokens should rotate every 90 days. Never expose tokens client-side.

Webhook-based automation

Enables real-time sync between platforms. LeadConnector provides 28+ webhook events (ContactCreate, ContactUpdate, OpportunityStageUpdate, AppointmentCreate, TaskComplete). Webflow supports form submission webhooks.

Webflow payload example:

{
  "triggerType": "form_submission",
  "payload": {
    "name": "Contact Form",
    "siteId": "site_id_here",
    "data": {
      "First Name": "Jane",
      "Last Name": "Smith",
      "email": "jane@example.com",
      "Phone Number": "555-987-6543"
    },
    "submittedAt": "2025-01-13T14:30:00.000Z",
    "id": "submission_id",
    "formId": "form_id"
  }
}

Implementation includes the following steps:

1. Create HTTPS webhook endpoint  
2. Configure via Webflow REST API: POST https://api.webflow.com/v2/sites/:siteid/webhooks (requires sites:write scope)  
3. Process payloads and call LeadConnector API  
4. Return HTTP 200 to acknowledge

LeadConnector ContactCreate payload:

{
  "type": "ContactCreate",
  "locationId": "location_id",
  "id": "contact_id",
  "firstName": "John",
  "lastName": "Doe",
  "email": "john@example.com",
  "phone": "555-123-4567",
  "tags": ["webflow", "customer"],
  "dateAdded": "2025-01-13T14:30:00Z"
}

Verify authenticity via HMAC-SHA256 signatures in x-wh-signature header.

Opportunity and pipeline management

The Opportunities API creates sales opportunities from Webflow submissions for lead qualification, service inquiries, or e-commerce tracking.

Endpoint:

POST https://services.leadconnectorhq.com/opportunities/
Authorization: Bearer {token}
Version: 2021-07-28

Payload example:

{
  "name": "Web Design Project",
  "pipelineId": "pipeline_id",
  "pipelineStageId": "stage_id",
  "contactId": "contact_id",
  "monetaryValue": 5000,
  "status": "open",
  "assignedTo": "user_id",
  "source": "webflow-contact-form"
}

Track stages via OpportunityStageUpdate webhooks (includes previousPipelineStageId).

Appointment scheduling integration

Create appointments via API or embed calendar widgets for self-service booking.

Endpoint:

POST https://services.leadconnectorhq.com/calendars/{calendarId}/appointments
Authorization: Bearer {token}
Version: 2021-07-28
Content-Type: application/json



Configure appointment workflows for automated confirmations, SMS reminders, and follow-up sequences.

Third-party automation platforms

Pre-built workflows without custom code. These handle authentication automatically.

Zapier integration:

Zapier offers eight pre-built templates connecting Webflow to LeadConnector, including:

• Create or update LeadConnector contacts from new Webflow form submissions  
• Add new Webflow form submissions to LeadConnector campaigns  
• Create opportunities in LeadConnector from Webflow form submissions  
• Sync Webflow e-commerce orders to LeadConnector contacts

Create Zaps through Zapier's workflow automation platform. The LeadConnector integration supports instant webhook triggers for real-time automation of form submissions and other CRM events.

Make.com integration:

Make.com provides GoHighLevel modules with 19 actions:

• Across contact management (6 actions: create, get, update, delete, add note, search)  
• Campaign operations (2 actions: add/delete contact to campaign)  
• Opportunity management (5 actions: create, get, update, delete, search)  
• Task management (5 actions: create, get, update, delete, list)

Account operations (2 actions: add account, make API call)

Connect to Webflow using the Instant Watch Events Module or standard Watch Events trigger for automated workflows.  

n8n integration:

n8n offers self-hosted integration for teams needing data control. The platform provides nodes for both HighLevel and Webflow, enabling teams to build custom workflows that combine the two systems without relying on external integration platforms.

Create workflows that monitor Webflow form submissions and create contacts in LeadConnector. n8n supports custom JavaScript for data transformation.

What you can build

Combine LeadConnector's CRM automation with Webflow's design flexibility to create lead capture systems that automatically route contacts, trigger follow-up sequences, and sync data across platforms.

• Real estate lead routing: Property listing sites capture leads, route them to agents by location/price, trigger SMS follow-up, and enable appointment booking  
• Multi-location appointment scheduling: Service sites with embedded calendar widgets syncing to LeadConnector, automated multi-interval SMS reminders, and post-appointment review sequences  
• Lead qualification workflow: Consultation forms with budget/timeline/requirements criteria, routing qualified leads to pipelines while nurturing others, with automated task assignment and calendar scheduling  
• SaaS trial engagement automation: Webflow landing pages and signup forms connect to LeadConnector to capture trial registrations, triggering time-based engagement workflows