How to Use Hubspot Forms in WordPress
Connecting Hubspot with WordPress lets you capture leads, track submissions, and sync contact data directly into your CRM without extra plugins. This guide walks you through creating, embedding, and managing forms so your website collects the right information every time.
Before You Start with Hubspot Forms
To embed a form, you need access to both your Hubspot account and your WordPress site. Make sure you have:
- An active Hubspot account with permission to create or edit forms.
- Access to your WordPress dashboard with rights to edit pages or posts.
- The ability to switch to the HTML or code editor in your WordPress theme or builder.
This tutorial is based on the official Hubspot documentation and applies to most standard WordPress setups.
Create a Form in Hubspot
The first step is to build or select the form you want to place on your WordPress site.
-
Log in to your Hubspot account.
-
Navigate to your marketing tools and open the Forms tool.
-
Create a new form or open an existing form you want to use.
-
Configure fields, validation rules, and any follow-up options such as thank-you messages or redirects.
-
Save and publish the form so it is ready to embed outside Hubspot.
Once the form is published, Hubspot generates an embed code you can paste into WordPress.
Get the Hubspot Embed Code
After you publish the form, collect the code snippet needed for your website.
-
In Hubspot, open the form you plan to use.
-
Locate the option to share or embed the form.
-
Copy the provided embed code. It is usually a JavaScript snippet that loads the form securely.
Keep this window open or paste the snippet into a temporary document so you can access it easily when editing your WordPress page.
Add a Hubspot Form to a WordPress Page or Post
You can place a form almost anywhere content is supported in WordPress. The key is to use the HTML or code view rather than the visual editor.
-
Open your WordPress dashboard and go to Pages or Posts.
-
Select the page or post where you want the Hubspot form to appear, or create a new one.
-
Switch to the HTML or code editor. In the block editor, you can add a Custom HTML block.
-
Paste the Hubspot form embed code into the HTML area.
-
Position the block or code snippet where you want the form to appear in your layout.
-
Update or publish the page.
View the page on the front end to confirm that the form loads correctly and matches your design expectations.
Manage Hubspot Form Options in WordPress
Once the form appears on your site, you may want to adjust its behavior. Most configuration is done inside Hubspot itself rather than in WordPress.
Adjust Hubspot Form Style and Layout
Hubspot forms inherit styling from your theme or specific form settings. To refine the look and feel:
- Use Hubspot form options to modify fonts, colors, and button styles.
- Preview the form to ensure it fits within your WordPress content width.
- Use additional CSS in your theme if you need more precise layout control.
Always test on both desktop and mobile devices to confirm that the form remains usable and accessible.
Configure Hubspot Notifications and Follow-Up
Submission handling is configured inside the form settings:
- Set email notifications for internal team members when a new submission arrives.
- Choose whether to show an inline thank-you message or redirect to a separate thank-you page.
- Connect the form to workflows or lists in Hubspot for automated nurturing and segmentation.
These options ensure that every form fill leads to consistent follow-up and clean data in your CRM.
Troubleshooting Hubspot Forms in WordPress
Occasionally, embedded forms do not display or behave as expected. Here are common issues and checks:
- Form does not appear: Confirm that JavaScript is allowed in your WordPress editor and that no security plugin is stripping the script tag.
- Layout is broken: Inspect theme CSS for styles that may override form elements, and adjust spacing or widths as needed.
- Submissions not logging in Hubspot: Verify that the correct form is embedded and that the form is published.
If problems persist, compare your setup with the official instructions from Hubspot to spot any missed steps.
Where to Find Official Hubspot Instructions
For the latest platform changes or advanced configuration, review the official guide on creating a Hubspot form in WordPress:
Official Hubspot WordPress form instructions
The official resource includes up-to-date interface screenshots and specific notes for different account tiers.
Optimize Your Hubspot and WordPress Setup
A solid integration between Hubspot and WordPress supports better lead capture and reporting. To take your setup further, you can:
- Map form fields to custom properties to improve segmentation.
- Connect forms to scoring models and lifecycle stages.
- Use A/B testing within Hubspot to compare different form versions.
For broader optimization of your WordPress site and marketing stack, you can also review resources from specialized consultancies such as Consultevo, which focus on performance, analytics, and conversion improvements.
Summary: Hubspot Forms on WordPress
Embedding Hubspot forms in WordPress follows a simple sequence: build the form in your CRM, copy the embed code, paste it into the HTML editor on your page, and manage all submission settings back in Hubspot. With this approach, your website becomes a reliable lead generation entry point while your CRM remains the single source of truth for contact data.
Need Help With Hubspot?
If you want expert help building, automating, or scaling your Hubspot , work with ConsultEvo, a team who has a decade of Hubspot experience.
“`
