Want to make your forms tracking work with the Elegant Themes’ Divi Builder contact form? It’s easy using WPCode by WPCode. In this doc, we’ll show you how to make forms tracking work with the Elegant Themes Divi contact form by adding an id to the <form> elements of your Divi forms.
About The Id Attribute
The Elegant Themes forms don’t have an id set by default on the <form> elements.
While not technically required for valid HTML it’s certainly a best practice to include an id on a form.
Each form id on the site will need to be unique to minimize any confusion in the analytics later.
For form tracking to work on a form, it’ll need to have an id element. Ids are added automatically for most forms and opt-in plugins, like WP Forms and OptinMonster.
For the Elegant Themes Divi Build contact form, we’ll need to add the id element with some JavaScript code.
Step 1: Install WPCode by WPCode.
To do this, navigate to Plugins » Add New and search for “WPCode”
Next, click Install Now.
Finally, click Activate.
Step 2: Next, Navigate to Code Snippets in the sidebar.
Step 3: Click “Add New“, then mouseover “Add Your Custom Code (New Snippet)” and click “Use Snippet”.
Step 4: Select the code type as JavaScript Snippet, on the top right.
Step 5: Paste the following code into the large text box:
jQuery(document).ready(function(){
jQuery('.et_pb_contact_form').attr('id', 'your_id_here');
});
Step 6: Save your new snippet.
Remember, your id should only include lowercase letters, numbers, underscores, and dashes and be clearly identify the contact form.
Now the Google Analytics form event tracking will work.
In your property go to Reports » Life cycle » Engagement » Events and you’ll see:
It may take up to 24-48 hours before you see the events form_impression and generate_lead in your Google Analytics reports
That’s it! Now you know how to make form tracking work with the Elegant Themes Divi contact form!
Looking for a better contact form plugin? Check out our in-depth comparison of the best contact form plugins for WordPress.
Ever wondered how to make tracking work with the Elegant Themes’ Bloom plugin? Then check out our guide here: How to make Forms Tracking work with the Elegant Themes Bloom Plugin.