Hoe koppel je Webflow-formulieren aan HubSpot met Make?

Kort antwoord: Je koppelt Webflow-formulieren aan HubSpot zonder de native app door een Make-scenario te bouwen dat nieuwe Webflow-formulierinzendingen volgt, de velden koppelt aan HubSpot-contacteigenschappen, dubbele records afhandelt en automatisch de juiste lifecycle stage instelt. Zo krijg je schonere data en meer controle dan met de standaardintegratie.

De native HubSpot-app van Webflow werkt prima voor eenvoudige opzetten. Maar als je veldmapping nodig hebt die verder gaat dan naam en e-mailadres, deduplicatielogica of automatische toewijzing van lifecycle stages, loop je snel tegen de grenzen aan.

Make (voorheen Integromat) vult die leemte. Door je Webflow-formulierinzendingen via een Make-scenario te laten lopen, krijg je een volledig configureerbare pijplijn tussen je website en je CRM. Je hebt geen code nodig en je hoeft je geen zorgen te maken over datakwaliteit aan de andere kant.

In deze tutorial doorloop je de exacte stappen: Webflow en HubSpot koppelen in Make, je velden correct mappen, dubbele records eruit filteren en lifecycle stages instellen op basis van het formulier dat is ingediend.

Wat je nodig hebt voordat je begint

Zorg dat je dit klaar hebt voordat je het scenario bouwt:

• Een Webflow-site met minstens één gepubliceerd formulier
• Een HubSpot-account (elk abonnement werkt, ook het gratis)
• Een Make-account (het gratis plan volstaat voor dit scenario)
• Beheerderstoegang tot alle drie de platforms

Stap 1: Stel de Webflow-trigger in Make in

De Webflow-trigger let op nieuwe formulierinzendingen en start het scenario telkens wanneer er een binnenkomt.

