HappyForms & reCaptcha

To integrate HappyForms with Complianz and reCaptcha you will need some extra actions to block/enable reCaptcha on consent. Follow the below steps to complete your integration.

Configuration requirements

1. In Complianz – Wizard – Consents – Integrations make sure you have selected reCaptcha as Third Party, and answer the follow-up question to make sure you block reCaptcha before consent.
2. Make sure the HappyForms integration is enabled under Complianz – Integrations
3. For best results, please use reCaptcha V3 Invisible API keys in HappyForms

Editing your HappyForm

1. We will add some CSS classes to a  new field
2. We will configure some settings to comply with privacy laws (optional)
3. We will add some Custom CSS

1. Create a new (placeholder) field

• HappyForms does not have a custom HTML field, so we will use a Single Choice field. 
• Make sure “Require an answer” is unchecked. Proceed by adding the following CSS classes to “Additional CSS class(es):

cmplz-accept-service cmplz-accept-marketing cmplz-happyforms

• Add: “Click here to enable reCaptcha Cookies before sending this form” as an answer, or a similar text.
• Make sure to hide the main label for this Single Choice field.

2. Check the Setup tab (optional)

To comply with privacy laws, unchecking the following functions are recommended:

• Save incomplete and abandoned submissions
• Store replies and attachments in database or delete them after X days and mention this specifically in your privacy statement
•  Capture user metadata (IP, language, platform, time, and timezone)

3. Add some Custom CSS

In step 1 you created a placeholder. This placeholder is not necessary if consent is granted, this will make sure it disappears accordingly:

.cmplz-google-recaptcha .cmplz-happyforms, .cmplz-marketing .cmplz-happyforms {
	display:none;
}

This is the example, without any further styling and a basic theme. It shows a placeholder above the send button that disappears when consent is granted, the placeholder is clickable.