For me, React Helmet works well.
<Helmet>
<script className="structured-data-list" type="application/ld+json">{structuredJSON}</script>
</Helmet>
Where structuredJSON
is something like result of such function:
export const structuredDataSingle = (prod, imgPath, availability) => {
let data = {
"@context": "http://schema.org/",
"@type": "Product",
"name": `${prod.title}`,
"image": prod.images.map((item) => imgPath + item),
"description": prod['description'],
"url": location.href,
"offers": {
"@type": "Offer",
"priceCurrency": `${prod['currency'] || "₴"}`,
"price": prod['price'] ? `${parseFloat(prod['price'])}` : 0,
"availability": `${availability}`,
"seller": {
"@type": "Organization",
"name": "TopMotoPro"
}
}
};
// brand
if(prod['brand']) {
data['mpn'] = prod['brand'];
data['brand'] = {
"@type": "Thing",
"name": `${prod['brand']}`
};
}
// logo
if(prod['logo']){
data['logo'] = imgPath + prod['logo'];
}
return JSON.stringify(data);
};