Woocommerce – How to add the new Google “no Captcha” reCaptcha into frontend registration form

2 comments

1. It’s being a while since Stimart opened this question but I’ll give here my suggestion in case someone needed it.

   Stimart here need to add some PHP code to validate the reCaptcha response value that google sends to the page when the user ticks the reCaptcha box to confirm they are not a robot.

   The hard way would be to write something like this in the functions.php file:

   function wooc_validate_re_captcha_field( $username, $email, $wpErrors )
   {
       $remoteIP = $_SERVER['REMOTE_ADDR'];
       $recaptchaResponse = $_POST['g-recaptcha-response'];
   
       $response = wp_remote_post( 'https://www.google.com/recaptcha/api/siteverify', [
           'body' => [
               'secret'   => 'PRIVATE KEY HERE !!!',
               'response' => $recaptchaResponse,
               'remoteip' => $remoteIP
           ]
       ] );
   
       $response_code = wp_remote_retrieve_response_code( $response );
       $response_body = wp_remote_retrieve_body( $response );
   
       if ( $response_code == 200 )
       {
           $result = json_decode( $response_body, true );
   
           if ( ! $result['success'] )
           {
               switch ( $result['error-codes'] )
               {
                   case 'missing-input-secret':
                   case 'invalid-input-secret':
                       $wpErrors->add( 'recaptcha', __( '<strong>ERROR</strong>: Invalid reCAPTCHA secret key.', 'woocommerce' ) );
                       break;
   
                   case 'missing-input-response' :
                   case 'invalid-input-response' :
                       $wpErrors->add( 'recaptcha', __( '<strong>ERROR</strong>: Please check the box to prove that you are not a robot.', 'woocommerce' ) );
                       break;
   
                   default:
                       $wpErrors->add( 'recaptcha', __( '<strong>ERROR</strong>: Something went wront validating the reCAPTCHA.', 'woocommerce' ) );
                       break;
               }
           }
       }
       else
       {
           $wpErrors->add( 'recaptcha_error', __( '<strong>Error</strong>: Unable to reach the reCAPTCHA server.', 'woocommerce' ) );
       }
   }
   add_action( 'woocommerce_register_post', 'wooc_validate_re_captcha_field', 10, 3 );
   

   You can check this article http://www.themelocation.com/how-to-add-custom-fields-to-user-registration-form-in-woocommerce/ and the way this plugin https://wordpress.org/plugins/theme-my-login/ handle this problem.

   or a lot easier is to install and set up a plugin like this one. 😉

   Hope that it helps. 🙂

   Log in to Reply

2. For Woocommerce Registration form, I think one can add Google Recaptcha using this simple code rather a plugin. Just need to grab ‘site-key’ from Google account http://www.google.com/recaptcha/admin#whyrecaptcha

   1. Define JS in the theme’s header.php file

   <script src="https://www.google.com/recaptcha/api.js" async defer> </script>
   

   2. Add this code in the theme’s functions.php file (Don’t forget to replace ‘##your-google-captcha-key##’ with your google captcha site-key)

   // Add field into the registration form
   
       function nada_woocommerce_edit_registration_form() {
               ?>
               <p id="recaptcha" class="g-recaptcha" data-sitekey="##your-google-captcha-key##"></p>
               <?php
           }
           add_action( 'woocommerce_register_form', 'nada_woocommerce_edit_registration_form', 15 );
   
       /**
        * Validate Woocommerce Registration form fields
        */
   
       function nada_validate_extra_register_fields( $errors, $username, $email ) {
           if ( empty( $_POST['g-recaptcha-response'] ) ) {
                   $errors->add( 'captcha-error', wp_kses_post( '<strong>Error</strong>: Captcha is missing.', 'nada' ) );
           }
           return $errors;
       }
       add_filter( 'woocommerce_registration_errors', 'nada_validate_extra_register_fields', 10, 3 );
   

   Log in to Reply