Marketing

Enable Site Tracking with Active Campaign and Gravity Forms

Active Campaign and Gravity Forms Logo

Active Campaign is a robust and extremely user friendly marketing automation & sales CRM platform. Its leading feature is Site Tracking, which allows marketers to gain valuable insights of how their visitors are interacting and engaging with their content online.

Active Campaign records essential clickstream data and granularly segment contacts based on that data. With contacts segmented, marketers can perform behavior-based targeting at scale.

Although Site Tracking works flawlessly with Active Campaign’s own embedded forms, integrating it with third-party forms can be a bit tricky.

We were asked by clients to enable Site Tracking using the Gravity Forms plugin in WordPress but had difficulty initially finding dependable information on how to effectively implement this. After navigating multiple forums, Slack Channels, and working directly with the Active Campaign team (Thanks Kelly/Christian/Elizabeth!!), we succeeded.

During our retrospective, we felt it would be helpful to document our process so others can benefit from our efforts. Here’s our guide. We hope it provides the steps needed to successfully enable the Active Campaign Site Tracking feature using Gravity Forms.

[Note, this guide is for enabling Site Tracking. You’ll also need to Create a Feed in Gravity Forms that pushes visitor information to Active Campaign when a form is submitted. You can find the instructions from Gravity Forms here.

To get this to work, you’ll need the following:

  1. A WordPress Website
  2. An Active Campaign Account – A subscription for Active Campaign
  3. Gravity Forms Plugin  – WordPress Plugin (updated to most recent version)
  4. Gravity Forms Active Campaign Add-On – An add-on for the Gravity Forms plugin

STEP 1: Install the Gravity Forms plugin and Active Campaign add-on. Activate your Gravity Forms license.

Download and install the Gravity Forms plugin and the Active Campaign Add-on. Once installed, add a Gravity Forms license key and activate the license.

STEP 2: Connect Gravity Forms to your Active Campaign account.

After activating the Gravity Forms plugin, navigate to your “Developer Settings” of your Active Campaign instance to retrieve your account’s API URL and API Key. Add your API URL and API Key to the “Active Campaign” section of the Gravity Forms settings.

Step 3: Enable Site Tracking in Active Campaign.

Navigate to the “Tracking” settings in your Active Campaign instance  (Settings > Tracking) and toggle the “Enable Tracking” button to “On”. You may want to whitelist your domain if you haven’t done so already. Once you’ve completed the two actions, scroll down to the “Tracking Code” and copy the Account ID. It’s the nine-digit number next to “pgo(‘setAccount”. You’ll need it for the next step.

Step 4: Add Code Snippet To The Theme’s Footer.php File.

Navigate to the footer.php file of your WordPress theme (Appearance>Editor>Footer.php) and paste the code snippet embedded below into your site’s Footer.php file (paste it before the closing body tag “</body>”). Replace actid=XXXXXXXXX in the code snippet with your Active Campaign account ID (e.g. actid=959595959&e – remember to maintain the “&e” at the end of the number series). Save and close the footer.php file.

Step 5: Add A Class Name For Your Forms.

[Note: This is a process you’ll have to repeat with each form.]

Select a form from your form list in Gravity Forms and add a CSS class name by navigating to the Form Settings and entering a name in the CSS Class Name field. In the example photo below, we used the class name “gravity-forms-form”. Remember to click the Update Form Settings button each time to save it. Next, you will need to add the Form’s “CSS Class Name” to the code snippet saved to your Footer.php file in step 4. Review the code snippet and replace all instances of “gravity-forms-form” with your Form’s CSS Class Name. Click the Update File button to save your changes.

Step 6: Add a Class Name for your form’s Email field.

[Note this is a process you’ll have to repeat with each form].

Select a form to edit from your list of existing Gravity Forms forms. Once selected, click the down arrow to expand the section. Click the “Appearance” tab and add a name to the Custom CSS Class field.

In the example photo below, we used the class name “pe_we”. Remember to click the Update Form Settings button each time to save it.

Next, you will need to add the Field’s CSS Class Name to the code snippet saved to your Footer.php file in step 4. Replace all instances of “gravity-forms-form” with your form’s CSS Class Name and click the Update File button to save your changes.

Follow the steps above for each new Gravity Forms form you create.

Conclusion:

Voilà!! You’re good to go. Once a contact submits one of the Gravity Forms enabled forms on your site, you’ll be able to track their movement in Active Campaign.  If you or your organization needs help with Active Campaign integrations, please feel free to reach out.