Where I can found the default schema code in shopify?
<script type="application/ld+json">
{
"#context": "http://schema.org/",
"#type": "AggregateRating",
"reviewCount": "2",
"ratingValue": "5.0",
"itemReviewed": {
"#type" : "Product",
"name" : "Cuisinart Automatic Bread Maker",
"offers": {
"#type": "AggregateOffer",
"lowPrice": "125.0",
"highPrice": "125.0",
"priceCurrency": "CAD"
}
}
}
</script>
This code actually visible after html tag. Need help. Screenshot attached
Currently the above mentioned schema not visible in latest version of structured data. Checked and confirmed.
Related
I'm updating microdata on my website and the agency asked me to provide microdata for blog articles. Everything is pretty clear except "mainEntityOfPage":
I found on schema.org that "mainEntityOfPage" can be implemented in this way:
<div itemScope itemType="https://schema.org/BlogPosting">
...
<link itemProp="mainEntityOfPage" href="example.com" />
</div>
So in the .json format it looks next:
{
"#context": "https://schema.org",
"#type": "BlogPosting",
"mainEntityOfPage": "example.com",
...
}
But the agency asked me to provide "mainEntityOfPage" so .json format looks like:
{
"#context": "https://schema.org",
"#type": "BlogPosting",
"mainEntityOfPage": {
"#type": "WebPage",
"#id": "example.com"
},
}
Is it possible to provide such microdata because I haven't found anything that looks like this?
Hello i wan't to loop two differents arrays inside one component like this
operationMep= [
{
"id": 15525205,
"type": "mise_en_prep",
"orderOperationSkus": [
{
"id": 24339529,
"orderSku": {
"id": 11747818,
"referenceMep": "MB0153",
"tax": 20,
"size": "M"
}
}
}
]
operationInvoice= [
{
"id": 16525205,
"type": "invoice",
"orderOperationSkus": [
{
"id": 24339529,
"orderSku": {
"id": 11747818,
"referenceInvoice": "MB0153"
}
}
}
]
<div v-for="itemMep in operationMep">
<my-template
v-for="itemVoice in operationInvoice"
:size="itemMep.size"
:invoice="itemVoice.referenceInvoice">
</my-template>
</div>
it's possible to do that because i have 2 loop inside this component and i want to add a condition if operation invoice is null just loop operationMep. thank you
If I understand correctly, you want to avoid rendering the nested <my-template> if operationInvoice is null.
You could wrap the nested v-for loop with v-if="operationInvoice":
<div v-for="itemMep in operationMep">
<template v-if="operationInvoice">
<my-template
v-for="itemVoice in operationInvoice"
:size="itemMep.size"
:invoice="itemVoice.referenceInvoice">
</my-template>
</template>
<!-- other markup here -->
</div>
When trying to add a json-ld script tag to a section that gets teleported to the HEAD, the Vue 3 compiler fails with this error:
VueCompilerError: Tags with side effect (<script> and <style>) are ignored in client component templates.
Template:
<template>
<teleport to="head">
<script type="application/ld+json">
{
"#context": "https://schema.org",
"#type": "WebSite",
"url": "https://www.example.com/",
"potentialAction": {
"#type": "SearchAction",
"target": "https://query.example.com/search?q={search_term_string}",
"query-input": "required name=search_term_string"
}
}
</script>
</teleport>
<div>
Hello world!
</div>
</template>
How can I add this json-ld tag without installing additional dependencies?
A workaround is to use Vue's built-in component (i.e., <component :is="'script'">) instead of <script>:
<template>
<teleport to="head">
<component :is="'script'" type="application/ld+json">
{
"#context": "https://schema.org",
"#type": "WebSite",
"url": "https://www.example.com/",
"potentialAction": {
"#type": "SearchAction",
"target": "https://query.example.com/search?q={search_term_string}",
"query-input": "required name=search_term_string"
}
}
</component>
</teleport>
<div>
Hello world!
</div>
</template>
demo
How to fetch the product name from the below result. I tried
<div class="card-divider">
{{ post.basic_info.prod_name }}
</div>
But it is not working
Many thanks
{
"name":"Test ProductCategory",
"updated":"2018-07-16 15:00:03",
"12":{
"basic_info":{
"prod_name":"Product name 1",
"status":"Active",
"image":""
},
},
"13":{
"basic_info":{
"prod_name":"Product name 2",
"status":"Active",
"image":""
},
}
}
Try this:
{{ post["12"].basic_info.prod_name }}
Your JSON have two same keys, so you will receive Product name 2 only, because, latter will replace previous key "12"
My suggestion, modify data to receive something like:
{
"name": "Test ProductCategory",
"updated": "2018-07-16 15:00:03",
"data": [
{
"basic_info": {
"prod_name": "Product name 1",
"status": "Active",
"image": ""
},
}, {
"basic_info": {
"prod_name": "Product name 2",
"status": "Active",
"image": ""
},
}
]
}
you can loop over data and get basic_info.prod_name then your html will be like:
<div class="card-divider" v-for="obj in post.data">
{{ obj.basic_info.prod_name }}
</div>
The Product Schema code that i am using as a custom HTML tag for implementing product schema using DOM variables in GTM..
<script>
var jsonData = {
"#context": "http://schema.org",
"#type": "Product",
"name": {{productName}},
"image": {{productImg}},
"url": {{Page URL}},
"aggregateRating": {
"#type": "AggregateRating",
"ratingValue": {{avgRating}},
"reviewCount": {{ratingsCount}},
}
}
var script = document.createElement('script');
script.type = 'application/ld+json';
script.text = JSON.stringify(jsonData);
$("head").append(script);
</script>
how can i configure the DOM element variable for AggregateRating Variables (avgRating, ratingsCount) in GTM.
here is the Markup
<div class="woocommerce-product-rating">
<div class="star-rating">
<span style="width:100%">
<strong class="rating">5.00</strong> out of <span>5</span> based on <span class="rating">1</span> customer rating </span>
</div>
(<span class="count">1</span> customer review) </div>
You need to create two variables in GTM
1) Go to Variables->User-Defined Variables->New->Custom Javascript
2) Create variable with name ProductAvgRating and JS code:
function () {
try {
return parseFloat(document.querySelector('.woocommerce-product-rating strong.rating').innerText);
}
catch(e) {return 0;}
}
2) Create variable with name ProductRatingsCount and JS code:
function () {
try {
return parseInt(document.querySelector('.woocommerce-product-rating span.rating').innerText);
}
catch(e) {return 0;}
}
And then change your html tag like that:
<script>
var jsonData = {
"#context": "http://schema.org",
"#type": "Product",
"name": {{productName}},
"image": {{productImg}},
"url": {{Page URL}},
"aggregateRating": {
"#type": "AggregateRating",
"ratingValue": {{ProductAvgRating}},
"reviewCount": {{ProductRatingsCount}},
}
}
var script = document.createElement('script');
script.type = 'application/ld+json';
script.text = JSON.stringify(jsonData);
$("head").append(script);
</script>
P.S. You didn't ask about productName and productImg variables, i guess you already have it