test
<div id='product-component-1759333801298'></div>
<script type="text/javascript">
(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() {
console.log("✅ ShopifyBuyInit called");
var client = ShopifyBuy.buildClient({
domain: '8aebe2.myshopify.com',
storefrontAccessToken: '29690863a71d014d07e7db56de93cb03',
});
ShopifyBuy.UI.onReady(client).then(function (ui) {
console.log("✅ ShopifyBuy.UI ready");
client.product.fetchQuery({
first: 12,
query: 'product_type:"T-Shirt"'
}).then(function(products) {
console.log("✅ Products fetched:", products);
ui.createComponent('productSet', {
products: products,
node: document.getElementById('product-component-1759333801298'),
moneyFormat: '%24%7B%7Bamount%7D%7D',
options: {
"product": {
"styles": {
"product": {
"@media (min-width: 601px)": {
"max-width": "calc(25% - 20px)",
"margin-left": "20px",
"margin-bottom": "50px"
}
},
"button": {
":hover": {"background-color": "#ca0f1e"},
"background-color": "#e01121",
":focus": {"background-color": "#ca0f1e"}
}
},
"width": "280px",
"text": {"button": "Add to cart"}
},
"modalProduct": {
"contents": {
"img": false,
"imgWithCarousel": true,
"button": false,
"buttonWithQuantity": true
},
"text": {"button": "Add to Cart"}
}
},
events: {
afterRender: function(component) {
console.log("▶️ afterRender fired for:", component.model.title, "Type:", component.model.productType);
if (component.model && component.model.productType) {
const container = component.node.querySelector('.shopify-buy__product');
if (container) {
let typeEl = container.querySelector('.product-type');
if (!typeEl) {
typeEl = document.createElement('div');
typeEl.className = 'product-type';
typeEl.textContent = component.model.productType;
typeEl.style.fontSize = '14px';
typeEl.style.color = '#666';
typeEl.style.marginTop = '4px';
container.querySelector('.shopify-buy__title')
.insertAdjacentElement('afterend', typeEl);
console.log("✅ Inserted product type:", component.model.productType);
}
}
}
},
afterOpenModal: function(component) {
console.log("▶️ afterOpenModal fired for:", component.model.title, "Type:", component.model.productType);
if (component.model && component.model.productType) {
const modalContainer = document.querySelector('.shopify-buy__modal-product');
if (modalContainer) {
let typeEl = modalContainer.querySelector('.product-type');
if (!typeEl) {
typeEl = document.createElement('div');
typeEl.className = 'product-type';
typeEl.textContent = component.model.productType;
typeEl.style.fontSize = '16px';
typeEl.style.color = '#444';
typeEl.style.margin = '6px 0';
modalContainer.querySelector('.shopify-buy__title')
.insertAdjacentElement('afterend', typeEl);
console.log("✅ Inserted product type into modal:", component.model.productType);
}
}
}
}
}
});
});
});
}
})();
</script>
