MyBB Group
Hide reCAPTCHAInvisible badge - Printable Version

+- MyBB Group (https://mybb.group)
+-- Forum: Beside You (https://mybb.group/Forum-Beside-You)
+--- Forum: Guidebook (https://mybb.group/Forum-Guidebook)
+--- Thread: Hide reCAPTCHAInvisible badge (/Thread-Hide-reCAPTCHAInvisible-badge)

Hide reCAPTCHAInvisible badge - effone - 14-05-2019

Have ever reCAPTCHA Invisible badge annoyed you? Specially when you are using a mobile device with a responsive theme and the badge slides out from the right hiding some of your important form control? Say, the form Submit button? - disgusting situation. 
[Image: F8oS0.png]
Well, let's hide it.

Wait! OMG! effone gone mad! Thats a straight breach of Google's TOS. 
Google reCAPTCHA v3 TOS Wrote:You agree to explicitly inform visitors to your site that you have implemented the Invisible reCAPTCHA on your site.

Well, well. Hang on. You can still hide it. Google now allows it under certain conditions (As per latest reCAPTCHA FAQ, 11 Dec, 2018 update).
https://developers.google.com/recaptcha/docs/faq

So, let's hide it. Super easy. Add this CSS at the end of your global.css:
.grecaptcha-badge {
    display: none;
}

Save stylesheet. Refresh!
Eh, the badge is still there sliding out. Because the container is not inline. You have to declare your badge to be inline in order to hide it.

Open template member_register_regimage_recaptcha_invisible and find this chunk:
grecaptcha.render(target.get(0), {
    'sitekey': '{$public_key}',
    'callback': captchaOnSubmit
}, true);

Change it to:
grecaptcha.render(target.get(0), {
    'sitekey': '{$public_key}',
    'callback': captchaOnSubmit,
    'badge' :'inline'
}, true);

Yes, the badge is gone!

Now, the most important part to remain legal:
You have to add this line to every page you are using reCAPTCHA in, if you are not sure - add it to footer template:
This site is protected by reCAPTCHA and the Google
    <a href="https://policies.google.com/privacy">Privacy Policy</a> and
    <a href="https://policies.google.com/terms">Terms of Service</a> apply.

Note:
  • This is demonstrated for registration page but is applicable to anywhere you are using reCAPTCHA.
  • Some additional requirement/s of Google Brand guidelines: "Don't mimic Google's typographic style. The writeup should blend your site's typography.
Done. Happy coding ... Big Grin

RE: Hide reCAPTCHA Invisible badge - mujeebdgk - 20-08-2019

i think this tutorial is already applied on this site but unfortunately after filling registration form it takes more than 1 minute to enable regiration/ signup button 

checked it on mybb.group domain for singing up this account

RE: Hide reCAPTCHA Invisible badge - effone - 20-08-2019

May be it received a response from Google late, thats the only possible reason I can think of.
Still, will test it further. But the response time is no way related to this tutorial.

Thanks for the report though ...