How to connect WordPress forms to HubSpot

Use a native HubSpot form when you are happy to build and manage the form in HubSpot. Create the form in HubSpot, copy its embed code, and place that code in a WordPress Custom HTML block or equivalent page-builder widget. Submissions then go directly to HubSpot.

Keep your existing WordPress form if its design and workflow matter more. HubSpot can capture supported non-HubSpot forms, but this route is less reliable when the form is loaded dynamically, sits inside an iframe, or uses JavaScript that replaces the normal submit event.

In HubSpot, open Marketing and then Forms. Create or edit the form, choose the fields you need, and copy its embed code. In WordPress, edit the target page and paste the code into a Custom HTML block, HTML widget, or the equivalent area in your page builder.

Install the HubSpot tracking code on the WordPress site if you need page views, visitor association, or analytics for the embedded form. Add the WordPress domain to HubSpot’s tracking settings as well; submissions from an unregistered domain can be treated as spam.

For an existing WordPress form, install the HubSpot tracking code or the official HubSpot WordPress plugin, then enable the non-HubSpot forms setting in HubSpot. HubSpot scans supported HTML forms and sends captured submissions to the CRM after a submission occurs.

This method is fine for a basic contact form, but check the result carefully. The form must use a normal <form> element, cannot be inside an iframe, and may not be detected if it appears after the page has loaded or its JavaScript intercepts submission. HubSpot can also update an existing contact rather than create a second one when the email address already exists.

Match each WordPress field to the correct HubSpot contact property. Make the email field required unless you deliberately allow submissions without an email address, because HubSpot normally uses email to create or update the contact record. Use the default HubSpot email property rather than a similarly named custom property unless you have a specific reason not to.

Submit the form with a test address, then check the contact record, submitted values, source information, and any automation that should run. Test both a new email address and an existing contact, because the second test confirms whether your integration updates the intended record.

If the existing form cannot be detected and an embedded HubSpot form does not provide the behaviour you need, use a server-side integration with HubSpot’s Forms API. This normally requires developer work to authenticate the site, send the form values, and include the page URL and page name where required.

Do not put a private app token or client secret in browser-side JavaScript. Keep credentials on the server, log failed requests without storing unnecessary personal data, and add a retry or notification process so a temporary HubSpot error does not silently lose a lead. HubSpot identifies missing page information and tracking code as common causes of submission-record errors.

For conditional or multi-step WordPress forms, use JetFormBuilder HubSpot rather than relying on automatic detection. Install and activate the form builder and HubSpot add-on, then open JetFormBuilder > Settings > HubSpot API and use the OAuth 2.0 connection for a new setup. The add-on also documents a legacy API-key option, but its current guidance recommends OAuth 2.0 for new connections.

Edit the form, add the HubSpot post-submit action, connect the account, and map the email, name, phone, company, owner, lifecycle stage, and any custom properties. This is the quicker choice when lead capture needs conditional logic, multi-step forms, or deliberate field mapping instead of basic submission capture. Submit several test records before publishing the form.