在实现新的谷歌Invisible reCATPTCHA时,默认情况下,当你滚动屏幕时,屏幕右下方会弹出一个小的“受reCAPTCHA保护”徽章。

我想把这个藏起来。


当前回答

我的解决方案是隐藏徽章,然后在用户关注表单输入时显示它——因此仍然遵循谷歌的t&c。

注意:我调整的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;
}

jQuery

$(document).ready(function () {
  $('form input, form textarea').on( 'focus', function() {
    $('.inv-recaptcha-holder').addClass( 'show' );
  });
});

显然,如果需要,您可以更改jQuery选择器以针对特定的表单。

其他回答

注意:如果您选择隐藏徽章,请使用 .grecaptcha-badge{可见性:隐藏;}

只要在用户流中可见地包含reCAPTCHA品牌,您就可以隐藏徽章。请包括以下文本:

此站点受reCAPTCHA和谷歌. com保护 <a href="https://policies.google.com/privacy">隐私策略</a> and <a href="https://policies.google.com/terms">服务条款</a>适用。

更多细节请点击这里

是的,你能做到。您可以使用css或javascript隐藏reCaptcha v3徽章。

CSS方式 使用display: none或visibility: hidden隐藏reCaptcha批。这既简单又快捷。

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

Javascript的方式

var el = document.querySelector('.grecaptcha-badge');
el.style.display = 'none';

隐藏徽章是有效的,根据谷歌政策,并在faq回答这里。建议显示谷歌的隐私政策和使用条款,如下所示。

对于谷歌reCaptcha v3,常见问题解答如下:

只要包含reCAPTCHA,您就可以隐藏徽章 在用户流程中可见的品牌。请包括以下文本: 此站点受reCAPTCHA和谷歌. com保护 <a href="https://policies.google.com/privacy">隐私策略</a> and <a href="https://policies.google.com/terms">服务条款</a>适用。 例如: 注意:如果您选择隐藏徽章,请使用 .grecaptcha-badge{可见性:隐藏;}

目前尚不清楚这是否适用于reCaptcha v2。我建议升级到v3,因为它对您的访问者来说是一个更好的体验。

我测试了所有的方法,并且:

警告:显示:none禁用垃圾邮件检查!

可见度:隐藏和不透明度:0不禁用垃圾邮件检查。

使用代码:

.grecaptcha-badge { 
    visibility: hidden;
}

当您隐藏徽章图标时,谷歌希望您通过添加以下内容在表单上引用他们的服务:

<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>

这不会禁用垃圾邮件检查

div.g-recaptcha > div.grecaptcha-badge {
    width:0 !important;
}