HubSpot API integratie in Gravity Forms

Veel bedrijven gebruiken een CRM (Customer Relationship Management) systeem om klanten en contacten te beheren. Een bekend CRM is HubSpot, welke ook door een aantal van onze klanten wordt gebruikt. En met Gravity Forms als één van de meest gebruikte WordPress plugins voor het aanmaken en beheren van formulieren maakt dit de perfecte combinatie om gegevens te verzamelen en het beheren van (potentiële) klanten en contacten. Daarom is een perfecte integratie tussen WordPress en HubSpot, door middel van Gravity Forms, een must voor elk bedrijf die een gestroomlijnd process wil hebben. En dit is exact waar wij binnen Jacht.digital Marketing aan hebben gebouwd.

We doen overigens niet iets nieuws, er zijn namelijk al mogelijkheden om HubSpot te integreren in WordPress. De functionaliteiten zijn echter zeer verschillend en (vaak) missen belangrijke features of werken deze niet zoals men verwacht. Zo werken niet alle functies in alle HubSpot pakketten, is opmaak en design beperkt, moet er veel dubbel werk gedaan worden en is het lastig goede SEO en Analytics toe te passen.

HubSpot WordPress plugin

Nu heeft HubSpot zelf al een plugin beschikbaar gesteld voor WordPress waarmee formulieren vanuit HubSpot kunnen worden ingeladen in WordPress, of data van formulieren op de website kunnen worden doorgestuurd naar HubSpot. Nu is dit natuurlijk geschikt om bijvoorbeeld de gegevens van een contact formulier ook direct in het CRM ingeschoten te krijgen, maar er zijn ook een hoop limitaties wanneer dingen complexer worden.

De formulieren die met de officiële plugin worden geplaatst werken perfect samen de data in Hubspot zelf, gezien deze direct uit HubSpot wordt geladen en gevuld. Het grote nadeel is echter dat het formulier d.m.v. Javascript en een iFrame worden getoond.

Dit geeft een aantal implicaties:

  • Geen tracking van eigen analytics tools (zoals Google Analytics of Google Tag Manager);
  • Aanpassen van design is zeer beperkt (dit kan alleen vanuit HubSpot zelf);
  • Ondanks dat iFrames geen negatieve impact op SEO heeft, helpt het ook niet mee.

Daarnaast kan er maar één contactpersoon worden ingesteld in de officiële plugin, welke voor alle formulieren en data wordt gebruikt. Hierdoor is het dus niet mogelijk om inzendingen te splitsen naar meerdere personen binnen de eigen organisatie, iets wat bij grote organisaties en zeker multinationals vaak wenselijk is.

Natuurlijk kan de officiële HubSpot plugin meer dan alleen dan formulieren verwerken, zoals het direct beheren van contacten vanuit WordPress. Dit kan handig zijn wanneer WordPress, of bijvoorbeeld Woocommerce, als leidend systeem wordt gebruikt.

Gravity Forms HubSpot extensie

Ook is er een officiële extensie beschikbaar van Gravity Forms welke ook de mogelijkheid heeft om inzendingen vanuit eigen formulieren door te sturen naar HubSpot. Deze heeft de mogelijkheid om zelf data tussen het formulier en HubSpot te koppelen (“mappen”), contactpersonen toe te wijzen per formulier en data wordt verzonden alsof het HubSpot Forms zijn.

Helaas heeft het ook een groot probleem; het is namelijk niet in staat om data vanuit HubSpot op te halen welke in het formulier gebruikt kan worden. Zo hebben select boxen, checkboxen en radiobuttons vaste waarden in HubSpot welke exact overgenomen moeten worden in het eigen formulier. Wanneer dit niet gebeurd of een waarde fout staat, dan resulteert dit in foutmeldingen en komt de inzending niet binnen in HubSpot.

Onze oplossing

