How to Add a Consent Checkbox in Contact Form 7

>How to Add a Consent Checkbox in Contact Form 7

In my previous article, I’ve shown you how to add a consent / privacy policy checkbox in your WooCommerce checkout page to comply with the GDPR rules.

In this post, I’ll show you how to add a consent checkbox in Contact Form 7, since you need to add one for contact forms as well.

This will be pretty easy, since Contact Form 7 has already implemented such a feature.

How to add a consent checkbox in Contact Form 7

In order to add a consent checkbox in Contact Form 7, you have to:

1. Go to Contact -> Contact Forms and select the contact form that you want to edit.

2. Add whatever privacy text you see fit.

Example: “I understand that this form collects my name and email so I can be contacted. For more information, please check our <a href=”https://example.com/privacy/”>privacy policy</a>.

3. Click with your mouse cursor at the beginning of the text and then click the acceptance button.

add consent checkbox in contact form 7

4. A pop-up box will appear with some options, which you can leave as is.

You could change the name, though, if you wish, with something more “friendly”, like consent-checkbox.

acceptance tag generator contact form 7

Don’t select the Make this checkbox checked by default option, since it’s against the GDPR rules. You have to let the users give their consent by checking the box.

5. Click the Insert Tag button.

6. After inserting the tag, it will appear at the beginning of the text.

acceptance tag contact form 7

7. This is important! Unlike other Contact Form 7 tags, the [acceptance] tag has to be closed! You can do that by adding [/acceptance] at the very end of the text.

close acceptance tag contact form 7

Note that the [acceptance] tag will be required by default!

Adding an error message

If users try to send a message without checking the consent checkbox, no error will appear. Nothing will happen when pressing the submit button. This is a default setting.

If you want an error to display when users try to send a message without checking the box, then you have to add the following code in the Additional Settings tab: acceptance_as_validation: on

consent checkbox error validation contact form 7

That’s it!

Now you can go and see how is your consent checkbox looking like on your contact form.

contact form 7 consent checkbox

That’s a wrap

Hope you liked the post and understood how to add a consent checkbox in Contact Form 7!

If you have any questions or thoughts, drop a comment, contact us or message us on Facebook.

You can also follow us on Twitter and subscribe to our YouTube channel.

If you want to start your own WordPress blog, or need a website for your business, our WordPress installation and customization service is at your disposal! We also provide WordPress support and maintenance!

You can also purchase a ready-made WordPress website with hosting and support included!

By | 2018-05-26T09:26:30+00:00 May 20th, 2018|Plugins|6 Comments

6 Comments

  1. James May 24, 2018 at 1:48 PM - Reply

    Thanks for this, it is a great help. Do you know why I am getting the checkbox above the text as opposed to being beside it as in your example?

    • ThemeSkills May 24, 2018 at 7:49 PM - Reply

      Hello! Glad you found the post helpful! That happens because of some CSS issues. It’s probably a conflict between your theme and Contact Form 7.

  2. Julie May 25, 2018 at 12:32 AM - Reply

    great tips – just want I need. Just a bit of an issue – When you make this tick box and force acceptance as validation, the entire text area becomes a click area for the tick box therefore disabling the user’s ability to click on the link of ‘privacy policy’.
    How did you get around this?

    • ThemeSkills May 26, 2018 at 8:43 AM - Reply

      Did you properly close the link tag? In the images, I forgot to add an extra at the end, but I’ve added it in the text code. I’ll replace it in the images too.

      If you did properly close the tag, it might mean that the theme intervenes in some way, making the whole text a link. I haven’t done anything special to prevent this, it works fine as is.

  3. solarian May 25, 2018 at 1:33 PM - Reply

    hey! any ideea how to show a error when consent is not checked? Like “You must accept bla bla before sending”.
    thx!

    • ThemeSkills May 26, 2018 at 9:27 AM - Reply

      Heya! Yep, I’ve updated the post and showed how to do that. Check it out!

Leave A Comment

Get our latest posts once a week, right in your inbox
Subscribe
close-image