Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Remove frameborder attribute on the iframe of Recaptcha

I need to know where I can change this line of code of Google recaptcha code:


The frameborder attribute on the iframe element is obsolete. I would like to change the frameborder="0" with in the iframe to something like border:none;.

when validating it gives an error saying "The frameborder attribute on the iframe element is obsolete. Use CSS instead.".

Any ideas of how to fix this?

 <dd class="auto recaptcha">
    <p class="cap">ReCAPTCHA entry is for testing whether you are a human visitor and to prevent automated spam submissions.</p>
    <div class="recaptcha-item">
      <script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LfaXscSAAAAAMcN5Mfvza9CyYfV7K5__BbQiPBN"></script>

<noscript>
    <iframe src="http://www.google.com/recaptcha/api/noscript?k=6LfaXscSAAAAAMcN5Mfvza9CyYfV7K5__BbQiPBN" height="300" width="500" frameborder="0"></iframe><br/>
    <textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
    <input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>
</noscript>                </div>

              <p><sup class="required">*</sup> = Required Fields</p>
    </dd>

Screenshot of wf4's answer

Screenshot of wf4's answer

like image 877
Mahesh Avatar asked Nov 01 '22 06:11

Mahesh


1 Answers

The answer is in your edit. There is a script, src = http://www.google.com/recaptcha/api/challenge which will use javascript to create an iframe in your site, the noscript bit will be used if scripts are not available. so if you remove

<script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LfaXscSAAAAAMcN5Mfvza9CyYfV7K5__BbQiPBN"></script>

and the <noscript> </noscript> tags, BUT NOT THE CONTENT, then you can remove the frameborder="0" which you don't want. so your complete code would be:

 <dd class="auto recaptcha">
<p class="cap">ReCAPTCHA entry is for testing whether you are a human visitor and to prevent automated spam submissions.</p>
<div class="recaptcha-item">


<iframe src="http://www.google.com/recaptcha/api/noscript?k=6LfaXscSAAAAAMcN5Mfvza9CyYfV7K5__BbQiPBN" height="300" width="500"></iframe><br/>
<textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
<input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>
            </div>

          <p><sup class="required">*</sup> = Required Fields</p>
</dd>

for the styling, this would also have been added using the script, this should be what you will need to include in your head

<style type="text/css">
.recaptchatable td img{display:block}.recaptchatable .recaptcha_r1_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') 0 -63px no-repeat;width:318px;height:9px}.recaptchatable .recaptcha_r2_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -18px 0 no-repeat;width:9px;height:57px}.recaptchatable .recaptcha_r2_c2{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -27px 0 no-repeat;width:9px;height:57px}.recaptchatable .recaptcha_r3_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') 0 0 no-repeat;width:9px;height:63px}.recaptchatable .recaptcha_r3_c2{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -18px -57px no-repeat;width:300px;height:6px}.recaptchatable .recaptcha_r3_c3{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -9px 0 no-repeat;width:9px;height:63px}.recaptchatable .recaptcha_r4_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -43px 0 no-repeat;width:171px;height:49px}.recaptchatable .recaptcha_r4_c2{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -36px 0 no-repeat;width:7px;height:57px}.recaptchatable .recaptcha_r4_c4{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -214px 0 no-repeat;width:97px;height:57px}.recaptchatable .recaptcha_r7_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -43px -49px no-repeat;width:171px;height:8px}.recaptchatable .recaptcha_r8_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -43px -49px no-repeat;width:25px;height:8px}.recaptchatable .recaptcha_image_cell center img{height:57px}.recaptchatable .recaptcha_image_cell center{height:57px}.recaptchatable .recaptcha_image_cell{background-color:white;height:57px}#recaptcha_area,#recaptcha_table{width:318px!important}.recaptchatable,#recaptcha_area tr,#recaptcha_area td,#recaptcha_area th{margin:0!important;border:0!important;padding:0!important;border-collapse:collapse!important;vertical-align:middle!important}.recaptchatable *{margin:0;padding:0;border:0;font-family:helvetica,sans-serif;font-size:8pt;color:black;position:static;top:auto;left:auto;right:auto;bottom:auto}.recaptchatable #recaptcha_image{position:relative;margin:auto}.recaptchatable #recaptcha_image #recaptcha_challenge_image{display:block}.recaptchatable #recaptcha_image #recaptcha_ad_image{display:block;position:absolute;top:0}.recaptchatable img{border:0!important;margin:0!important;padding:0!important}.recaptchatable a,.recaptchatable a:hover{cursor:pointer;outline:none;border:0!important;padding:0!important;text-decoration:none;color:blue;background:none!important;font-weight:normal}.recaptcha_input_area{position:relative!important;width:153px!important;height:45px!important;margin-left:7px!important;margin-right:7px!important;background:none!important}.recaptchatable label.recaptcha_input_area_text{margin:0!important;padding:0!important;position:static!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;background:none!important;height:auto!important;width:auto!important}.recaptcha_theme_red label.recaptcha_input_area_text,.recaptcha_theme_white label.recaptcha_input_area_text{color:black!important}.recaptcha_theme_blackglass label.recaptcha_input_area_text{color:white!important}.recaptchatable #recaptcha_response_field{width:153px!important;position:relative!important;bottom:7px!important;padding:0!important;margin:15px 0 0 0!important;font-size:10pt}.recaptcha_theme_blackglass #recaptcha_response_field,.recaptcha_theme_white #recaptcha_response_field{border:1px solid gray}.recaptcha_theme_red #recaptcha_response_field{border:1px solid #cca940}.recaptcha_audio_cant_hear_link{font-size:7pt;color:black}.recaptchatable{line-height:1!important}#recaptcha_instructions_error{color:red!important}.recaptcha_only_if_privacy{float:right;text-align:right}#recaptcha-ad-choices{position:absolute;height:15px;top:0;right:0}#recaptcha-ad-choices img{height:15px}.recaptcha-ad-choices-collapsed{width:15px;height:15px;display:block}.recaptcha-ad-choices-expanded{width:75px;height:15px;display:none}#recaptcha-ad-choices:hover .recaptcha-ad-choices-collapsed{display:none}#recaptcha-ad-choices:hover .recaptcha-ad-choices-expanded{display:block}
.recaptcha_is_showing_audio .recaptcha_only_if_image,.recaptcha_isnot_showing_audio .recaptcha_only_if_audio,.recaptcha_had_incorrect_sol .recaptcha_only_if_no_incorrect_sol,.recaptcha_nothad_incorrect_sol .recaptcha_only_if_incorrect_sol{display:none !important}
</style>
like image 61
wf4 Avatar answered Nov 09 '22 15:11

wf4