CODEWITHSUNDEEP
captcharecaptcha
nu everest
nu everest

Reputation: 10259

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

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.

Most of our users do not know what the word "robot" means in this context and they think the form is broken. They also feel less safe using our form as it is weird to see the word "robot" on a yoga website.

How do I change the text "I'm not a robot" to something else that the users understand?

The docs appear silent on this point...

Also, it seems like the contents of the reRecaptcha are completely locked down via remote JS and CSS. I've unsuccessfully tried using the following javascript to change the text for Googles recaptcha-anchor-label:

<script type="text/javascript">
    $(document).ready(function () {
        $("#recaptcha-anchor-label").text("Something different.");
    });
</script>

Upvotes: 25

Views: 36417

Answers (5)

Nagnath Mungade
Nagnath Mungade

Reputation: 1009

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';

Upvotes: -1

Nearoo
Nearoo

Reputation: 4936

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>

Upvotes: 2

razu
razu

Reputation: 2077

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');

Upvotes: 3

sr9yar
sr9yar

Reputation: 5320

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

Upvotes: 37

clairestreb
clairestreb

Reputation: 1292

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.

Upvotes: 4

Related Questions