表单字段最多5个（Name/Company/Email/Phone/Message），提交用Formspree（免费50次/月）或CF Workers+Resend（免费100封/天）处理。收到询盘立即发通知给自己，同时发自动回复给买家（24小时内回复承诺+联系方式）。

询盘表单 + 邮件通知 + 自动回复模板

外贸站所有的 SEO 努力，最终都要通过询盘表单变现。表单设计得不好，之前所有的流量都是浪费。

表单字段设计原则

原则：字段越少，转化越高。

B2B 工业品买家通常是工程师或采购专员，他们在工作时间快速浏览，不愿意填复杂表格。每增加一个字段，转化率下降约 10–15%。

最优字段配置（5个）：

不要加的字段：地址、传真、网站、“如何找到我们”——这些会让买家觉得繁琐。

一个隐藏的反垃圾字段（honeypot）：

<!-- 真实用户看不到，机器人会填写 → 服务器端丢弃含此字段的提交 -->
<input type="text" name="website" style="display:none" tabindex="-1" autocomplete="off">

三种实现方案对比

本系列选型：Formspree（快速上线）→ 后期迁移到 CF Workers + Resend（零成本）

方案一：Formspree 实现

HTML 表单代码

<form
  action="https://formspree.io/f/[你的 form ID]"
  method="POST"
  class="space-y-4"
>
  <!-- Honeypot -->
  <input type="text" name="_gotcha" style="display:none">
  <!-- 自动回复设置 -->
  <input type="hidden" name="_autoresponse"
    value="Thank you for your inquiry. We will respond within 24 hours.">
  <input type="hidden" name="_subject"
    value="New Inquiry from AquaFlow Website">

  <div>
    <label for="name" class="block text-sm font-medium mb-1">Name *</label>
    <input type="text" id="name" name="name" required
      class="w-full border rounded-md px-3 py-2 focus:ring-2 focus:ring-blue-500">
  </div>
  <div>
    <label for="company" class="block text-sm font-medium mb-1">Company *</label>
    <input type="text" id="company" name="company" required
      class="w-full border rounded-md px-3 py-2">
  </div>
  <div>
    <label for="email" class="block text-sm font-medium mb-1">Email *</label>
    <input type="email" id="email" name="email" required
      class="w-full border rounded-md px-3 py-2">
  </div>
  <div>
    <label for="phone" class="block text-sm font-medium mb-1">
      WhatsApp / Phone (optional)
    </label>
    <input type="tel" id="phone" name="phone"
      class="w-full border rounded-md px-3 py-2">
  </div>
  <div>
    <label for="message" class="block text-sm font-medium mb-1">
      Your Inquiry *
    </label>
    <textarea id="message" name="message" rows="4" required
      placeholder="Please describe your requirements: product type, flow rate, application, quantity..."
      class="w-full border rounded-md px-3 py-2"></textarea>
  </div>
  <button type="submit"
    class="w-full bg-orange-600 text-white font-semibold py-3 rounded-md hover:bg-orange-700">
    Send Inquiry
  </button>
</form>

注册 Formspree

1. 访问 formspree.io → 免费注册
2. New Form → 复制 form ID
3. 设置通知邮件：收到提交时发给你的 info@yourdomain.com

方案二：CF Workers + Resend（零成本进阶方案）

架构

表单提交 → CF Workers（处理逻辑）→ Resend API（发邮件）
                                   ↓
                         1. 通知邮件 → info@yourdomain.com
                         2. 自动回复 → 买家邮箱

Workers 代码

// wrangler.toml 配置环境变量：RESEND_API_KEY

export default {
  async fetch(request, env) {
    if (request.method !== 'POST') {
      return new Response('Method not allowed', { status: 405 });
    }

    const data = await request.formData();

    // Honeypot 检查
    if (data.get('website')) {
      return new Response('OK', { status: 200 }); // 静默丢弃
    }

    const name = data.get('name');
    const company = data.get('company');
    const email = data.get('email');
    const phone = data.get('phone') || 'Not provided';
    const message = data.get('message');

    // 1. 发通知给自己
    await fetch('https://api.resend.com/emails', {
      method: 'POST',
      headers: {
        'Authorization': `Bearer ${env.RESEND_API_KEY}`,
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        from: 'noreply@yourdomain.com',
        to: 'info@yourdomain.com',
        subject: `New Inquiry: ${company} - ${name}`,
        html: `
          <h2>New Website Inquiry</h2>
          <p><strong>Name:</strong> ${name}</p>
          <p><strong>Company:</strong> ${company}</p>
          <p><strong>Email:</strong> ${email}</p>
          <p><strong>Phone:</strong> ${phone}</p>
          <p><strong>Message:</strong></p>
          <p>${message}</p>
        `,
      }),
    });

    // 2. 发自动回复给买家
    await fetch('https://api.resend.com/emails', {
      method: 'POST',
      headers: {
        'Authorization': `Bearer ${env.RESEND_API_KEY}`,
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        from: 'info@yourdomain.com',
        to: email,
        subject: 'Re: Your Inquiry to AquaFlow Industrial',
        html: AUTO_REPLY_HTML(name),
      }),
    });

    return new Response(JSON.stringify({ success: true }), {
      headers: { 'Content-Type': 'application/json' },
    });
  },
};

自动回复邮件模板

自动回复是买家对你的第一印象。写得好，可以大幅提升后续沟通的质量。

Subject: Re: Your Inquiry to AquaFlow Industrial

Dear [Name],

Thank you for reaching out to AquaFlow Industrial.

We have received your inquiry and our technical team will review
your requirements carefully. You can expect a detailed response
within 24 business hours (Mon–Fri, 9AM–6PM UTC+8).

In the meantime, you may find these resources helpful:
• Product Catalog: [链接]
• Technical Specifications: [链接]
• Company Profile: [链接]

If your project is time-sensitive, please contact us directly:

Email: info@aquaflowpumps.com
WhatsApp: +86-XXX-XXXX-XXXX (Mon–Fri, 9AM–6PM UTC+8)

We look forward to working with you.

Best regards,
The AquaFlow Industrial Team
---
AquaFlow Industrial Co., Ltd.
[地址] | [电话] | aquaflowpumps.com
ISO 9001:2015 Certified

三个关键点：

1. 给出明确的回复时间承诺（24小时）
2. 提供直接联系方式（避免买家等不及就去找竞争对手）
3. 附上产品目录链接（买家在等待期间会继续研究）

→ WhatsApp Chat Widget 接入