Connecting WordPress Forms to HubSpot

Connecting a WordPress website and its forms to HubSpot is a fairly straightforward task in most cases, but the approach can depend on the method used to build the site’s forms. In this case, the site’s forms are built using the WordPress “Contact Form 7” plugin, which makes the integration of HubSpot easy to accomplish in one of two ways.

 

Option 1: Adding a HubSpot Plugin

The simplest method for integrating HubSpot with the site’s forms is to utilize the HubSpot WordPress plugin. This approach doesn’t require coding, which many find preferable. However it should be noted that the plugin must be kept up-to-date in order to ensure that the system works properly, and the account used to connect to HubSpot (see below) must remain active or be updated/replaced if the account changes.

Also note that HubSpot is under no obligation to provide continual support for the plugin – while it is extremely unlikely, it is possible that the plugin could be discontinued and cease to function properly.

Installation & Configuration

Go to Plugins -> Add New Plugin in the WordPress admin menu.

In the upper righthand corner, perform a keyword search for hubspot. The first result should be HubSpot’s plugin – click “Install” and then “Activate” once it’s installed.

You can then log into your HubSpot account on the next screen, and the system will attempt to automatically add HubSpot’s tracking codes and synchronize your site’s forms.

Submit a few test submissions and check that the contacts appear in your HubSpot CRM system.

 

Option 2: Manual Configuration

Some developers may prefer to manually configure the code snippets required to connect their site and forms to HubSpot. While a bit more time-consuming initially, some site owners prefer the transparency of knowing what code is on their site and how it is configured. Some site owners might also prefer keeping their HubSpot connections less dependent on a specific account.

Enable External Forms in HubSpot

In your HubSpot account, click the settings icon in the main navigation bar. In the left sidebar menu, navigate to Marketing > Forms.

Click the Non-HubSpot Forms tab , then click to toggle the Collect data from website forms switch on to enable non-HubSpot forms.

 

Add Site Tracking Code

First, obtain your site tracking code from HubSpot. In your HubSpot account, click the settings icon in the top navigation bar.

Navigate to Tracking & Analytics > Tracking code in the left sidebar menu.

In the Embed code section, click Copy.

Then, proceed to the Turchette > Options in the WordPress Dashboard. Be VERY cautious working in this section – be sure not to change anything except for the field in these instructions.

In the options screen, scroll down to the Advanced item – hover over it and select Code Fields (Tracking etc.)

Paste the code you copied from HubSpot into a new line in the Tracking Code field. Then click Save Changes.

As recommended above, fill out a few test website form submissions to ensure that your submissions are captured correctly in the HubSpot CRM.