外贸询盘表单Fluent Forms如何加上用户访问记录

对于 B2B 外贸网站来说,客户提交询盘时留下的不仅仅是姓名、邮箱和需求内容。很多时候,客户在提交询盘前浏览了哪些页面、停留了多久、是否查看过产品页或报价页,这些信息往往比询盘内容本身更有价值。


例如:

  • 客户浏览了多个产品页面后才提交询盘;
  • 客户在报价页面停留了较长时间;
  • 客户访问过定制服务页面;
  • 客户从 Google 广告或 Facebook 广告进入网站;
  • 这些行为数据可以帮助销售人员快速判断客户意向,提高跟进效率。
  • 本文将介绍如何在 WordPress 网站中,通过 Fluent Forms 自动记录访客浏览轨迹,并将访问记录发送到询盘通知邮件中。

为什么要记录用户访问轨迹


传统询盘邮件通常只有:

Name: John Smith
Email: john@example.com
Message: Please send me your catalog.

而加入访问记录后:

Name: John Smith
Email: john@example.com

Visited Pages:
https://example.com/(12s)
https://example.com/wholesale-eyelashes/(65s)
https://example.com/private-label-packaging/(38s)
https://example.com/contact/(10s)

销售人员能够快速判断:

  • 客户关注哪些产品;
  • 是否查看过定制服务;
  • 是否有明确采购意向;
  • 哪些页面最能促成转化。

第一步:在网站中记录访问页面和停留时间


将以下代码添加到网站全局页脚(Footer)或通过 Code Snippets 插件加载。

<script>
(function () {

    let startTime = Date.now();
    let page = location.href;

    function saveTime() {

        let duration = Math.round((Date.now() - startTime) / 1000);

        let data = JSON.parse(
            localStorage.getItem('visited_pages') || '[]'
        );

        // 👇 查找是否已存在该页面
        let existing = data.find(item => item.url === page);

        if (existing) {
            // ✔ 累加时间(核心修复)
            existing.time += duration;
        } else {
            data.push({
                url: page,
                time: duration
            });
        }

        data = data.slice(-10);

        localStorage.setItem(
            'visited_pages',
            JSON.stringify(data)
        );

    }

    // 防止重复触发(关键优化)
    let saved = false;

    function safeSave() {
        if (saved) return;
        saved = true;
        saveTime();
    }

    window.addEventListener('beforeunload', safeSave);
    document.addEventListener('visibilitychange', function () {
        if (document.visibilityState === 'hidden') {
            safeSave();
        }
    });

})();
</script>

功能说明


该脚本会:

  • 自动记录用户访问的页面 URL;
  • 统计页面停留时间(秒);
  • 自动合并重复访问页面;
  • 仅保留最近 10 个访问页面;
  • 将数据保存到浏览器 LocalStorage 中。

第二步:在 Fluent Forms 中创建隐藏字段

在 Fluent Forms 表单中新增一个 Hidden Field(隐藏字段)。

字段名称:

page_history

注意:
必须是字段的 Name Attribute,而不是 Label。

外贸询盘表单 Fluent Forms 如何加上用户访问记录

第三步:自动将访问记录写入表单

在表单页面或网站全局位置添加以下 JavaScript:

<script>
window.addEventListener('load', function(){

    let data = JSON.parse(
        localStorage.getItem('visited_pages') || '[]'
    );

    let formatted = data.map(item => {
        return item.url + ' (' + item.time + 's)';
    }).join('\n');

    document
        .querySelectorAll(
            'input[name="page_history"]'
        )
        .forEach(function(field){

            field.value = formatted;

        });

});
</script>

该脚本会:

  • 读取 LocalStorage 中的访问记录;
  • 自动格式化访问路径;
  • 写入 Fluent Forms 隐藏字段;
  • 随表单一起提交。
  • 支持同页多表单都会插入

第四步:在邮件通知中输出访问记录

进入:

Fluent Forms
→ Settings & Integrations
→ Email Notifications

在邮件模板中添加:

Visited Pages:

{inputs.page_history}
在邮件通知中输出访问记录

当客户提交表单后,通知邮件中即可显示访问轨迹。

邮件效果示例

外贸询盘表单 Fluent Forms 如何加上用户访问记录

将会显示所有浏览记录+停留时间。

需要外贸独立站建站或 GEO 优化服务?美络云科技(Mloun)提供 WordPress 外贸独立站建站、WooCommerce 跨境商城、海外 SEO 与 GEO 生成式引擎优化一站式服务,服务覆盖全球 25% 的国家和地区。