How to Embed a HubSpot Form in WordPress (Plugin, Block, Shortcode or Embed Code)

To embed a HubSpot form in WordPress, copy the form's embed code from HubSpot and paste it into a Custom HTML block on your page, or install the HubSpot WordPress plugin and add the form with its HubSpot Form block or shortcode. The method depends on the form: HubSpot says forms built in the updated form editor cannot currently be embedded on WordPress pages or posts through the plugin, so use the embed code for those and keep the plugin's block or shortcode for legacy forms.

Checked against the HubSpot Knowledge Base, the WordPress.org plugin directory and WordPress documentation on October 20, 2026.

Which method should you use?

How to tell a legacy form from an updated editor form

Open the form from Marketing > Forms (click More first if your menu is collapsed) and look at the editor:

• Updated form editor: a styling icon in the left sidebar and a Review and update button in the top right. New forms created through Create form > Form Editor use this editor.
• Legacy editor: a Style & Preview tab, and the option to set the form as raw HTML. HubSpot still lets you pick Legacy Form Editor under Create form, but its legacy article says the updated editor is recommended for new forms.

Before you start

1. A WordPress site that allows plugins and JavaScript. HubSpot's plugin article says you need a self-hosted WordPress.org install or the WordPress.com Business plan, because other WordPress.com plans do not allow plugins or JavaScript.
2. The right access. Installing the plugin requires a Super Admin in HubSpot who is also a WordPress admin. Creating or editing forms needs Edit forms permissions.
3. Your WordPress domain added to HubSpot. In HubSpot, click the settings icon, go to Tracking & Analytics > Tracking Code, open the Advanced Tracking tab and click + Add domain below Additional site domains. HubSpot says submissions from external domains that have not been added are filtered to your spam submissions.
4. The HubSpot tracking code on the page. HubSpot needs it to track views and analytics for an embedded form. The WordPress plugin adds it to your pages automatically.
5. Third-party cookies enabled in your browser while you connect the plugin, with any cookie-blocking extensions turned off.

Step 1: Install and connect the HubSpot WordPress plugin

You need the plugin for the block and shortcode methods. It also adds the tracking code for the embed code method.

On WordPress.org the plugin is now listed as HubSpot All-In-One Marketing - Forms, Popups, Live Chat. HubSpot's own help article still calls it "HubSpot - CRM, Email Marketing, Live Chat, Forms & Analytics," so you may see either name. On October 20, 2026, the listing showed version 11.3.75, more than 200,000 active installations, WordPress 5.8 or higher and PHP 7.2 or higher.

1. Log in to your WordPress admin dashboard.
2. Go to Plugins > Add New and search for HubSpot.
3. On the HubSpot All-In-One Marketing plugin, click Install Now, then Activate Plugin.
4. Click HubSpot in the left sidebar menu.
5. Click Log in to your account and sign in to HubSpot. If you do not have an account, you are prompted to create one.
6. If your HubSpot account uses Brands, choose which brand the plugin should use.

On a multisite network, activate the plugin on each site separately.

Method 1: Embed a form built in the updated form editor

Copy the embed code in HubSpot

1. Go to Marketing > Forms.
2. Hover over the form and click Edit.
3. Click Review and update in the top right.
4. In the right panel, click Update.
5. In the dialog, click Get embed code.
6. On the Embed code tab, click Copy.

The same dialog has a Developer code (Advanced) tab for developers who want to style the form with their own CSS variables. It requires a Marketing Hub or Content Hub Professional or Enterprise subscription, and you must confirm "I understand the risks, show me the code" before HubSpot shows it.

Paste it into WordPress

1. Open the page or post in the WordPress editor.
2. Click the Block Inserter (the plus icon), or type /html in a new paragraph and press Enter, to add a Custom HTML block.
3. Click Edit HTML if your WordPress version shows it, paste the full embed code, and click Update.
4. Save or publish the page, then open the live page to confirm the form loads.

Two WordPress rules matter here. First, the embed code contains a <script> tag, and WordPress only keeps scripts for users with the unfiltered_html capability. On a single site that is Administrators and Editors. On Multisite, only Super Admins have it. If a Contributor saves the page, WordPress strips <script> tags. Second, HubSpot's WordPress article says that if the embed code is altered on the live page, you should insert it with an HTML snippet plugin instead.

If you do not need the form inside a page, HubSpot can also give you a share link. In the same Review and update flow, click Copy a share link to get a standalone form page you can link to from a WordPress menu or button.

Method 2: Add a legacy form with the HubSpot Form block

1. Open the page or post where the form should appear.
2. Click the plus icon, search for HubSpot Form, and add the block.
3. In the block, choose an existing form from the dropdown, or create one from HubSpot > Forms > Create form.
4. Publish the page.

HubSpot notes that newer versions of Gutenberg strip inline JavaScript, and it points to the Inline JS Block for Gutenberg plugin for embedding legacy forms. Be careful with that route. On October 20, 2026, that plugin's WordPress.org page showed version 1.0.0, about 60 active installs, and a warning that it "hasn't been tested with the latest 3 major releases of WordPress." Test it on a staging site first, or use the Custom HTML block method above.

