- Wait for ShopifyCart to be available before initializing structured data - Add getCart() method to retrieve existing cart from Shopify API - Load cart state on page load to display correct initial cart contents Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
94 lines
2.6 KiB
PHP
94 lines
2.6 KiB
PHP
<?php
|
|
/**
|
|
* Structured Data (JSON-LD) for Product pages
|
|
* This will be populated by JavaScript after Shopify data is loaded
|
|
*/
|
|
?>
|
|
<script type="application/ld+json" id="product-schema">
|
|
{
|
|
"@context": "https://schema.org/",
|
|
"@type": "Product",
|
|
"name": "<?= $page->title() ?>",
|
|
"description": "",
|
|
"image": [],
|
|
"offers": {
|
|
"@type": "Offer",
|
|
"url": "<?= $page->url() ?>",
|
|
"priceCurrency": "EUR",
|
|
"price": "0",
|
|
"availability": "https://schema.org/InStock",
|
|
"seller": {
|
|
"@type": "Organization",
|
|
"name": "Index.ngo"
|
|
}
|
|
},
|
|
"brand": {
|
|
"@type": "Organization",
|
|
"name": "Index.ngo"
|
|
}
|
|
}
|
|
</script>
|
|
<script>
|
|
// Update structured data when product loads
|
|
(function() {
|
|
const container = document.querySelector('[data-product-loader]');
|
|
if (!container) return;
|
|
|
|
const handle = container.dataset.shopifyHandle;
|
|
const language = container.dataset.language || 'fr';
|
|
const isEnglish = language === 'en';
|
|
|
|
function initStructuredData() {
|
|
if (typeof ShopifyCart === 'undefined') {
|
|
setTimeout(initStructuredData, 100);
|
|
return;
|
|
}
|
|
|
|
const cart = new ShopifyCart({
|
|
domain: 'nv7cqv-bu.myshopify.com',
|
|
storefrontAccessToken: 'dec3d35a2554384d149c72927d1cfd1b'
|
|
});
|
|
|
|
cart.getProductByHandle(handle).then(product => {
|
|
if (!product) return;
|
|
|
|
const title = isEnglish && product.titleEn?.value ? product.titleEn.value : product.title;
|
|
const description = isEnglish && product.descriptionEn?.value ? product.descriptionEn.value : product.description;
|
|
const price = parseFloat(product.priceRange.minVariantPrice.amount);
|
|
const images = product.images.edges.map(edge => edge.node.url);
|
|
const availability = product.availableForSale ? 'https://schema.org/InStock' : 'https://schema.org/OutOfStock';
|
|
|
|
const schema = {
|
|
"@context": "https://schema.org/",
|
|
"@type": "Product",
|
|
"name": title,
|
|
"description": description,
|
|
"image": images,
|
|
"offers": {
|
|
"@type": "Offer",
|
|
"url": window.location.href,
|
|
"priceCurrency": "EUR",
|
|
"price": price.toFixed(2),
|
|
"availability": availability,
|
|
"seller": {
|
|
"@type": "Organization",
|
|
"name": "Index.ngo"
|
|
}
|
|
},
|
|
"brand": {
|
|
"@type": "Organization",
|
|
"name": "Index.ngo"
|
|
}
|
|
};
|
|
|
|
const schemaScript = document.getElementById('product-schema');
|
|
if (schemaScript) {
|
|
schemaScript.textContent = JSON.stringify(schema, null, 2);
|
|
}
|
|
});
|
|
}
|
|
|
|
// Initialize when ShopifyCart is available
|
|
initStructuredData();
|
|
})();
|
|
</script>
|