Iubenda logo
Start generating

Documentation

Table of Contents

Consent Solution for Elementor

Have you generated a website using Elementor and need to meet GDPR consent requirements?

Well, you’re in the right place. In this guide, we’ll take a look at GDPR consent proof requirements and how to add iubenda’s Consent Solution to your Elementor site.

Jump to How to add the Consent Solution to Elementor

To put it simply, you do need GDPR proof of consent for your Elementor site, and here’s why:

Consent records are specifically required under the GDPR. Keeping a complete and thorough record of consent is required and is an essential part of privacy compliance. The records of proof are managed by you, the Data Controller. As a result, the GDPR requires you to keep “proofs” or records of consent that contain specific details that might prove that the consent received is genuine and therefore valid under the GDPR. Consent must be explicit, freely provided, and verifiable under the GDPR. You can read up more on iubenda’s Consent Solution here.

These records should include a way of identifying the user, proof of consent, record of the consenting action, and the legal documents available to the user at the time of consent, among other things.

The following information should be recorded:

  • who provided the consent; 
  • when and how consent was obtained from the particular user; 
  • the consent collecting form they were presented with at the time of collection; and 
  • whatever conditions and legal documents were in effect at the time the consent was obtained.

You can read about the full requirements here.

iubenda’s consent solution automatically records and manages GDPR & LGPD consent and privacy preferences for each of your users. You can read up more on iubenda’s Consent Solution here.

How to add iubenda’s Consent Solution on Elementor

Elementor PRO native forms + iubenda’s Consent Solution

The following guide on how to integrate our Consent Solution with Elementor PRO is designed specifically for the use of developers. We understand this is a complex guide, please use this example as a starting point and talk with your technical team to customize it according to your specific scenario. 

Since Elementor PRO is not compatible with our WordPress plugin and conflicts may arise when using our Javascript method, we decided to create an example integration method using Elementor PRO API and our Consent Solution API.

To create a consent in Elementor PRO it is necessary to paste in the functions.php file (in the WordPress theme directory) a PHP function named save_consent() and add an action to the form_submitted event.

Please customize private API key and “subject” data sent by a POST request and/or preference name

//SAVE CONSENT ON CONSENT SOLUTION AFTER FORM SUBMISSION
add_action( 'elementor_pro/forms/form_submitted', 'send_consent');
function send_consent() {

$consent_data = array(
"timestamp" => date('Y-m-d H:i:s'),

"subject" => array(

"full_name"=>
$_POST["form_fields"]["name"],
"email" => 
$_POST["form_fields"]["email"],

),
"legal_notices" => array(
array(
"identifier" => "terms"
),
array(
"identifier" => "privacy_policy"
)
),

"preferences" => array(

"
privacy_policy_elementor" => true
),

);

$req = curl_init();
curl_setopt($req, CURLOPT_URL, '
https://consent.iubenda.com/consent');
curl_setopt($req, CURLOPT_RETURNTRANSFER, true);
curl_setopt($req, CURLOPT_HTTPHEADER, array(
'ApiKey: 
YOUR_PRIVATE_API_KEY',
'Content-Type: application/json'
));
curl_setopt($req, CURLOPT_POST, true);
curl_setopt($req, CURLOPT_POSTFIELDS, json_encode($consent_data));
$response = curl_exec($req);
//echo $response;

}

This function reads consent data coming from Elementor PRO via a POST request.

It contains an array, which is the PHP example you can find here.

What you should customize:

  1. Subject data: fields accepted are only full_name, last_name, first_name, email 

In our PHP function, you will find one or more of these keywords followed by the super global $_POST variable which contains the value of that, so you can create the consent with the values that the user filled in the form. 


More info about the $_POST superglobal variable in the official PHP documentation.

For example, suppose that you have created a form using Elementor PRO that has the following HTML:

<form action="/action_page.php">
<label for="fname">Full name:</label><br>
<input type="text" id="fname" name="fname" value="John"><br>
<label for="lname">Email:</label><br>
<input type="text" id="lname" name="email" value="Doe"><br><br>
<input type="submit" value="Submit">
</form>

You will customize this part of our example, shown below:

in this way:

"subject" => array(
"first_name"=>$_POST["fname"]
"email" =>$_POST["email"];
),

2. Next, add your own Consent Solution Private API Key in the following function, specifically here:

Please note that the Consent Solution has 2 different keys, public and private, use always the private since the public one is not going to work with our API.

3. After that, you can also customize the preferences, they usually coincide with the checkbox that the user accepts when sending the form:

"preferences" => array("privacy_policy_elementor" => true)

But you can also decide to pass this value using the $_POST variable as we have done within the “subject” if you want to read it dynamically.

4. Now, you can customize the consent, passing also the proofs of consent, as we have done in this example.

"proofs": [
{
"content": "proof_1",
"form": "proof_1 form"}] 

where “content” can be a recap of values inserted by the user in the form and “form” is the HTML code of the form filled by the user.

5. Lastly, Remember to add add_action( 'elementor_pro/forms/form_submitted', 'send_consent'); so you can launch the function send_consent when the Elementor PRO form is submitted

That’s it. Please use this example as a starting point and talk with your technical team to customize it according to your specific scenario.