无论你是个人博客、企业网站还是电商平台,都需要一个 “联系表单”—— 让访客能方便地给你发消息(如咨询问题、提交需求、反馈建议)。Contact Form 7 是 WordPress 最老牌的表单插件(安装量超 500 万),免费、灵活且功能强大,能帮你快速创建各种表单(联系表单、报名表单、反馈表单等),新手只需简单配置就能用。
一、为什么需要联系表单?直接放邮箱 / 电话不行吗?
直接放邮箱或电话看似简单,但有 3 个明显缺点:
- 访客嫌麻烦:需要复制邮箱、打开邮件客户端才能发送,很多人会中途放弃;
- 容易被垃圾邮件骚扰:公开的邮箱地址会被机器人抓取,收到大量垃圾邮件;
- 信息不规范:访客可能漏掉关键信息(如咨询产品时没说清需求),回复效率低。
而联系表单能解决这些问题:
- 访客在网站内直接填写提交,一步完成;
- 邮箱地址隐藏在后台,避免被垃圾邮件盯上;
- 可自定义需要填写的字段(如姓名、电话、需求类型),确保信息完整。
二、Contact Form 7 安装与创建第一个表单
步骤 1:安装并激活插件
- 后台【插件】→【安装插件】,搜索 “Contact Form 7”;
- 点击【安装现在】,完成后点击【激活】。
- 激活后,左侧菜单会出现【联系】选项。
步骤 2:创建默认联系表单(新手推荐,直接可用)
Contact Form 7 自带一个预设的联系表单模板,包含常用字段(姓名、邮箱、主题、消息内容),新手可直接使用:
- 点击左侧【联系】→【添加新】,进入表单编辑页;
- 插件会自动生成一个表单名称(如 “联系表单 1”),可修改为 “网站联系表单”(方便识别);
- 下方 “表单” 区域是表单的代码(不用懂代码,保持默认即可),默认包含 4 个字段:
- 姓名(文本框);
- 邮箱(带验证的邮箱框,确保格式正确);
- 主题(文本框,方便你快速了解消息主题);
- 消息(多行文本框,填写详细内容)。
步骤 3:设置表单提交后的 “反馈” 和 “邮件接收”
表单能提交还不够,还需要设置:访客提交后看到什么提示?消息发送到哪个邮箱?
1. 设置 “邮件” 接收地址(关键!确保能收到消息)
- 在表单编辑页下拉到 “邮件” 区域;
- 找到 “收件人” 输入框,填写你的常用邮箱(如
contact@你的域名.com); - 其他选项保持默认(“发件人”“主题” 等会自动填充表单内容)。
2. 设置 “消息” 提示(告诉访客提交结果)
- 下拉到 “消息” 区域,可自定义提示文字:
- “发送成功消息”:如 “感谢您的留言,我们会尽快回复!”;
- “验证错误消息”:如 “请检查填写的内容是否正确(如邮箱格式)”。
步骤 4:保存表单并获取 “短代码”
- 点击页面右上角【保存】,表单创建完成;
- 保存后,页面顶部会显示一个 “短代码”(如
[contact-form-7 id="123" title="网站联系表单"]),复制这个代码(后面要用到)。
三、将表单添加到 “联系我们” 页面
创建好表单后,需要把它放到网站的 “联系我们” 页面(或其他需要的页面),让访客能看到:
- 进入【页面】→【添加新】(或编辑已有的 “联系我们” 页面);
- 在编辑器中,将光标定位到需要显示表单的位置;
- 粘贴刚才复制的短代码(如
[contact-form-7 id="123" title="网站联系表单"]); - 点击【发布】或【更新】,访问页面就能看到表单了。
四、自定义表单:添加 / 删除字段(按需调整)
如果默认表单不符合需求(如需要添加 “电话”“公司名称” 字段),可以自定义修改:
举例:给表单添加 “电话” 字段
- 进入【联系】,找到你创建的表单,点击【编辑】;
- 在 “表单” 编辑区,找到 “邮箱” 字段下方,点击工具栏的【插入标签】→【文本】;
- 在弹出的窗口中:
- “名称” 填写 “tel”(内部标识,小写英文);
- “标签” 填写 “电话”(显示给访客看的文字);
- 勾选 “必填字段”(确保访客必须填写);
- 点击【插入标签】,会自动生成一行代码(如
[text* tel placeholder "请输入您的电话"]);
- 点击【保存】,更新页面后,表单就会多出 “电话” 字段。
常用字段类型(按需选择)
- 文本框:适合填写姓名、电话、公司名称等短内容;
- 邮件框:专门用于填写邮箱,会自动验证格式;
- 文本区域:适合填写长内容(如留言、需求描述);
- 下拉菜单:适合让访客选择选项(如 “咨询类型:产品咨询 / 售后问题 / 合作洽谈”);
- 复选框:适合勾选多个选项(如 “感兴趣的服务:网站建设 / SEO 优化 / 品牌设计”)。
五、新手常见问题
- 表单提交后没收到邮件?这是最常见的问题,解决方法:
- 检查 “邮件” 设置中的 “收件人” 邮箱是否正确(别填错了!);
- 查看邮箱的 “垃圾邮件” 文件夹(表单邮件可能被误判为垃圾邮件);
- 若还是收不到,安装插件 “WP Mail SMTP”(修复 WordPress 邮件发送功能,新手按插件向导设置即可)。
- 如何修改表单的样式(如字体、颜色、宽度)?Contact Form 7 本身不支持可视化改样式,需要简单的 CSS 代码:
- 方法 1:在主题设置中找到 “自定义 CSS”(通常在【外观】→【自定义】→【额外 CSS】);方法 2:举例:让输入框宽度为 80%,添加代码:
.wpcf7 input, .wpcf7 textarea { width: 80%; padding: 10px; margin-bottom: 15px; } - (不会写 CSS 可搜索 “Contact Form 7 样式代码”,复制现成的修改即可)。
- 表单提交后,能自动保存到后台吗?免费版不支持,提交的消息只通过邮件发送。若需要保存到后台(防止邮件丢失),可安装插件 “Flamingo”(Contact Form 7 作者开发的配套插件,专门用于保存表单数据)。
- 如何防止机器人提交垃圾信息?启用 “反垃圾邮件” 功能:
- 编辑表单,在 “表单” 区域添加一行代码
[recaptcha](谷歌验证码); - 进入【联系】→【集成】,按提示连接谷歌 reCAPTCHA(需要注册一个免费的 API 密钥,按向导操作即可)。
- 编辑表单,在 “表单” 区域添加一行代码
总结:联系表单是 “转化的最后一公里”
对访客来说,联系表单是 “表达需求的最快方式”;对网站运营者来说,它是 “获取潜在客户的重要渠道”。
Contact Form 7 虽然需要手动写短代码、改字段,但免费、灵活且稳定,学会基础操作后,能满足从简单到复杂的各种表单需求。记住:表单不要太复杂(字段越多,访客越容易放弃),保留核心信息(姓名、联系方式、需求)即可,让沟通门槛降到最低。