On March 26, 2019 we launched new MODX Forums. Please join us at the new MODX Community Forums.
Subscribe: RSS
  • You can make it ca. 95% responsive, by creating your own elements

    The only thing I can't modify is the width of the image that is displayed - the rest you can completely customise to suit your needs
    • I found this:
      http://jaicab.com/responsive-reCAPTCHA/

      Or:

      <style>
        #recaptcha_image { width:auto !important; max-width: 100%; height: auto !important}
        #recaptcha_image img { width:100% ;}
        #recaptcha_response_field { width: 100% !important; max-width: 302px; }
        .recaptchatable, #recaptcha_area tr, #recaptcha_area td, #recaptcha_area th{float: left;}
        #recaptcha_area tr{height: auto !important;}
        .recaptcha_image_cell{width: 100% !important; max-width: 300px;}
        img{height: auto !important;}
      </style>

      <script type="text/javascript">
       var RecaptchaOptions = {
          theme : 'clean',
          custom_theme_widget: 'recaptcha_widget'
       };
      </script>
        Evolution user, I like the back-end speed and simplicity smiley
      • Similar to what I already have

        My recaptcha is more in-style to what my website looks like

        The problem with adding max-width to the image is that it can get to small to be readable - thats what I meant with not being able to change the size of the image
        • Have an other possible solution which can be used for v2 aswell.

          @media only screen and (max-width:380px) {
            #recaptcha_table{
              transform:scale(0.77);
              -webkit-transform:scale(0.77);
              transform-origin:0 0;
              -webkit-transform-origin:0 0;
            }
          }
          


          https://www.geekgoddess.com/how-to-resize-the-google-nocaptcha-recaptcha/
            Evolution user, I like the back-end speed and simplicity smiley
          • I presume there are a variety of possibilites, I think it's simply down to finding the optimal solution for the current situation / template / design.
            • are you guys using v2 withOUT the ModX Extra/Plugin?

              ref: https://forums.modx.com/thread/99538/recaptcha-v2-how-to-change-it-s-theme
              • @SyberKnight

                This is the "Evo" development section, not "Revo"

                There is no official recaptcha snippet for Evo

                The version in use in my version of eForm is "recaptcha V.1"
                • Oops - sorry 'bout that.

                  Quote from: iusemodx at Mar 09, 2016, 07:28 AM
                  @SyberKnight

                  This is the "Evo" development section, not "Revo"

                  There is no official recaptcha snippet for Evo

                  The version in use in my version of eForm is "recaptcha V.1"
                  • Hi all,

                    If still interested in implementing of new Google reCaptcha just follow the steps below (tested on eForm 1.4.6):

                    1./ Get needed keys - https://www.google.com/recaptcha/intro/index.html. Click on "GET reCAPTCHA" button (top right).

                    2./ Add before </head> foll:
                    <script src='https://www.google.com/recaptcha/api.js'></script>

                    3./ Add in your form chunk (between <form></form>)
                    <div class="g-recaptcha" data-sitekey="YOUR_SITE_KEY"></div>

                    4./ Edit file eform.inc.php (it's in: assets/snippets/eForm/):
                    - Find "# check vericode", it's around line 185

                    - replace all in:
                    if($vericode) {}

                    - with:
                    if(isset($_POST['g-recaptcha-response'])){
                              $captcha=$_POST['g-recaptcha-response'];
                            }
                    		$secretKey = "YOUR_SECRET_KEY";
                            $ip = $_SERVER['REMOTE_ADDR'];
                            $response=file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=".$secretKey."&response=".$captcha."&remoteip=".$ip);
                            $responseKeys = json_decode($response,true);
                            if(intval($responseKeys["success"]) !== 1) {
                              $vMsg[count($vMsg)]=$_lang['ef_failed_vericode'];
                    		  $rClass['vericode']=$invalidClass; //added in 1.4.4
                            } ;

                    -finally it should look like:
                    # check vericode
                    		if($vericode) {
                    		if(isset($_POST['g-recaptcha-response'])){
                              $captcha=$_POST['g-recaptcha-response'];
                            }
                    		$secretKey = "YOUR_SECRET_KEY";
                            $ip = $_SERVER['REMOTE_ADDR'];
                            $response=file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=".$secretKey."&response=".$captcha."&remoteip=".$ip);
                            $responseKeys = json_decode($response,true);
                            if(intval($responseKeys["success"]) !== 1) {
                              $vMsg[count($vMsg)]=$_lang['ef_failed_vericode'];
                    		  $rClass['vericode']=$invalidClass; //added in 1.4.4
                            } ;}


                    Don't miss to replace "YOUR_SITE_KEY" and "YOUR_SECRET_KEY" above with your real keys from Google.

                    That's all.
                      valkovdesign.com