New Google reCaptcha: How to change text “I'm not a robot”

Question

I\'ve installed the latest Google reCaptcha tool on our yoga website. Now the users are confused about the text \"I\'m not a robot\" that appears next to the checkbox.

M

Answer 1

This is not possible because the Same Origin Policy prohibits any script (that's on your site) trying to access an iframe (the captcha) that has another origin (Google server).

We should have no problem running the code below if we own both servers :)

$( ".g-recaptcha > div > div > iframe" ).contents().find( "#recaptcha-anchor-label" ).text('Custom Text');

Answer 2

Coming back to this old question - there is now an invisible version of the reCAPTCHA widget that allows you to design the UI on your own. You can bind the execution of the challenge to a button you've created or invoke it programmatically in the background.

I'm citing the docs page here for quick reference, you can read more about this here.

The necessary attributes are a class name 'g-recaptcha', your site key in the data-sitekey attribute, and the name of a JavaScript callback to handle completion of the captcha in the data-callback attribute.

Head:

   <script src="https://www.google.com/recaptcha/api.js" async defer></script>
   <script>
     function onSubmit(token) {
       document.getElementById("demo-form").submit();
     }
   </script>

---

Body:

  <form id='demo-form' action="?" method="POST">
    <button class="g-recaptcha" data-sitekey="your_site_key" data-callck='onSubmit'>Submit</button>
    <br/>
  </form>

Answer 3

It is possible to change "I'm not a robot" in Google Recaptcha into a different language by using language codes for the hl script parameter.

This is how you force Spanish, for example:

<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?hl=es">

Source: Google ReCaptcha Docs

Answer 4

You cannot change that specific text because it belongs to a third party iframe, though there is a workaround that fulfils exactly what the OP is asking for.

You can append a new div on the parent div you can control, aligning and overlapping it on the label text, considering the Google Captcha has always a fixed size. Therefore, according to documentation, considering you may have the main Captcha div on your code with class="g-recaptcha", you simply do:

$('.g-recaptcha').append('<div id="new_label"></div>');  
$('#new_label').text("My own text");
$('#new_label').css({"position":"absolute", "width":"160px", "top":"27px", "left":"53px", "background-color":"#f9f9f9"});

it works :)

Answer 5

I used client side captcha here is my code.its working fine for my portal.

 this.canvas = document.getElementById( 'myCanvas' ) as HTMLCanvasElement;
    var context = this.canvas.getContext( '2d' );
    context.clearRect( 0, 0, this.canvas.width, this.canvas.height );
    var alpha = [];
    alpha = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H','J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z',
        'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'm', 'n', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z',
         '2', '3', '4', '5', '6', '7', '8', '9'];
    var i;
    for ( i = 0; i < 6; i++ ) {
        var a = alpha[Math.floor( Math.random() * alpha.length )];
        var b = alpha[Math.floor( Math.random() * alpha.length )];
        var c = alpha[Math.floor( Math.random() * alpha.length )];
        var d = alpha[Math.floor( Math.random() * alpha.length )];
        var e = alpha[Math.floor( Math.random() * alpha.length )];
        var f = alpha[Math.floor( Math.random() * alpha.length )];
        var g = alpha[Math.floor( Math.random() * alpha.length )];
    }
    this.captchaCode = a + ' ' + b + ' ' + ' ' + c + ' ' + d + ' ' + e + ' ' + f + ' ' + g;
    var ctext = this.captchaCode;
    this.loginForm.controls['captcha'].setValue( this.captchaCode.replace( /\s/g, "" ) );

Here is I am drawing canvas image

 /*Text to image captcha */
    var imageObj = new Image();
    imageObj.onload = function() {
        context.drawImage( imageObj, 0, 0 );
        context.font = "24px arial";
        context.fillText( ctext, 84, 32 );
    };
    imageObj.src = 'assets/modules/dummy-assets/common/img/captcha2.jpg';

Answer 6

It is currently impossible using their tool. If you want to use a different method of stopping robots: Uninstall reCaptcha, and use something you have control over, maybe a simple randomized question and answer that pertains to yoga.