php 联系表格 7 reCAPTCHA 未显示在表格上

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/46245302/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 03:12:10  来源:igfitidea点击:

Contact Form 7 reCAPTCHA Not Displaying on Form

phpwordpressformsrecaptcha

提问by tonjaggart

I am using Contact Form 7 and the Google reCAPTCHA integration. I have added my keys and added the shortcode to the form. I can't seem to get the reCAPTCHA box to appear on the form. Below is the contact form code:

我正在使用联系表 7 和 Google reCAPTCHA 集成。我已经添加了我的密钥并将短代码添加到表单中。我似乎无法让 reCAPTCHA 框出现在表单上。以下是联系表格代码:

<ul>
<li><div class="apo-moved-label"> [text Name id:cf_name]<label for="cf_name" class="white">Name</label><span class="apo-moved-label-border"></span> </div></li>
<li><div class="apo-moved-label"> [email Email id:cf_email]<label for="cf_email" class="white">Email Address</label><span class="apo-moved-label-border"></span></div></li>
<li><div class="apo-moved-label"> [textarea Message id:cf_message]<label for="cf_message" class="white">Message</label><span class="apo-moved-label-border"></span></div></li>
[recaptcha]
<li><button class="apo-btn apo-btn-small apo-btn-white">[submit "Send Message"]</button><div class="gap"></div></li>
</ul>

Here is what I see when I view source on the form:

这是我在表单上查看源代码时看到的内容:

<div class="wpcf7-form-control-wrap"><div data-sitekey="6LcY_i8UAAAAAN0EVfgHOAeFOMsE4akLpkzAtn-J" class="wpcf7-form-control g-recaptcha wpcf7-recaptcha"></div>
<noscript>
    <div style="width: 302px; height: 422px;">
        <div style="width: 302px; height: 422px; position: relative;">
            <div style="width: 302px; height: 422px; position: absolute;">
                <iframe src="https://www.google.com/recaptcha/api/fallback?k=6LcY_i8UAAAAAN0EVfgHOAeFOMsE4akLpkzAtn-J" frameborder="0" scrolling="no" style="width: 302px; height:422px; border-style: none;">
                </iframe>
            </div>
            <div style="width: 300px; height: 60px; border-style: none; bottom: 12px; left: 25px; margin: 0px; padding: 0px; right: 25px; background: #f9f9f9; border: 1px solid #c1c1c1; border-radius: 3px;">
                <textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="width: 250px; height: 40px; border: 1px solid #c1c1c1; margin: 10px 25px; padding: 0px; resize: none;">
                </textarea>
            </div>
        </div>
    </div>
</noscript>

When I check my CSS I don't see anything blocking it from displaying.

当我检查我的 CSS 时,我没有看到任何阻止它显示的东西。

回答by kxo

You need to include the recaptcha librarybefore </head>:

您需要在之前包含recaptcha 库</head>

<script src="https://www.google.com/recaptcha/api.js" async defer></script>

回答by Larry Silverman

The Contact Form 7 plugin should be including the script element to include the api.js file already. I just ran into the same problem today, with CF7 5.0.2. For some reason, CF7 is no longer including the api.js file. I can't figure why. I manually added it to the HEAD section, and the problem is now resolved.

Contact Form 7 插件应该已经包含脚本元素以包含 api.js 文件。我今天刚遇到同样的问题,CF7 5.0.2。出于某种原因,CF7 不再包含 api.js 文件。我想不通为什么。我手动将其添加到 HEAD 部分,现在问题已解决。

回答by gradosevic

If you use invisible Recaptcha 3, it will not show in the form, but it can be seen in the bottom/right corner of the browser instead.

如果您使用不可见的 Recaptcha 3,它不会显示在表单中,但可以在浏览器的下/右下角看到。

enter image description here

在此处输入图片说明

回答by Chris Paul

If the recaptcha script is not loading, perhaps your theme had the <php wp_head(); ?>function removed.

如果 recaptcha 脚本未加载,则您的主题可能已<php wp_head(); ?>删除该功能。

回答by Sayan

I guess the site key is not entered correctly.

我猜站点密钥输入不正确。