在 YITH Wishlist 页面获取真实 Wishlist Link,并自动带入询盘表单(实战教程)

如果你使用的是 YITH WooCommerce Wishlist 插件,你一定遇到过这种情况:

  • 客户收藏了一些产品

  • 客户想把 wishlist 发给你报价

  • 但他只发了这个链接:

👉 https://yourdomain.com/wishlist/

这个链接只是 Wishlist 的入口页,并不能直接追踪到客户收藏了哪些产品。

而真正可追踪的 Wishlist 分享链接通常是这种格式:

https://yourdomain.com/wishlist/view/8S2JHCVY28P9/

它包含唯一的 token(例如 8S2JHCVY28P9),你拿到这个链接就可以精准定位客户的收藏清单,帮助你:

  • 快速跟进客户意向产品

  • 做报价或推荐替代型号

  • 提升询盘转化率和效率

这篇文章将分享一个非常简单且有效的做法:

在 Wishlist 页面自动提取真实的 /wishlist/view/xxx/ 链接

并写入 Contact Form 的隐藏字段,让表单提交时自动带上 Wishlist Link


为什么客户发 /wishlist/ 你无法追踪?

原因很简单:

/wishlist/ 是一个固定入口页面,几乎所有用户打开都是这个 URL。

它不会携带 "wishlist token",你无法从链接本身反推出客户收藏了什么。

但 YITH Wishlist 内部其实已经生成了真实的列表链接,只是用户不一定会复制到正确的分享链接。


关键思路:从 <form action=""> 获取真实 Wishlist 地址

在 YITH Wishlist 页面源代码中,你会发现这样一个表单:

复制代码
<form
  id="yith-wcwl-form"
  action="https://porto.zmrw.net/wishlist/view/8S2JHCVY28P9/"
  method="post"
  class="woocommerce yith-wcwl-form wishlist-fragment"
>

这里的 action 属性实际上就是 当前 Wishlist 的真实访问链接

https://porto.zmrw.net/wishlist/view/8S2JHCVY28P9/

这正是我们要拿到的"可追踪链接"。


这样客户不需要复制任何链接------

只要在 Wishlist 页面提交询盘表单,你就能在后台/邮件里看到:

✅ 客户真实 Wishlist 链接

✅ 方便你直接打开他收藏的清单进行跟进



Step 1:在 Contact Form 添加隐藏字段

你已经做得很对 ✅

在 Contact Form 里加入:

复制代码
<input type="hidden" name="wishlist_link" value="">

如果你用的是 Contact Form 7 也可以写成:

复制代码
[hidden wishlist_link id:wishlist_link]

Step 2:在 Wishlist 页面底部插入 JS,自动读取 form action

把下面 JS 放到 Wishlist 页面底部(或全站 footer,但只在 wishlist 页面生效也可以):

复制代码
// 获取 form 元素
var form = document.getElementById("yith-wcwl-form");

// 获取 action 值(真实 wishlist 链接)
var action = form.getAttribute("action");

// 给隐藏字段赋值
document.getElementsByName("wishlist_link")[0].value = action;

完成后,当用户在 wishlist 页面提交表单时,隐藏字段就会自动携带:

https://porto.zmrw.net/wishlist/view/8S2JHCVY28P9/


你需要在邮件通知中添加这一行,比如:

复制代码
Wishlist Link: [wishlist_link]

这样你每次收到询盘邮件,都会看到客户真实收藏链接。


建议升级:防止报错的更安全写法(推荐)

为了避免某些情况下页面没有 yith-wcwl-form 或表单字段不存在导致 JS 报错,建议你用更稳的版本:

复制代码
document.addEventListener("DOMContentLoaded", function () {
  var form = document.getElementById("yith-wcwl-form");
  var input = document.getElementsByName("wishlist_link")[0];

  if (form && input) {
    var action = form.getAttribute("action");
    if (action) input.value = action;
  }
});

✅ 更安全

✅ 更适合放在全站 footer

✅ 不会影响其他页面


额外技巧:同时把 wishlist token 也提取出来(可选)

如果你想在后台进一步做统计,比如只记录 token:

复制代码
document.addEventListener("DOMContentLoaded", function () {
  var form = document.getElementById("yith-wcwl-form");
  var input = document.getElementsByName("wishlist_link")[0];

  if (!form || !input) return;

  var action = form.getAttribute("action");
  input.value = action;

  // 提取 token(如 8S2JHCVY28P9)
  var match = action.match(/\/wishlist\/view\/([^\/]+)\//);
  if (match && match[1]) {
    console.log("Wishlist Token:", match[1]);
  }
});

常见问题 FAQ

1)客户未登录也能获取吗?

✅ 能获取,但取决于你是否允许游客创建 Wishlist。

如果允许游客 wishlist,这种 link 通常仍存在,但 token 可能与 cookie 绑定。


2)为什么不直接用 window.location.href

因为用户可能访问的是:

  • /wishlist/(入口页)

  • 但真实列表是 /wishlist/view/token/

你的目的不是拿当前页面地址,而是拿到 真正可追踪的列表地址

最准确的来源就是 #yith-wcwl-formaction


3)这个方法适用于 Elementor / WPForms 吗?

✅ 适用

因为核心是:

  • 表单有一个隐藏字段 wishlist_link

  • JS 自动赋值

    无论你用什么表单插件都可以实现


总结:让 Wishlist 成为真正可追踪的"询盘转化工具"

通过本文的方法,你可以实现:

✅ 自动获取 YITH Wishlist 的真实分享链接 /wishlist/view/xxx/

✅ 自动填入询盘表单隐藏字段

✅ 销售/客服收到邮件即可直接打开客户收藏清单

✅ 显著提升报价效率与转化率


复制即可用(最终代码)

✅ Contact Form 隐藏字段

复制代码
<input type="hidden" name="wishlist_link" value="">

✅ Wishlist 页面 JS

复制代码
document.addEventListener("DOMContentLoaded", function () {
  var form = document.getElementById("yith-wcwl-form");
  var input = document.getElementsByName("wishlist_link")[0];

  if (form && input) {
    var action = form.getAttribute("action");
    if (action) input.value = action;
  }
});
相关推荐
longze_77 天前
wordpress上传图片无法显示
wordpress
Web极客码7 天前
解决WordPress后台“外观”菜单消失
linux·服务器·wordpress
globaldomain7 天前
立海世纪:WordPress 6.9的新功能、新模块、新API
前端·javascript·html·新媒体运营·网站建设·wordpress·域名注册
podoor8 天前
专业外贸网站建站公司
wordpress
podoor8 天前
php版本升级后page页面别名调用出错解决方法
开发语言·php·wordpress
Web极客码9 天前
WordPress 被重定向到垃圾站的排查全过程
运维·服务器·网络·wordpress
longze_79 天前
解决wordpress内网穿透后,公网无法访问wordpress管理后台wp-admin问题
数据库·wordpress·反向代理
WordPress学习笔记10 天前
WordPress新手建站选SiteGround还是Hostinger
wordpress
WordPress学习笔记10 天前
专业WooCommerce模板一站式服务平台
wordpress
Web极客码10 天前
如何在WordPress中轻松添加阴影框提升网站设计
wordpress