如何使Shopify购买按钮重定向到特定语言的结账

Question

我有一个英文版和荷兰语版的外部网站。在这个网站上，我为我想销售的产品嵌入了多个购买按钮。所有这些产品都不用推车；他们直接进入结账页面。由于我想要多语言结账(因为我的外部网站也是多语言的(，我购买了Weglot订阅来翻译结账页面。唯一的问题是，我可以查看商店的英文版(通过这个URLhttps://en.shop.hofleveranciervanrubens.be/)，但我似乎无法在购买按钮上使用此URL将客户重定向到正确的英文版结账(荷兰语是Shopify的"主要"语言(

我看到很多人在做这个教程来本地化他们的购买按钮，但afterInit((事件不会触发(我想是因为我有直接结账，而不是购物车(https://www.felixparadis.com/posts/localization-of-shopifys-buy-buttons/

ShopifyBuy.UI.onReady(client).then(function (ui) {
ui.createComponent('product', {
id: '6750224449710',
node: document.getElementById('product-component-1627130549176'),
moneyFormat: '%24%7B%7Bamount%7D%7D',
options: {
"product": {
// Skipping lots of code for brevity ...
},
"productSet": {
// Skipping lots of code for brevity ...
},
"modalProduct": {
// Skipping lots of code for brevity ...
},
"option": {},
"cart": {
// * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
// * 👇THIS IS WHERE MAGIC HAPPENS👇
// * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
"events": {
afterInit: (cart) => {
cart.onCheckout = () => {
const checkoutUrl = cart.model.webUrl + '&locale=en';
cart.checkout.open(checkoutUrl);
};
},
},
// * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
// * 👆THIS IS WHERE MAGIC HAPPENS👆
// * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
"styles": {
// Skipping lots of code for brevity ...
},
"text": {
// Skipping lots of code for brevity ...
},
"popup": false
},
"toggle": {
// Skipping lots of code for brevity ...
}
}
})
})

这是我的网站的外部URL：https://www.hofleveranciervanrubens.be/

我的问题总结如下：我如何让Shopify知道他们应该用哪种语言通过buybutton.js显示结账

Answer 1

我认为您说粘贴的代码不起作用是对的，因为您没有使用cart功能。

事实上，在这里的文档中http://shopify.github.io/buy-button-js/您可以看到Cart组件有事件，而Checkout似乎没有事件。

我认为您可以尝试使用事件和调试器，看看您是否能够中断正确的事件并从此更改URL。

不管怎样，总有办法让它发挥作用。实际上是两个。您可以修改所有的结账链接，添加您的"&locale=en"；shopify购买初始化后，或者你可以在点击时更改链接。第二种方法有点复杂，但它确保始终应用，即使是在延迟加载或类似情况下也是如此。

解决方案2看起来像这样：(我从这个答案中获得了灵感https://stackoverflow.com/a/33616981/343794)。

function interceptClickEvent(e) {
var href;
var target = e.target || e.srcElement;
if (target.tagName === 'A') {
href = target.getAttribute('href');
if (href.indexOf("checkout")>=0) { //filtering only checkout links
window.open(href+"&locale=en",'_blank');
e.preventDefault();
}
}
}

//listen for link click events at the document level
document.addEventListener('click', interceptClickEvent);