Method 3: Add a legacy form with a shortcode (classic editor)

1. In WordPress, go to HubSpot > Forms.
2. Hover over the form and click Embed, or create a new form.
3. Select the WordPress shortcode option and copy the code.
4. Open the page or post and paste the shortcode into the editor.
5. Publish.

The shortcode looks like [hubspot type="form" portal="YOUR-ACCOUNT-ID" id="YOUR-FORM-ID"]. Copy it from the plugin rather than typing it, so the account and form IDs are correct.

You can also embed a legacy form without the plugin's block or shortcode. In HubSpot, go to Marketing > Forms, hover over the form, click Actions > Share, then Copy, and paste the code into a Custom HTML block as in Method 1. Changes you make in HubSpot's forms tool appear on the live form automatically.

Pop-ups, banners and slide-ins: use pop-up CTAs

Pop-ups are no longer a form type you pick when creating a form. They are built in HubSpot's CTA tool:

1. Go to Marketing > CTAs and click Create.
2. On the Pop-ups tab, choose Banner (fixed to the top or bottom of the page), Pop-up box (appears on a set schedule) or Slide-In (slides in from a corner).
3. Add a form. HubSpot allows one Form (New Editor) or Meeting module per CTA, and the form module has a Close after submission switch.

Pop-up CTAs need a Marketing Hub or Content Hub Starter, Professional or Enterprise subscription. To show them on WordPress, the page needs the HubSpot tracking code, which the plugin installs for you. This is also a practical way to show an updated editor form on a WordPress site without touching page code.

Connect WPForms, Contact Form 7 and other WordPress forms

Option A: Non-HubSpot forms (Contact Form 7, Ninja Forms and others)

HubSpot's WordPress article names Contact Form 7 and Ninja Forms as examples of forms that can send submissions to HubSpot this way.

1. Make sure the HubSpot tracking code or the HubSpot WordPress plugin is on the site.
2. In HubSpot, go to Settings > Marketing > Forms and open the Non-HubSpot Forms tab.
3. Turn on Collect data from website forms.
4. Optional: if you use marketing contacts, decide whether new contacts from these forms should be set as marketing contacts.

HubSpot only captures forms that are static HTML inside <form> tags, include an email field with type="email", use a standard submit button, are present when the page first loads, and are not in an iframe or a single-page app. Forms with JavaScript bound to the submit event are not supported, hidden fields are not collected, and forms with sensitive fields such as credit card numbers are not supported. Submissions create or update contacts by email address. To find them, go to Marketing > Forms and set the Form type filter to non-HubSpot forms.

If data stops arriving, HubSpot says another WordPress plugin may be conflicting. Disable plugins one at a time to find it.

Option B: The WPForms HubSpot addon

1. Confirm you have the WPForms Elite license level.
2. Go to WPForms » Settings » Integrations, expand HubSpot, click Add New Account, sign in, select your account, click Choose Account, then Connect app.
3. Open a form in the WPForms builder, go to Marketing » HubSpot, click Add New Connection and give it a nickname.
4. Choose an action such as Create/Update Contact (it requires an Email field), then map each form field to a HubSpot property.
5. Optional: turn on Enable Conditional Logic so only some entries, such as newsletter opt-ins, go to HubSpot.

WPForms' documentation covers contact and company actions only, not deals or tickets. It also asks you to add your domain to HubSpot's additional site domains so submissions are not filtered as spam.

Check that submissions reach HubSpot

1. Submit the live form with an email address that is not already in your CRM.
2. In WordPress, go to HubSpot > Forms, hover over the form, open Actions and select View submissions. In HubSpot, the same option is under Marketing > Forms, then Actions > View submissions.
3. Open the new contact record and confirm each field mapped to the right property.
4. If nothing arrived, check your spam submissions and your Additional site domains list.

To track performance, click the form name in Marketing > Forms. The performance view defaults to the last 30 days and shows views, submissions and conversion rate, which HubSpot calculates as total submissions divided by total views. The Analyze tab shows each form field as its own report, which helps you spot patterns in answers.

Troubleshooting common problems

A worked example (hypothetical)

Imagine a 12-person accounting firm with a WordPress site and two HubSpot forms: an old newsletter form built in the legacy editor, and a new "Book a consultation" form built in the updated editor.

1. It installs and connects the HubSpot plugin, which adds the tracking code.
2. It adds its domain under Additional site domains so nothing lands in spam.
3. It adds the newsletter form to the blog sidebar page with the HubSpot Form block, since that form is legacy.
4. It copies the consultation form's embed code through Review and update > Get embed code and pastes it into a Custom HTML block on the Contact page, saved by an Administrator.
5. It submits a test entry on each page and checks View submissions before announcing the pages.

Getting help with HubSpot and WordPress

INSIDEA is an Elite HubSpot Partner and the growth operating system for modern businesses. If your forms, tracking or WordPress integration need a review, our HubSpot team can set them up with you.