<div data-service="google-recaptcha" data-category="marketing" class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing style="text-align: left; cursor: pointer;">Click here to accept reCaptcha cookies before sending the form.</div>
This “original” code is incorrect: the class attribute has no ending quote.
But I’m not sure if the forum software mangled the correct code you posted, or if the original code itself is incorrect.
So please re-post your original code and what Forminator changes it to, but make sure to select each block of code and hit the CODE button, so that the code will be properly formatted you can see in my post.
Standing by to help resolve this.
The original code from Complianz can be found here:
https://complianz.io/blocking-recaptcha-manually/
I’m not sure if this is what you need? I tried to follow the instructions above.
The original code…
<div data-service="google-recaptcha" data-category="marketing" class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing style="text-align: left; cursor: pointer;">Click here to accept reCaptcha cookies before sending the form.</div>
<div class="cmplz-blocked-content-container cmplz-blocked-content-notice" style="text-align: left;">
<a class="cmplz-link" tabindex="0" href="/cookie-policy/" aria-label="learn more about cookies">Read more</a>
</div>
And From the form after hitting Apply…
<div class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing style=" data-service="google-recaptcha" data-category="marketing">Click here to accept reCaptcha cookies before sending the form.</div>
<div class="cmplz-blocked-content-container cmplz-blocked-content-notice" style="text-align: left;"><a class="cmplz-link" tabindex="0" href="/cookie-policy/" aria-label="learn more about cookies">Read more</a></div>
I tracked down the original code on the Complianz website link you gave, and the same error exists in the code published on their website.
Here’s the problem in the original code:
class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing style="...
… the class attribute isn’t closed before the style attribute begins.
So this should have been:
class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing" style="...
Please copy and paste the corrected code below.
1) Note that the only change I’ve done is to add the missing ending quotation mark (") on the class attribute.
2) Note that Forminator may still change the order of the attributes, but their values will remain the same (previously the style attribute became blank). The order of the attributes isn’t important.
<div data-service="google-recaptcha" data-category="marketing" class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing" style="text-align: left; cursor: pointer;">Click here to accept reCaptcha cookies before sending the form.</div>
<div class="cmplz-blocked-content-container cmplz-blocked-content-notice" style="text-align: left;">
<a class="cmplz-link" tabindex="0" href="/cookie-policy/" aria-label="learn more about cookies">Read more</a>
</div>
Hello @rana-rene !
I trust you’re doing well!
What @gappiah said is correct regarding the error in the code (missing ending quote in the class attribute). This is however not the cause of the issue here. Forminator will filter out some of the pieces of this code by default (this needs to be in place due to security reasons and rules for plugins in the wordpress.org repository).
I’ve asked our Second Line Support to check if they can provide a snippet which will work around this. We’ll update you here as soon as we hear back from them.
Kind regards,
Pawel
Hello once more @rana-rene !
Got feedback from the SLS team and a snippet. Tested it on my site and it looks like it worked fine. Here’s the snippet:
<?php
add_filter(
'wp_kses_allowed_html',
function( $tags ) {
if ( 'post' === $context ) {
$tags['div']['data-*'] = true;
}
return $tags;
}
);
To install:
– copy the code to a .php file with any name
– place the file in wp-content/mu-plugins/ directory (create the directory if it doesn’t exist)
– paste the Complaint code again in the HTML Field (please remember to close the quote at the end of the class attribute)
– test
Best regards,
Pawel
I created the .php file wpmu-complianz.php … and placed it in wp-content/mu-plugins/
<?php
add_filter(
'wp_kses_allowed_html',
function( $tags ) {
if ( 'post' === $context ) {
$tags['div']['data-*'] = true;
}
return $tags;
}
);
Then used Georges code from above…
<div data-service="google-recaptcha" data-category="marketing" class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing" style="text-align: left; cursor: pointer;">Click here to accept reCaptcha cookies before sending the form.</div>
<div class="cmplz-blocked-content-container cmplz-blocked-content-notice" style="text-align: left;">
<a class="cmplz-link" tabindex="0" href="/cookie-policy/" aria-label="learn more about cookies">Read more</a>
</div>
The bottom div works, but the top div does not. It doesn’t display at all. Actually the bottom div isn’t even necessary, it’s just a link to the policy.
So Georges code above, is still changing, see below.
From…
<div data-service="google-recaptcha" data-category="marketing" class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing" style="text-align: left; cursor: pointer;">Click here to accept reCaptcha cookies before sending the form.</div>
to…
<div class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing" style="text-align: left; cursor: pointer;" data-service="google-recaptcha" data-category="marketing">Click here to accept reCaptcha cookies before sending the form.</div>
I will leave the top div in place, if it helps at all to look at the source code. Thanks
If you look through the page from Complianz above…
https://complianz.io/blocking-recaptcha-manually/
You will see I am also using the following in Custom CSS. Could something here be part of the problem?
/*** COMPLIANZ – CAPTCHA PLACEHOLDER DISPLAY ***/
.cmplz-blocked-content-container.recaptcha-invisible, .cmplz-blocked-content-container.g-recaptcha {
display:none;
}
If I remove this from Custom CSS, the top div does display. It’s has a white background and text on the page, but I can tell the text that should be displayed is there and it’s clickable, it functions.
However… the reCaptcha place holder, then also displays, which defeats the purpose. The purpose being to replace this “place holder” with text and a link that allows you to accept reCaptcha.
I will leave this in place for now… you can see the page and form here.
https://kunkuman.com/
Hi @rana-rene
I can see there is a JS error on your browser console for ReCaptcha causing the problem but before we keep going on troubleshooting, I may be missing something had you enabled the Forminator integration on your plugin?
https://monosnap.com/file/K7ZDEhcBmNodniSLOf1q5GrZWMoagx
https://monosnap.com/file/je9EAsO990AM6EMQWuGP9dHZvq0k8H
You shouldn’t need to place any HTML, just enable the integration and add the Forminator default Captcha field.
Best Regards
Patrick Freitas
Just so you know… I replied to this right away… and when I didn’t hear back for a couple of days came here to have a look, and my last post which was substantial, isn’t here.
I really do not understand the last post above. “You shouldn’t need to place any HTML, just enable the integration and add the Forminator default Captcha field.”
It seems you haven’t read the comments above. Yes… the Forminator integration was made… the Captcha (ReCaptcha) has been working all alone. What I am trying to do is replace the giant, frankly ugly, ReCaptcha placeholder with a simple like of text and link do accomplishes the same. “Click here to accept ReCaptcha, and the associated cookies.
If you read this quick article from Complianz, (the link has been included twice above) you should understand exactly what I trying to do. You will also find the CSS and HTML provided by Complianz.
At this time I’m using you code and your .php (see George and Pawel’s posts above), but this still isn’t working “in Forminator”?
Every time I set this up… “Forminator”changes the code on Apply
<div data-service="google-recaptcha" data-category="marketing" class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-service cmplz-accept-marketing" style="text-align: left; cursor: pointer;">Click here to accept reCaptcha cookies before sending the form.</div>
<div class="cmplz-blocked-content-container cmplz-blocked-content-notice" style="text-align: left;">
<a class="cmplz-link" tabindex="0" href="/cookie-policy/" aria-label="learn more about cookies">Read more</a>
</div>
and it of course does not work as intended.
Thanks,
John
Hi @rana-rene
Thank you for response!
As for your missing post:
We don’t have any moderation/administration privileges here on this forum – our access is at the exact same level as yours. We cannot hide or remove any posts from here, as well as we cannot edit your posts. We don’t also have any access to logs.
I’m not sure why the post is missing and as much as I’d love to explain that, I don’t have answer. I can only assume that it might have not been posted due to some unexpected temporary glitch on this site or perhaps you have actually responded to e-mail notification directly instead of posting here. But I’m sorry for any confusion that could have happened due to this and for delay on our end.
As for the issue itself:
The “order” of attributes in that HTML doesn’t matter so that’s not the problem here. As my colleague already mentioned, there’s reCaptcha related error on site. The specific error states “reCaptcha placeholder element must be empty” and that happens usually if reCaptcha JS library is loaded multiple times on the same site.
I checked it and this is happening on your site. First, recaptcha script (from Google) is loaded in site’s header and then second time in footer. The second one is loaded by Forminator but I cannot tell why the first one (the one in header) is there.
Are you loading it with some custom code or code in theme header or functions file? If yes, see if you can modify it to not load that script in header at all (on pages with Forminator forms).
If it’s not that, then please double-check other plugins and theme settings to see if there’s captcha configuration setup anywhere there and see if disabling it helps.
Kind regards,
Adam
Hello @rana-rene ,
We haven’t heard from you for some time now, so it looks like you don’t need our assistance anymore.
Feel free to re-open this ticket if needed.
Kind regards
Kasia