1. Open Make en klik op Create a new scenario
2. Zoek naar Webflow en kies de module Watch Form Submissions
3. Klik op Add om een nieuwe Webflow-verbinding te maken
4. Ga in Webflow naar Site Settings > Integrations > API Access en genereer een nieuw API-token
5. Plak dat token in Make en sla de verbinding op
6. Kies je site in de keuzelijst
7. Kies het specifieke formulier dat je wilt volgen (je kunt aparte scenario's maken voor formulieren die andere logica nodig hebben)
8. Stel de limiet in op 1 voor verwerking in realtime

Klik op OK en voer de module één keer uit met een testinzending, zodat Make de datastructuur vastlegt. Dien je Webflow-formulier in met dummydata voordat je naar de volgende stap gaat.

Stap 2: Zoek in HubSpot eerst naar een bestaand contact

Deduplicatie overslaan is de meest gemaakte fout bij dit soort integraties. Zonder deduplicatie maakt elke formulierinzending een nieuw contactrecord aan en zit je HubSpot-database binnen een paar weken vol dubbele records.

Voeg een module Search for a Contact van HubSpot toe voordat je iets aanmaakt:

1. Voeg een nieuwe module toe na de Webflow-trigger
2. Zoek naar HubSpot CRM en kies Search for Contacts
3. Verbind je HubSpot-account via OAuth (Make vraagt je hierom)
4. Stel het filter in om te zoeken op email, met de e-mailwaarde uit de Webflow-inzending (map die uit de output van stap 1)
5. Stel de resultaatlimiet in op 1

Deze module geeft het bestaande contact terug als het wordt gevonden, of een leeg resultaat als er geen match is. De volgende stap splitst op basis van dat resultaat.

Stap 3: Voeg een Router toe voor nieuwe en bestaande contacten

Een Router-module splitst je scenario in twee paden: één voor nieuwe contacten en één voor bestaande.

1. Voeg een Router-module toe na de zoekstap
2. Pad 1 (nieuw contact): voeg een filter toe met de voorwaarde "Number of results equals 0"
3. Pad 2 (bestaand contact): voeg een filter toe met de voorwaarde "Number of results greater than 0"

Met deze structuur overschrijf je nooit per ongeluk de gegevens van een contact met een leeg veld uit een formulier en maak je nooit een dubbel record aan.

Stap 4: Map de velden en maak het HubSpot-contact aan (pad 1)

Voeg op het pad voor nieuwe contacten een module Create a Contact van HubSpot toe.

Bij de veldmapping gaan de meeste integraties mis. Webflow-veldnamen en HubSpot-eigenschapsnamen komen standaard zelden overeen. Zo pak je het goed aan:

Standaardmappings van velden:

Een veld met de volledige naam splitsen:

Heeft je Webflow-formulier één veld "Name", gebruik dan de ingebouwde tekstfuncties van Make om het te splitsen:

• Voornaam: {{1.name | split: " " | first}}
• Achternaam: {{1.name | split: " " | last}}

De leadbron mappen:

Geef altijd de formuliernaam of pagina-URL mee als HubSpot-eigenschap, zodat je weet waar elk contact vandaan komt. Map de volgende waarde van de Webflow-inzending pageUrl naar een aangepaste HubSpot-eigenschap met de naam lead_source_url.

Stap 5: Werk het bestaande contact bij (pad 2)

Voeg op het pad voor bestaande contacten een module Update a Contact van HubSpot toe.

1. Map de Contact ID uit de output van de zoekmodule (zo weet HubSpot welk record moet worden bijgewerkt)
2. Map alleen velden die bij een nieuwe inzending bijgewerkt moeten worden (voorkom het overschrijven van velden zoals createdate of original_source)
3. Een veilige standaard: werk alleen last_form_submitted en last_activity_date bij, tenzij jouw use case meer vereist

Zo blijven je bestaande contactrecords schoon en wordt de nieuwe interactie toch vastgelegd.

Stap 6: Stel de lifecycle stage automatisch in

Lifecycle stage is een van de waardevolste eigenschappen in HubSpot en tegelijk een van de eigenschappen die het vaakst leeg blijft. Maak het onderdeel van het scenario, zodat elk contact binnenkomt met de juiste stage al ingesteld. Als je later je funnelprestaties bekijkt, helpt het ook om de doorstroom per stage te vergelijken met bredere B2B SaaS-benchmarks.

Voeg deze logica toe aan zowel het pad voor aanmaken als het pad voor bijwerken:

Optie A: stel per formulier een vaste lifecycle stage in

Levert je formulier "Request a Demo" altijd Sales Qualified Leads op, zet dan vast lifecyclestage als salesqualifiedlead in de module voor dat scenario.

Optie B: gebruik een voorwaarde op basis van de formuliernaam

Verwerkt één scenario meerdere formulieren, voeg dan een module Set Variable toe vóór de HubSpot-module en gebruik een voorwaarde:

If form name = "Request a Demo" → lifecyclestage = salesqualifiedlead
If form name = "Download Guide" → lifecyclestage = lead
If form name = "Contact Us" → lifecyclestage = marketingqualifiedlead

Map die variabele vervolgens naar het veld lifecyclestage in HubSpot.

Waarden voor lifecycle stage in HubSpot (gebruik exact deze strings):

• subscriber
• lead
• marketingqualifiedlead
• salesqualifiedlead
• opportunity
• customer

Stap 7: Voeg foutafhandeling toe zodat er niets verloren gaat

Make-scenario's falen standaard geruisloos. Een time-out van de HubSpot-API of een onjuist veld laat de inzending zonder waarschuwing vallen.

Voeg een eenvoudige foutafhandelaar toe om fouten op te vangen:

1. Klik met de rechtermuisknop op de HubSpot-module Create/Update
2. Kies Add error handler
3. Kies Resume en verbind die met een module Send an Email of Slack die je waarschuwt als er iets misgaat
4. Neem de ruwe inzendingsdata op in de melding, zodat je het contact indien nodig handmatig kunt toevoegen

Dit is in vijf minuten ingesteld en voorkomt dataverlies als het scenario faalt.

Stap 8: Test het volledige scenario

Voer een volledige end-to-end-test uit voordat je het scenario activeert:

1. Klik in Make op Run once
2. Dien je Webflow-formulier in met een nieuw e-mailadres
3. Controleer of het contact in HubSpot verschijnt met de juiste velden en lifecycle stage
4. Dien hetzelfde formulier opnieuw in met hetzelfde e-mailadres
5. Controleer of HubSpot één contact toont en geen twee, en of de relevante velden zijn bijgewerkt

Wordt het deduplicatiepad niet geactiveerd, controleer dan of je zoekmodule filtert op het juiste e-mailveld uit de Webflow-output. De veldnaam verschilt afhankelijk van hoe je formulier in Webflow is gelabeld.

Stap 9: Activeer en plan het scenario

Als de test slaagt:

1. Zet het scenario op Active
2. Stel het planningsinterval in op elke 15 minuten (gratis plan van Make) of op directe triggers als je een betaald plan hebt
3. Houd het tabblad Scenario History de eerste 24 uur in de gaten om uitzonderingen op te vangen

Upgrade voor formulieren met veel verkeer naar het Core-plan van Make voor directe triggers en hogere operatielimieten.

Waarom Make gebruiken in plaats van de native Webflow HubSpot-app?

De native Webflow HubSpot-integratie regelt het basale doorgeven van velden. Make is de betere keuze als je dit nodig hebt:

• Deduplicatielogica voordat records worden aangemaakt
• Voorwaardelijke toewijzing van lifecycle stages op basis van het type formulier
• Workflows met meerdere stappen (bijvoorbeeld ook Slack waarschuwen of naast het contact een HubSpot-deal aanmaken)
• Eigen veldmapping voor niet-standaard eigenschappen
• Foutafhandeling met terugvalmeldingen

Voor teams met meer dan één formulier of een CRM met bestaande data geeft Make je controle die de native app niet biedt. Staan die formulieren op belangrijke conversiepagina's, dan is een strakkere integratie nog waardevoller in combinatie met solide best practices voor SaaS-landingspagina's.

Veelgestelde vragen

V: Kan ik meerdere Webflow-formulieren met één Make-scenario aan HubSpot koppelen?

A: Ja. Gebruik een Router-module om het scenario te laten vertakken op basis van de formuliernaam uit de output van de Webflow-trigger. Elke tak kan zijn eigen veldmapping en lifecycle stage-logica hebben. Je kunt ook per formulier een apart scenario bouwen, dat is makkelijker te onderhouden.

V: Werkt dit met de native formulieren van Webflow of alleen met ingesloten formulieren?

A: Deze tutorial gebruikt de native formulieren van Webflow via de API-trigger. Het werkt met elk formulier dat is gebouwd met de native formulierbouwer van Webflow. Gebruik je ingesloten HubSpot-formulieren direct in Webflow, dan gaan die inzendingen rechtstreeks naar HubSpot en heb je Make er niet tussen nodig.

V: Wat gebeurt er als HubSpot niet bereikbaar is wanneer een formulier wordt ingediend?

A: Make probeert mislukte bewerkingen automatisch opnieuw, op basis van de instellingen van je foutafhandelaar. Met de foutafhandelaar zoals beschreven in stap 7 krijg je bij elke mislukte verzending een melding, zodat je het probleem handmatig kunt oplossen. Make logt daarnaast alle mislukte uitvoeringen in het tabblad Scenario History.

V: Hoe voorkom ik dat de lifecycle stage van bestaande contacten wordt overschreven?

A: Stel op het pad Update Contact alleen lifecyclestage in als de huidige waarde lager in de funnel staat dan de nieuwe. Gebruik vóór de Update-module een filter dat de lifecycle stage van het bestaande contact controleert en de update alleen uitvoert als de nieuwe stage een stap vooruit is (bijvoorbeeld van lead op marketingqualifiedlead).

V: Is Make gratis te gebruiken voor deze toepassing?

A: Het gratis abonnement van Make bevat 1.000 operations per maand en pollingintervallen van 15 minuten. Voor een formulier met een laag tot gemiddeld volume (minder dan 500 inzendingen per maand) is het gratis abonnement genoeg voor het scenario dat hier wordt beschreven. Een hoger volume of instant triggers vereisen een betaald abonnement vanaf ongeveer $9 per maand.