Contact Form 7 is one of the most popular form plugins for Wordpress. SharpSpring can only integrate with Contact Form 7 4.8 or greater. If you are using a previous version, upgrade to the latest version of Contact Form 7 prior to integrating with SharpSpring. This article details how to integrate a Contact Form 7 form into SharpSpring.
SharpSpring offers Professional Services
to assist with custom coding. You must have code knowledge in order to use the information within this article.
The following user roles can integrate Contact Form 7 forms into SharpSpring:
- Marketing Managers
Setting Contact Form 7 Values
To generate a Contact Form 7 code and set values, do the following:
- In a browser tab, log in to Wordpress.
- Create your Contact Form 7 Form in Wordpress.
- Copy the unique code that is generated for your form.
- Paste the code into the Text section of your desired Wordpress page or post.
html_id="XXXX" to the end of your code, where
XXXX is the
html_id value. The following is an example script with an
- Copy the following script:
- Paste the script directly below the Contact Form 7 code.
XXXX with your form's
html_id value is required in order to link your form to a native SharpSpring form. The value of the
html_id can be whatever you would like.
Note: When replacing
XXXX, do not replace the # hashtag symbol.
null value in the supplied script can be replaced by a callback function, but works fine as
null. If something is triggering a page change, it would be best to perform that function in place of the
null value so that you can ensure the SharpSpring code has finished before the page changes, in the event of form removal, or the like.
Placing and Editing Native Form Embed Codes
To combine SharpSpring native form embed codes and Contact Form 7 Wordpress codes, do the following:
- In another browser tab, log in to SharpSpring.
- In SharpSpring's top toolbar, click
Content > Forms.
- Create or edit a native form.
- Click Options > Embed Code.
- Copy the native form's embed code.
- Paste the embed code directly below the Contact Form 7 script in Wordpress.
- In the pasted embed code, change
- Add the
myForm value with a comma after it with the
html_id you gave your Contact 7 form.
- Add the following line of code directly beneath the above edited embed code:
- Copy the alphanumeric string of characters in the
form line of the native form embed code.
- Paste the string of characters over the
xXxXxXxXx-XxXx-XxXx-XxXxXxXxXxXx characters in the
__ss_noform.push line of the Contact Form 7 code.
- Save the Wordpress page or post.
- Fill out the form on the Wordpress page.
- Map the form fields into SharpSpring.
Note: If you are making this change to a form you already had set up with SharpSpring, you will need to remove the
on_sent_ok code from the Additional Settings on the form in Wordpress.
Ready to Learn More?