如何在 WordPress 中嵌入 Google 表单
快速回答:在你的 Google 表单中,点击发送,选择嵌入图标,然后复制 iframe 代码。在 WordPress 中,在编辑器里添加一个自定义 HTML区块,直接把代码粘贴进去。如果保存后表单没有出现,你的 WordPress 设置可能正在过滤 iframe——一个允许原始 HTML 嵌入的插件可以解决这个问题。
把 Google 表单直接嵌入到 WordPress 页面或文章中,可以让访客留在你的网站上,而不是被带到一个单独的 forms.google.com 链接。这套机制很简单——就是 Google 为任何网站提供的同一段 iframe 嵌入代码——但 WordPress 有几个值得了解的小坑,最好在粘贴之前就知道。本指南涵盖 WordPress 特有的步骤;关于任何平台上通用的嵌入流程,请参阅我们的在网站上嵌入 Google 表单指南。
第一步:从 Google 表单获取嵌入代码
打开你想嵌入的表单,点击右上角的发送。在发送对话框中,点击嵌入图标——它看起来像 < >——就在链接和邮件图标旁边。Google 会生成一个 iframe 标签,你可以在复制之前直接在该对话框中调整默认的宽度和高度。点击复制以获取完整的 HTML 代码片段。
第二步:在 WordPress 中添加自定义 HTML 区块
在 WordPress 区块编辑器中打开你想让表单出现的页面或文章。点击+添加一个新区块,搜索自定义 HTML并选中它。把你从 Google 表单复制的 iframe 代码直接粘贴到该区块中——除非你想调整尺寸,否则无需修改。在保存页面之前,使用该区块内(HTML 标签页旁边的)预览标签页检查它是否正确呈现。
当 iframe 被过滤掉时:修复不显示的表单
在某些 WordPress 配置下,即使你正确粘贴了代码,保存或发布后表单也根本不会出现。这通常是因为安全插件或加固过的托管环境会从文章内容中过滤掉原始的 iframe 标签,因为如果不加以控制,来自不受信任来源的 iframe 可能构成安全风险。如果你遇到这种情况,通常的解决办法是找一个简单、评价良好的 WordPress 插件,其专门作用就是让 iframe 或基于短代码的嵌入通过内容过滤器——在 WordPress 插件目录中搜索“iframe”或“embed”插件,安装前检查评价和最近的更新情况,因为我们在这里没有测试或推荐过任何特定插件。另外,也可以检查你现有的安全插件是否有允许特定 HTML 标签(如 iframe)的设置。
第三步:修复截断表单的滚动条
Google 默认的嵌入高度对于超过几个问题的表单来说通常太短,这意味着受访者会在一个狭小的框里挤出一个内部滚动条,而看不到整个表单。打开自定义 HTML 区块,在 iframe 标签中找到 height="…" 属性,并增大这个数字——对于较长的表单,不要害怕把它设得远高于默认值,因为底部多出的空白空间远没有一个局促的滚动窗口那么让访客厌烦。这没有精确的公式;合适的高度取决于你有多少个问题,因此需要调整并预览,直到整个表单都能显示出来而无需它自己的滚动条。
移动端响应性因主题而异
嵌入的 Google 表单本身是响应式的,但它在你的 WordPress 主题布局中的表现取决于具体主题——有些主题能很好地把嵌入的 iframe 限制在内容宽度以内,而另一些主题会让固定宽度的 iframe 在手机屏幕上溢出页面。由于这一点因主题而异非常大,不要只相信桌面端预览:在完成工作之前,请在真实的手机上打开已发布的页面,滚动浏览嵌入的表单。
什么时候应该只用链接而不是嵌入
当你希望表单感觉像是页面的一部分时,嵌入很好用,但这并非总是必要的。如果你只是需要访客填写表单,并不在意是否让他们留在你的 WordPress 网站上,一个简单的链接会更简单、完全没有 iframe 被过滤的风险,并且会在 Google 自己的移动端优化布局中打开表单,而不是受限于你主题的样式。关于不同的链接和二维码选项,请参阅我们的分享 Google 表单指南。
快速检查清单
- 复制 iframe 代码,在你的 Google 表单中从“发送 > 嵌入”获取。
- 在 WordPress 编辑器中使用自定义 HTML 区块,而不是常规的段落或嵌入区块。
- 如果表单保存后消失了,寻找一个允许 iframe 嵌入的插件,或者检查你的安全插件的 HTML 过滤设置。
- 如果滚动条截断了表单底部,请增大高度值。
- 在认为嵌入完成之前,务必在真实手机上测试,因为主题的表现差异太大,不能只依赖桌面端预览。
常见问题
如何获取 Google 表单的嵌入代码?
打开你的表单,点击“发送”,选择嵌入(< >)图标,如果需要可调整宽度和高度,然后点击“复制”以复制 iframe HTML 代码。
我应该用哪个 WordPress 区块来嵌入 Google 表单?
在区块编辑器中使用“自定义 HTML”区块。添加一个新区块,搜索“自定义 HTML”,然后把 Google 给你的 iframe 代码直接粘贴进去。
为什么我在 WordPress 中粘贴嵌入代码后 Google 表单没有显示出来?
出于安全考虑,某些 WordPress 配置和安全插件会从内容中过滤掉原始的 iframe 标签。如果保存后表单消失了,可以寻找一个简单、评价良好的插件,明确允许 iframe 或短代码嵌入,并检查你的安全插件设置中是否有 HTML 过滤选项。
为什么我嵌入的表单被滚动条截断了?
对于较长的表单,iframe 的默认高度通常太短。增加嵌入代码中的高度值,直到整个表单都能显示出来,而不需要它自己内部的滚动条。