One of my favourite WordPress tools is the free Contact Form 7 plugin. Simple and easy to use, it offers a really simple way to add feedback forms or surveys to your site with no programming required. It usually looks pretty good “out of the box”, but with a little styling it can look amazing.
Here are a few tricks that I’ve learned along the way:
How to save submissions to a database
It can often be really useful to be able to save form submission details in the WordPress database and be able to export them in CSV format, for example, so you can export the data to a CRM, email broadcast system or analyse the data in Excel. Even if you don’t need to do so immediately, it’s often well worth installing the brilliant Contact Form DB plugin, which seamlessly stores your data and provides you with a section in the dashboard to retrieve your data*.
*Don’t forget that your database will now contain live customer details, so you need to be extra-careful with backups etc.
How to import and export forms
It can occasionally be handy to import and export the forms themselves, so you can use them on another website, or create a variation.
Because Contact Form 7 stores its contact form data as a custom post (post type:
wpcf7_contact_form), that’s really easy to do an you can export and import form data via Tools > Export and Tools > Import in the WordPress admin screen.
In the Export menu, choose “Contact Forms” if you want to export contact form data only. You can also choose “All content” (this includes contact form data).
How to log a submission as an event in Google Analytics
If you’ve set up Google Analytics in a conventional way, then it’s really easy to log submissions as events, you don’t even need to do any programming, there’s just a little code that you can add in the WordPress dashboard as you edit your form.
In the Additional Settings field at the bottom of the contact form management page; simply insert the following line:
on_sent_ok: "_gaq.push(['_trackEvent', 'Contact Form', 'Submit']);"
Note that you need to quote the codes properly and the code must be in one line.
Now, if you have set everything up correctly, when someone makes a submission via your contact form, Google Analytics will track it as an event with Contact Form as the Category, and Submit as the Action.
To verify that this is working correctly, you can check the Content > Events > Overview report page on Google Analytics 24-48 hours after a submission. At that point, you should be able to find the Contact Form category there.
How to redirect following submission
It’s often handy to be able to redirect a user to a new page after they have completed the form, both to provide them with additional information such as a thank you, or because you want to log the submission in Google Analytics (although events are a neater way to do that).
The simplest way is using
on_sent_ok: "location = 'http://example.com/';"
Obviously, you need to replace the http://example.com/ to the URL you want to redirect to.
That’s it. So simple, isn’t it? Try it and check if it works.
How to add an autoresponder
An autoresponder sends a user an email confirming their enquiry. Although it can seem like overkill, it can be a nice way to confirm that the request was sent and to provide users with contact details and other information that it might be handy for them to have.
It’s really easy to do in Contact Form 7, simply check the “Use mail (2)” box in the form’s configuration panel. Mail (2) is almost the same as Mail, except that Mail (2) is sent only when Mail has been sent successfully.
How to add id and class attributes to a form element
When you are creating a custom form, it can be really handy to be able to be able to specify an id and class for a form. To do this, just add the
html_class attributes into a
[contact-form-7 404 "Not Found"] shortcode.
[contact-form-7 404 "Not Found"]