Google Invisible reCAPTCHA 배지를 숨기는 방법
새로운 Google Invisible reCATPTCHA를 구현하면 화면 우측 하단에 기본적으로 "reCAPTCHA에 의해 보호됨" 배지가 표시됩니다.
이걸 숨기고 싶어요.
이제 Google은 FAQ에서 배지를 숨길 수 있습니다.
리캡차 배지를 숨기고 싶어요무엇이 허용됩니까?
사용자 흐름에 reCAPTCHA 브랜딩을 가시적으로 포함하는 한 배지를 숨길 수 있습니다.다음 텍스트를 포함하십시오.
This site is protected by reCAPTCHA and the Google <a href="https://policies.google.com/privacy">Privacy Policy</a> and <a href="https://policies.google.com/terms">Terms of Service</a> apply.예를 들어 다음과 같습니다.
따라서 다음 CSS를 사용하여 숨길 수 있습니다.
.grecaptcha-badge {
visibility: hidden;
}
사용 안 함display: none;체크가 되어 것 에(thanks) 스팸 체크를 디세블로 합니다Zade).
모든 접근방식을 테스트했습니다.
display: none팸팸검!!!!!!!!!!!!!
visibility: hidden ★★★★★★★★★★★★★★★★★」opacity: 0스팸 체크를 무효로 하지 말아 주세요.
사용할 코드:
.grecaptcha-badge {
visibility: hidden;
}
배지 아이콘을 숨기면 Google은 다음 항목을 추가하여 양식에서 서비스를 참조하도록 합니다.
<small>This site is protected by reCAPTCHA and the Google
<a href="https://policies.google.com/privacy">Privacy Policy</a> and
<a href="https://policies.google.com/terms">Terms of Service</a> apply.
</small>
를 합니다.data-badge inline
<button type="submit" data-sitekey="your_site_key" data-callback="onSubmit" data-badge="inline" />
그리고 다음 CSS를 추가합니다.
.grecaptcha-badge {
display: none;
}
Google reCaptcha v3의 경우 FAQ에 다음과 같이 표시됩니다.
사용자 흐름에 reCAPTCHA 브랜딩을 가시적으로 포함하는 한 배지를 숨길 수 있습니다.다음 텍스트를 포함하십시오.
This site is protected by reCAPTCHA and the Google <a href="https://policies.google.com/privacy">Privacy Policy</a> and <a href="https://policies.google.com/terms">Terms of Service</a> apply.예를 들어 다음과 같습니다.
주의: 배지를 숨기려면 다음을 사용하십시오.
.grecaptcha-badge { visibility: hidden; }
reCaptcha v2에 적용되는지 여부는 명확하지 않습니다.v3로 업그레이드하는 것이 방문자에게 더 좋은 경험이 될 것입니다.
TOU에 따르면 배지를 숨기는 것은 합법적이지 않고 기존 배치 옵션이 UI 및/또는 UX를 손상시켰기 때문에 고정 위치 설정을 모방한 다음 커스터마이징을 만들었습니다.
배지 컨테이너에 몇 가지 CSS를 적용하기만 하면 됩니다.
.badge-container {
display: flex;
justify-content: flex-end;
overflow: hidden;
width: 70px;
height: 60px;
margin: 0 auto;
box-shadow: 0 0 4px #ddd;
transition: linear 100ms width;
}
.badge-container:hover {
width: 256px;
}
내 생각엔 그게 네가 법적으로 밀어붙일 수 있는 범위인 것 같아.
연락처 페이지를 제외한 모든 페이지에서 배지를 숨기기로 했습니다(Wordpress 사용).
/* Hides the reCAPTCHA on every page */
.grecaptcha-badge {
visibility: hidden !important;
}
/* Shows the reCAPTCHA on the Contact page */
/* Obviously change the page number to your own */
.page-id-17 .grecaptcha-badge {
visibility: visible !important;
}
저는 웹 개발자가 아니니 잘못된 점이 있으면 수정해 주세요.
편집: 표시 대신 가시성을 사용하도록 업데이트되었습니다.
네, 할 수 있어요.css 또는 javascript를 사용하여 reCaptcha v3 배지를 숨길 수 있습니다.
- 는 CSS Way를 사용합니다.
display: none★★★★★★★★★★★★★★★★★」visibility: hidden리캡차 배치를 숨깁니다.쉽고 빠르게 할 수 있습니다.
.grecaptcha-badge {
display:none !important;
}
- Javascript 방법
var el = document.querySelector('.grecaptcha-badge');
el.style.display = 'none';
구글 정책에 따르면 배지를 숨기는 것은 유효하며 여기서 자주 묻는 질문으로 답변합니다.아래와 같이 구글에서 개인정보 보호정책 및 이용약관을 표시하는 것이 좋습니다.
짧은 플래시는 피하지만 연락처 양식 7이 보일 때마다 표시되는 Matthew Dowell의 게시물의 약간 변형입니다.
div.grecaptcha-badge{
width:0 !important;
}
div.grecaptcha-badge.show{
width:256px !important;
}
그런 다음 헤더에 다음 내용을 추가했습니다.php는 내 아이 테마:
<script>
jQuery( window ).load(function () {
if( jQuery( '.wpcf7' ).length ){
jQuery( '.grecaptcha-badge' ).addClass( 'show' );
}
});
</script>
명령을 하십시오.
.grecaptcha-badge { visibility: hidden; }
사용자 흐름에 reCAPTCHA 브랜딩을 가시적으로 포함하는 한 배지를 숨길 수 있습니다.다음 텍스트를 포함하십시오.
및 reCAPTCHA에 의해 .
<a href="https://policies.google.com/privacy">Privacy Policy</a> and <a href="https://policies.google.com/terms">Terms of Service</a> apply.
자세한 내용은 이쪽 reCaptacha
스팸 체크는 무효가 되지 않습니다.
div.g-recaptcha > div.grecaptcha-badge {
width:0 !important;
}
내 해결책은 배지를 숨기고 사용자가 폼 입력에 집중할 때 표시하는 것이었다.그래서 여전히 구글의 T&C를 고수하고 있다.
주의: 조정하고 있던 reCAPTCHA는 WordPress 플러그인에 의해 생성되었기 때문에 reCAPTCHA를 WordPress 플러그인으로 랩해야 할 수 있습니다.<div class="inv-recaptcha-holder"> ... </div>네 자신.
CSS
.inv-recaptcha-holder {
visibility: hidden;
opacity: 0;
transition: linear opacity 1s;
}
.inv-recaptcha-holder.show {
visibility: visible;
opacity: 1;
transition: linear opacity 1s;
}
j쿼리
$(document).ready(function () {
$('form input, form textarea').on( 'focus', function() {
$('.inv-recaptcha-holder').addClass( 'show' );
});
});
필요에 따라 jQuery 셀렉터를 특정 폼으로 변경할 수 있습니다.
Wordpress의 Contact Form 7 사용자에게는 이 방법이 효과적입니다. Contact 7 Forms를 제외한 모든 페이지에서 v3 Recapcha를 숨깁니다.
단, 이 방법은 텍스트 입력 폼 요소가 있는 모든 페이지를 식별할 수 있는 고유한 클래스 셀렉터를 사용하는 모든 사이트에서 작동해야 합니다.
먼저 타일을 접을 수 있는 타깃스타일 규칙을 CSS에 추가했습니다.
CSS
div.grecaptcha-badge.hide{
width:0 !important;
}
그런 다음 JQuery 스크립트를 헤더에 추가하여 창 로드 후에 트리거했습니다.이것에 의해, 「grecaptcha-badge」클래스 셀렉터를 JQuery에서 사용할 수 있게 되어, 사용 가능한 CSS 스타일을 적용하기 위해서 「숨기기」클래스를 추가할 수 있습니다.
$(window).load(function () {
if(!($('.wpcf7').length)){
$('.grecaptcha-badge').addClass( 'hide' );
}
});
타일이 매 페이지마다 0.5초 동안 깜박이지만, 지금까지 발견한 방법 중 가장 좋은 방법이기 때문에 이를 준수할 수 있기를 바랍니다.개선을 위한 제안 감사합니다.
Contact Form 7 업데이트와 최신 버전(버전 5.1.x)을 사용하는 경우 Google reCAPTCHA v3를 설치하고 사용하도록 설정해야 합니다.
기본적으로 화면 오른쪽 하단에 있는 모든 페이지에 Google reCAPTCHA 로고가 표시됩니다.이는 사용자에게 좋지 않은 경험을 안겨주고 있다는 평가에 따른 것입니다.그리고 웹 사이트, 블로그는 속도가 약간 느려지고(PageSpeed Score에 반영됨), 웹 사이트에서는 이 배지를 표시하기 위해 구글에서 추가 1개의 JavaScript 라이브러리를 로드해야 합니다.
다음 단계에 따라 Google reCAPTCHA v3를 CF7에서 숨길 수 있습니다(필요한 경우에만 표시).
첫 번째로,functions.php테마의 파일(파일 관리자 또는 FTP 클라이언트 사용)을 선택합니다.이 파일은 다음 위치에 있습니다./wp-content/themes/your-theme/다음 스니펫을 추가합니다(이 코드를 사용하여 모든 페이지에서 reCAPTCHA 상자를 제거합니다).
remove_action( 'wp_enqueue_scripts', 'wpcf7_recaptcha_enqueue_scripts' );
그런 다음 Google reCAPTCHA(연락처 페이지, 로그인, 등록 페이지 등)를 표시하는 페이지에 이 스니펫을 추가합니다.
if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
add_action( 'wp_enqueue_scripts', 'wpcf7_recaptcha_enqueue_scripts', 10, 0 );
}
OIW 블로그 - WordPress 연락처 폼7에서 Google reCAPTCHA 로고 삭제하는 방법(리CAPTCHA 배지 숨기기)을 참조하십시오.
독자적인 CSS를 적용할 경우 배지를 인라인으로 배치하는 것도 도움이 됩니다.그러나 API 키를 등록할 때 Google의 이용약관을 보여주기로 동의한 것을 기억하십시오. 그러니 숨기지 마세요.또한 CSS를 사용하여 배지를 완전히 삭제할 수는 있지만 권장하지는 않습니다.
폼 7과 리캡차 v3 솔루션을 리캡차합니다.
body:not(.page-id-20) .grecaptcha-badge {
display: none;
}
여러 연락처 폼 페이지
body:not(.page-id-12):not(.page-id-43) .grecaptcha-badge {
display: none;
}
연락처 양식 페이지가 더 많은 경우 "알림"을 추가할 수 있습니다.
body:not(.page-id-45):not(.page-id-78):not(.page-id-98) .grecaptcha-badge {
display: none;
}
신체 부위가 다음과 같은지 확인하십시오.
<body>
다음과 같이 변경합니다.
<body <?php body_class(); ?>>
언급URL : https://stackoverflow.com/questions/44543157/how-to-hide-the-google-invisible-recaptcha-badge
'programing' 카테고리의 다른 글
| 계속하기 전에 하나의 기능이 완료될 때까지 기다리는 올바른 방법입니까? (0) | 2022.10.21 |
|---|---|
| 함수에 전역 변수 사용 (0) | 2022.10.21 |
| 팬더 컬럼의 값을 dict로 다시 매핑하고 NaNs를 보존합니다. (0) | 2022.10.20 |
| Data Transfer Object(DTO; 데이터 전송 객체)가 안티 패턴인 이유는 무엇입니까? (0) | 2022.10.20 |
| MySQL은 다른 세션에 삽입된 행을 선택할 수 없습니다. (0) | 2022.10.20 |