(function () {
var scriptURL = ‘https://sdks.shopifycdn.com/buy-button/latest/buy-button-storefront.min.js’;
if (window.ShopifyBuy) {
if (window.ShopifyBuy.UI) {
ShopifyBuyInit();
} else {
loadScript();
}
} else {
loadScript();
}

function loadScript() {
var script = document.createElement(‘script’);
script.async = true;
script.src = scriptURL;
(document.head || document.body).appendChild(script);
script.onload = ShopifyBuyInit;
}

function ShopifyBuyInit() {
var client = ShopifyBuy.buildClient({
domain: ‘fqz1cj-3p.myshopify.com’,
storefrontAccessToken: ‘a3808a27682bd0266f5e360e6dbae66e’,
});

ShopifyBuy.UI.onReady(client).then(function (ui) {
// Hier zijn de drie unieke product-ID’s
const productIds = [‘15038846108025’, ‘15038846468473’, ‘15038845780345’];
const componentIds = [‘product-component-1’, ‘product-component-2’, ‘product-component-3’];

componentIds.forEach(function (id, index) {
ui.createComponent(‘product’, {
id: productIds[index],
node: document.getElementById(id),
moneyFormat: ‘%E2%82%AC%7B%7Bamount_with_comma_separator%7D%7D’,
options: {
“product”: {
“styles”: {
“product”: {
“@media (min-width: 601px)”: {
“max-width”: “100%”,
“margin-left”: “0”,
“margin-bottom”: “40px”
}
},
“button”: {
“font-family”: “Arial, sans-serif”,
“font-size”: “16px”,
“padding”: “16px 62px”,
“background-color”: “#3A5E55”,
“:hover”: { “background-color”: “#3A5E55” },
“:focus”: { “background-color”: “#3A5E55” },
“border-radius”: “12px”
},
“price”: { “color”: “#3A5E55” },
“compareAt”: { “color”: “#3A5E55” },
“unitPrice”: { “color”: “#3A5E55” }
},
“buttonDestination”: “modal”,
“contents”: { “options”: false },
“text”: { “button”: “Bekijk product” }
},
“modalProduct”: {
“contents”: {
“img”: false,
“imgWithCarousel”: true,
“button”: false,
“buttonWithQuantity”: true
},
“styles”: {
“button”: {
“font-family”: “Arial, sans-serif”,
“font-size”: “16px”,
“padding”: “16px 62px”,
“background-color”: “#3A5E55”,
“:hover”: { “background-color”: “#3A5E55” },
“:focus”: { “background-color”: “#3A5E55” },
“border-radius”: “12px”
}
},
“text”: { “button”: “Toevoegen aan winkelwagen” }
},
“cart”: {
“styles”: {
“button”: {
“font-family”: “Arial, sans-serif”,
“font-size”: “16px”,
“padding”: “16px”,
“background-color”: “#3A5E55”,
“:hover”: { “background-color”: “#3A5E55” },
“:focus”: { “background-color”: “#3A5E55” },
“border-radius”: “12px”
}
},
“text”: {
“title”: “Winkelwagen”,
“total”: “Subtotaal”,
“empty”: “Je winkelwagen is leeg.”,
“notice”: “Verzendkosten worden bij het afrekenen berekend.”,
“button”: “Afrekenen”
}
},
“toggle”: {
“styles”: {
“toggle”: {
“font-family”: “Arial, sans-serif”,
“background-color”: “#3A5E55”,
“:hover”: { “background-color”: “#3A5E55” },
“:focus”: { “background-color”: “#3A5E55” }
},
“count”: { “font-size”: “16px” }
}
}
}
});
});
});
}
})();