Binnen Jacht.digital Marketing, in samenwerking met onze klanten, hebben we een eigen plugin ontwikkeld die de mogelijkheid geeft om inzendingen vanuit Gravity Forms door te sturen naar HubSpot via hun API.

Hoewel we pas een eerste release hebben opgeleverd, en er dus nog genoeg verbeterpunten en nieuwe functionaliteiten toegevoegd kunnen worden, zijn de minpunten van de officiële plugin en extensie hiermee verholpen.

2-weg synchronisatie

Zo is het mogelijk om vrijwel alle velden in Gravity Forms te koppelen met HubSpot, inclusief datum, select box, radio buttons en de checkbox. Bij vaste waarden in HubSpot (zoals het geval bij select boxen) is er de optie om aan te geven dat het de opties eerst worden opgehaald en automatisch in het formulier worden gezet. Dit heeft het grote voordeel dat verzonden data altijd up-to-date en correct is, zelfs wanneer er wijzigingen zijn doorgevoerd in HubSpot zelf.

Less is more!

Als laatste hebben wij gekozen om Gravity Forms zo min mogelijk aan te passen, en data pas te versturen wanneer Gravity Forms klaar is met de verwerken. Dit heeft als voordeel dat het dus perfect samenwerkt met andere plugins of Gravity Forms add-ons.

Een kijkje in de keuken

Maar hoe werkt de plugin precies?

In het beheer gedeelte van Gravity Forms gebeurd er eigen heel weinig; er moet een API sleutel worden ingevoerd, en er zijn een paar extra opties zijn toegevoegd aan de instellingen van een formulierveld.

  • Hubspot name: dit is de property name die in HubSpot gebruikt wordt, en hier wordt dus de verzonden waarde naartoe gestuurd.
  • Activate Hubspot: een simpele check om aan te geven dat dit veld naar HubSpot gestuurd moet worden. Hiermee is het mogelijk om informatie op te vragen die wel verwerkt wordt binnen Gravity Forms, maar niet hoeft te worden doorgestuurd naar HubSpot.
  • Format Date Field: gezien HubSpot datums op een specifieke manier verwerkt kan hier worden aangegeven om de waarde om te zetten naar het juiste formaat. Indien een date property in HubSpot als tekstveld is geregistreerd dan is dit dus niet nodig.
  • Dynamic hubSpot Field: bij velden die vaste waarden hebben in HubSpot kan hiermee de data worden opgehaald en automatisch worden gevuld. Zeer handig bij select boxen, radio- en checkboxen.

Verder hoeft er niets gedaan te worden, en werkt Gravity Forms exact zoals het normaal ook werkt. Dus 100% vrijheid in hoe het formulier eruit ziet, hoe het werkt én welke velden er naar HubSpot worden gestuurd.

Ook de technieken die gebruikt worden zijn simpel gehouden om zo problemen met andere plugins en eigen code te voorkomen. Zo zijn er alleen standaard hooks (methode in WordPress om code aan te kunnen passen of te overschrijven) gebruikt, en ook is de officiële API package (pakket met gestandaardiseerde code) van HubSpot zelf gebruikt. Op deze manier kunnen we garanderen dat ook bij updates in de toekomst er geen problemen voorkomen, of zeer snel en gemakkelijk opgelost kunnen worden.

Nu te gebruiken

Onze plugin draait op dit moment al op een aantal websites en steeds meer van onze klanten merken dat een goede integratie noodwendig is. Ongeacht welk pakket van HubSpot gebruikt wordt, zelfs de gratis HubSpot’s Free Tools, deze kan gebruikt worden in combinatie met onze oplossing.

Hoewel we op dit moment alleen nog de plugin gebruiken op websites die wij bouwen en beheren, zijn we ook hard bezig om de plugin klaar te maken om direct vanaf deze website beschikbaar te maken om te gebruiken op elke website.

Mocht je geïnteresseerd zijn in hoe onze oplossing jouw website en HubSpot geïntegreerd kunnen worden, neem dan vrijblijvend contact met ons op.