There are many ways to include a Pardot form on your WordPress website. You can use a plugin, write custom code, or integrate it using a 3rd party tool. Here are five methods that I’ve used and tested, along with a detailed breakdown of how each method works.
1. Add the embed code directly in WordPress
The first option to embed Pardot forms on your WordPress site is to simply copy the HTML embed code Pardot provides you with and paste it into a page or post. This is definitely one of the easier methods, however, if you often toggle between the visual and text (HTML) editor within WordPress, I’ve found sometimes it strips out code. If you use this method just make sure you test your form if you make any updates to your page or post.
2. Install the Pardot WordPress plugin
Another option is to install and configure the Pardot WordPress plugin. The plugin securely connects your Pardot instance with your WordPress installation. You will be able to track visitors, embed forms and dynamic content without touching a singe line of code.
How it works
Install the plugin and connect your Pardot account
Install the Pardot WordPress Plugin and activate it within WordPress. This will create a new menu item under Settings > Pardot
Enter in your Pardot credentials along with your user key and save the settings.
Add forms to your pages, posts, and widgets
Once the plugin is configured you will be able to use short codes to insert Pardot forms within posts, pages and widgets. Short codes can be generated by clicking on the Pardot icon within the WYSIWYG editor or by following their short code syntax located in the FAQ section of this page
3. Install a Short Code WordPress Plugin
Another option is to download a short code WordPress plugin such as Shortcoder. This won’t give you as many features as using the Pardot WordPress plugin, since it doesn’t connect with your Pardot account and it won’t pull in all the forms within your account. However, Shortcoder has many other uses beyond including Pardot forms within your WordPress website, so it’s a good option if you want to limit the number of installed plugins within WordPress.
How it Works
Download and activate the plugin
Download and activate the Shortcoder Plugin. This will create a new menu item under Settings > Shortcoder.
Copy & Paste Your Pardot Form Code
Create a new shortcode and give it a name. Make sure you select the code editor option.
Copy and paste the HTML for your Pardot form in the shortcode editor and save.
Your Shortcode is ready to use!
Now, you can use the shortcode to place your Pardot form on any page, post, and widget within WordPress.
4. Contact Form 7 Plugin + Pardot Form Handlers
With a bit of config work you can integrate the Contact Form 7 Plugin with Pardot form handlers. This method is great since Contact Form 7 is a popular WordPress plugin which you might already have installed. The form will also inherit any form styles you already have included on your website.
How it Works
Install and activate the plugins
Install the Contact Form 7 Plugin and activate it. You will also need to install and activate the 3rd Party Integration Plugin in order to integrate Pardot.
Create a new Contact 7 Form
Under Contact create a new form or edit the default form that’s provided.
Create a new Pardot Form Handler
Create a new form handler in Pardot. The form will not use the success and error locations configured in the form handler settings, so you can leave those blank.
Set up the Integration
In WordPress, navigate to Contact > 3rd Party Services.
Add a new 3rd Party Service. Service name can be anything you want. Submission URL should be the URL Pardot provides for your form handler. Select the form you want to attach the Pardot form handler to. You can leave the success condition and the failure message blank to keep the Contact Form 7 defaults.
Map your fields
The last piece is to map the fields within Contact Form 7 to your Pardot form handler. I like to keep the names for both the same.
5. Popup Builder Plugin
This Popup Builder plugin allows you to create highly customizable popups that can be used with any of the methods outlined in this post. Perfect for gating assets on your website with Pardot forms, blog subscription popups and more!
How it works
Install and activate the plugin
Install and activate the Popup builder plugin. This will create a new navigation item called Popup Builder.
Create a new popup
Create a new popup and select the type. You can select HTML if you want to copy & paste the iFrame code Pardot provides directly into WordPress. You can also use the short code option if you want to use the popup plugin in conjunction with another plugin, such as the Pardot WordPress Plugin.
Configure the popup
Configure your popup using one of the many options available and save.
Add it to your pages
The plugin will generate a shortcode which can be added to you post and pages.
How do you embed your Pardot forms within WordPress?
Share your tips with me via email, send me a tweet (@jennamolby), or leave a comment below.
28 Comments
Jenna- If we use Step 2, will form data sync to Pardot and then transfer to Salesforce?
Hi Lisa, Yes, all these methods would cause the data to sync to Pardot and then to Salesforce.
Jenna, how best to integrate with WordPress and have the flexibility to adjust Pardot Campaign by page? It seems the WordPress Plugin would require you to set this at the Account level, which means all is Website Tracking. But if we want gated pages under a Resources section, then the Website Tracking campaign will win over the iframed Form Campaign.
Hello! I would recommend using a completion action on your form to move the prospects to whatever campaign you want to use for your gated resources section.
Hi Jenna! Thanks so much for the great tips!
I’ve been trying to integrate a form handler in Pardot with Contact Form 7 and the 3rd Party Services plugin. I’ve followed your steps one by one but, for some reason, I keep getting the following error:
**RAW RESPONSE**
Array
(
[safe_message] => error object
[object] => WP_Error Object
(
[errors] => Array
(
[http_request_failed] => Array
(
[0] => Too many redirects
)
)
[error_data] => Array
(
)
)
)
Have you seen something similar before? I’ve tried everything but nothing worked! I’m quite stuck here… Thanks so much in advance for your help! And keep up the good posts! 🙂
Hi Blanca, You’re welcome! I’ve had this issue before when the “SUCCESS location” or “ERROR location” in the Pardot form handler have values. Did you leave these blank? Cheers, Jenna
Hi Jenna,
Is this a copy of you great post?
https://nebulaconsulting.co.uk/insights/get-your-pardot-forms-working-in-wordpress-part-1/
Yes, I think it