谷歌现在允许隐藏徽章，从常见问题解答:

我想把reCAPTCHA徽章藏起来。什么是允许的? 只要在用户流中可见地包含reCAPTCHA品牌，您就可以隐藏徽章。请包括以下文本: 此站点受reCAPTCHA和谷歌. com保护 <a href="https://policies.google.com/privacy">隐私策略</a> and <a href="https://policies.google.com/terms">服务条款</a>适用。 例如:

所以你可以简单地隐藏它使用下面的CSS:

.grecaptcha-badge { 
    visibility: hidden;
}

不要使用display: none;因为它似乎禁用了垃圾邮件检查(谢谢@Zade)

Matthew Dowell的帖子略有变化，避免了短闪光，但在接触形式7可见时显示:

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

div.grecaptcha-badge.show{
    width:256px !important; 
}

然后，我在子主题的header.php中添加了以下内容:

<script>
jQuery( window ).load(function () { 
    if( jQuery( '.wpcf7' ).length ){ 
        jQuery( '.grecaptcha-badge' ).addClass( 'show' );
    }
});
</script>

是的，你能做到。您可以使用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回答这里。建议显示谷歌的隐私政策和使用条款，如下所示。

由于隐藏徽章并不是真正合法的根据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;
}

我想这是你合法能做到的极限了。

对于谷歌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，因为它对您的访问者来说是一个更好的体验。

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

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

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

更多细节请点击这里