보이지 않는 Google reCaptcha

이전에 이런 유형의 질문을 받았지만 답을 얻을 수 없었습니다. 문의 양식이 있는데 새로운 Invisible Google Recaptcha를 구현하고 싶습니다. 그러나 <button> 대신 <input>을 사용했는데이를 수행하는 방법을 알 수 없습니다. 어떤 도움을 주시면 감사하겠습니다보이지 않는 Google reCaptcha

<button 
 
class="g-recaptcha" 
 
data-sitekey="############################" 
 
data-callback="YourOnSubmitFn"> 
 
Submit 
 
</button>

input, textarea { 
 
    padding: 5px; 
 
    margin: 10px; 
 
    font-family: Cambria, Cochin, serif; 
 
    font-size: medium; 
 
    font-weight: bold; 
 
    outline: none; 
 
} 
 

 
input[type=text], textarea { 
 
    width: 350px; 
 
    background-color: #b6b6b4; 
 
    border: 1px solid #989898; 
 
    border-radius: 10px; 
 
} 
 
input[type=submit] { 
 
    width: 100px; 
 
    background-color: #989898; 
 
    border: 1px solid #707070; 
 
    font-size: large; 
 
    color: #000; 
 
    border-radius: 5px; 
 
} 
 
input[type=submit]:hover { 
 
    background-color: #848484; 
 
    cursor: pointer; 
 
} 
 
input[type=submit]:active { 
 
    background-color: #989898; 
 
}

<script src="https://www.google.com/recaptcha/api.js"></script> 
 
<!--CONTACT FORM--> 
 

 

 

 
<form name="contactform" method="post" action="send_form_email.php"> 
 
    
 
     <div> 
 
      <input name="name" type="text" placeholder="Name..." required> <br> </div> 
 
      <div> 
 
      <input name="email" type="text" placeholder="Email..." required> 
 
      <br> 
 
      </div> 
 

 
    <input type="checkbox" name="maillist" value="1" checked> Subscribe to mailing list<br> 
 

 

 

 
      <div> 
 
      <input name="game" type="text" placeholder="Game suggestions..."> 
 
      <br> 
 
      </div> 
 

 

 
      <div> 
 
      <textarea cols="30" name="comment" rows="9" placeholder="Comments..."></textarea> 
 
      <br> </div> 
 
      
 

 
     <div> 
 
     <input name="submit" type="submit" value="Submit"> </div> 
 
    </form>

가 그럼 난 구글 reCAPTCHA를 버튼이 : 여기에 내가 가지고있는 문의 양식에 대한 내 코드는 . 또한 오른쪽 하단의 ReCaptcha 로고를 제거 할 수 있는지 궁금합니다.

출처

2017-04-10 Sank6

확인이 g-reCAPTCHA를 태그 속성과 grecaptcha.render 파라미터 섹션

g-reCAPTCHA를 태그 속성 : 데이터 배지
grecaptcha.render 파라미터 : 배지
값 : bottomright bottomleft 인라인
기본값 : bottomright
설명 : 선택 사항. reCAPTCHA 배지의 위치를 변경하십시오. '인라인'을 사용하면 CSS를 제어 할 수 있습니다.

이 inline에 data-badge 속성, 통지 설정 기본 example

<html> 

<head> 
    <title>reCaptcha example</title> 
    <script src='https://www.google.com/recaptcha/api.js'></script> 
    <style> 
     .grecaptcha-badge { 
      display: none; 
     } 
    </style> 
</head> 

<body> 
    <form id="demo-form" action="/post" method="post"> 
     <button data-sitekey="your_site_key" data-callback='onSubmit' data-badge="inline">Login</button> 
    </form> 
</body> 

</html>

인 data-badge="inline" :

<style> 
    .grecaptcha-badge { 
     display: none; 
    } 
</style>

<button type="submit" data-sitekey="your_site_key" data-callback='onSubmit' data-badge="inline">Login</button>

그리고 HTML 코드에 또한 CSS에 추가 할 수도 있습니다.

.grecaptcha-badge { 
    display: none; 
}

출처

2017-09-25 09:37:11 nbari

그것은 페이지를 통해 Google reCAPTCHA를 보이지 않는 배지를 숨길이를보십시오.

.grecaptcha-badge { display: none !important; }

구글은 "개인 정보 보호"와 "약관"링크 존재하기를 척으로 배지가 표시되어야합니다 유의하십시오. reCaptcha 문서에서

출처

2017-04-10 18:03:18 Vigneshwar

소리가 아주 좋지만,이 코드는 제 CSS에 넣으시겠습니까? 나는 정상적인 recaptcha를 사용하고 이것을 보이지 않는 것을 추가합니까?도와 주셔서 감사합니다 – Sank6

이 코드를 CSS 코드에 넣으십시오. –

답변

관련 문제