I'm wondering how airline companies, evites and big events manage to create emails that are formatted specifically for the event as seen below:
and also adds this event automatically to google calendar.
Can anyone direct me to any tutorial or explanation on the methods used?
I searched endlessly and found nothing.
What you describe is a result of adding a bit of markup to your emails: https://developers.google.com/gmail/markup/getting-started
An example event:
<script type="application/ld+json"> [ {
"#context": "http://schema.org/",
"#type": "EventReservation",
"reservationnumber": "9454as",
"reservationfor": {
"image": "whatever image url",
"name": "My event",
"#type": "Event",
"enddate": "2016-01-06T20:00:00+00:00",
"startdate": "2016-01-06T17:00:00+00:00",
"location": {
"name": "11th Street",
"#type": "Place"
} } } ] </script>
Before that make sure to do the registration steps described here:
https://developers.google.com/gmail/markup/registering-with-google
Related
I am trying to set up Schema.org on a website, but I have trouble understanding how to use the #id attribute.
I want to specify a Corporation and a WebSite. Here is the code without a reference between the two objects:
<script type="application/ld+json">
[{
"#context": "https://schema.org",
"#id": "https://www.example.com/#corporation",
"#type": "Corporation",
"name": "Company Name",
"legalName": "Company Name",
"description": "Company Description",
"url": "https://www.example.com",
"logo": "https://www.example.com/logo"
},
{
"#context": "https://schema.org",
"#type": "WebSite",
"name": "Example",
"url": "https://www.example.com"
}]]
</script>
The Schema.org validator finds both the Corporation and the WebSite. Google's Rich result test tool finds the logotype, as expected. Now, I want to add a reference to the Corporation as the publisher of the WebSite.
<script type="application/ld+json">
[{
"#context": "https://schema.org",
"#id": "https://www.example.com/#corporation",
"#type": "Corporation",
"name": "Company Name",
"legalName": "Company Name",
"description": "Company Description",
"url": "https://www.example.com",
"logo": "https://www.example.com/logo"
},
{
"#context": "https://schema.org",
"#type": "WebSite",
"name": "Example",
"url": "https://www.example.com",
"publisher": {
"#id": "https://www.example.com/#corporation"
}
}]]
</script>
The Schema.org validator now only shows the WebSite and has inlined the Corporation as publisher. The Google tool does not find any objects, but I was expecting it to still find the logotype.
I have spent quite some time with the Schema.org docs and searched the internet but I can't find an explanation to this behavior.
Am I doing it the wrong way? Thanks in advance.
At the moment logo is only shown in reports if it is in a top-level Organization entity. It is still recognised internally.
Google's logic sometimes ignores embedded entities.
I found a reference from Google on this. Point 2:
I've been trying to figure out a way to add how many likes were received to a product using structured data. Is what I have below correct? Or would the second example be more correct?
Is my usage of ["Product","InteractionCounter"] for the type correct in the first example?
I'm trying to have the google show a likes counter much like the aggregateRating property of Product.
I'm also not sure what the url in offers is supposed to point to or if it's necessary. Any ideas?
<script type="application/ld+json">
{
"#context": "https://schema.org",
"#type": ["Product","InteractionCounter"],
"name": "CC-1",
"description": "Wedding Cake",
"interactionType":{
"#type":"LikeAction",
"name": "Likes",
"description": "Likes Received"
},
"interactionService": {
"#type":"WebSite",
"url": "https://example.com/index.php?page=gallery"
},
"userInteractionCount": 55
}
</script>
OR
<script type="application/ld+json">
{
"#context": "https://schema.org",
"#type": "Product",
"name": "CC-1",
"description": "Wedding Cake",
"additionalProperty": {
"#type": "PropertyValue",
"name": "Likes",
"description": "Likes Received",
"value": 55
}
}
</script>
This is what I have right now:
<script type="application/ld+json">
{
"#context": "https://schema.org",
"#type": ["Product","InteractionCounter"],
"name": "CC-1",
"description": "Wedding Cake with bla bla bla",
"category": "Wedding Cakes",
"brand": {
"#type": "Brand",
"logo": "https://example.com/images/logo.png",
"slogan": "Cakes Are Nice"
},
"offers": {
"#type": "Offer",
"url": "https://example.com/anvil",
"priceCurrency": "CAD",
"price": "119.99"
},
"image": "https://example.com/collection/wedding_cakes/mid_def/CC-1",
"interactionType":{
"#type":"LikeAction",
"name": "Likes",
"description": "Likes Received"
},
"interactionService": {
"#type":"WebSite",
"url": "https://mimozas.com/index.php?page=gallery"
},
"userInteractionCount": "55 PLACEHOLDER"
}
If the product is the subject of content, then it makes sense to indicate likes as part of the type Product. My suggestion for you:
{"#context":"https://schema.org",
"#type":"Product",
"name":"CC-1",
"description":"Wedding Cake",
"subjectOf":{
"#type": "InteractionCounter",
"interactionType":{
"#type":"LikeAction",
"name":"Likes",
"description":"Likes Received"
},
"interactionService":{
"#type":"WebSite",
"url":"https://example.com/index.php?page=gallery"
},
"userInteractionCount":"55"
}
}
And be careful about inverted commas.
My addition after expanding the question.
I'm trying to have the google show a likes counter much like the
aggregateRating property of Product.
Google has no direct support for the type InteractionCounter - read more Explore the search gallery. However, in the rich test results of my suggestion, there are no errors or warning messages from Google:
Probably needs experimentation.
I can't for the life of me figure out how this company adding this meta data to their Google search.
Does anyone know how to add the data and booking links like the below image?
Thanks
What you are seeing in these search results is what Google defines as "Rich Results" more information can be viewed in Google's Structured Data documentation. Specifically Edgewater Medical center is taking advantage of the event functionality to define times and dates.
This can be verified by pasting the page's source in the Rich Results Test tool, results for this page can be viewed at
https://search.google.com/test/rich-results?utm_campaign=devsite&utm_medium=jsonld&utm_source=event&id=m1ZrUywePCZ_NglFJIjZfg
According to google documentation in order to make this happen you have to follow a few steps:
Ensure that Googlebot can crawl your event pages (meaning, your pages
aren't protected by a robots.txt file or robots meta tag).
Ensure that your server can handle increased crawl rate.
Make sure you follow the Google guidelines.
Add structured data to your event pages. Currently, the event experience on Google only supports pages that focus on a single event. We recommend focusing on adding markup to your event posting pages instead of pages that list schedules or multiple events.
An example of such "structured data" for a standard event is shown below:
<html>
<head>
<title>The Adventures of Kira and Morrison</title>
<script type="application/ld+json">
{
"#context": "https://schema.org",
"#type": "Event",
"name": "The Adventures of Kira and Morrison",
"startDate": "2025-07-21T19:00-05:00",
"endDate": "2025-07-21T23:00-05:00",
"eventAttendanceMode": "https://schema.org/OfflineEventAttendanceMode",
"eventStatus": "https://schema.org/EventScheduled",
"location": {
"#type": "Place",
"name": "Snickerpark Stadium",
"address": {
"#type": "PostalAddress",
"streetAddress": "100 West Snickerpark Dr",
"addressLocality": "Snickertown",
"postalCode": "19019",
"addressRegion": "PA",
"addressCountry": "US"
}
},
"image": [
"https://example.com/photos/1x1/photo.jpg",
"https://example.com/photos/4x3/photo.jpg",
"https://example.com/photos/16x9/photo.jpg"
],
"description": "The Adventures of Kira and Morrison is coming to Snickertown in a can’t miss performance.",
"offers": {
"#type": "Offer",
"url": "https://www.example.com/event_offer/12345_201803180430",
"price": "30",
"priceCurrency": "USD",
"availability": "https://schema.org/InStock",
"validFrom": "2024-05-21T12:00"
},
"performer": {
"#type": "PerformingGroup",
"name": "Kira and Morrison"
},
"organizer": {
"#type": "Organization",
"name": "Kira and Morrison Music",
"url": "https://kiraandmorrisonmusic.com"
}
}
</script>
</head>
<body>
</body>
</html>
I was wondering how to achieve same email structure as PayPal has.
It looks like this (in Google's Inbox):
But I can't find right type for it here: https://developers.google.com/gmail/markup/reference/
Any idea how to achieve the PayPal-like markup?
Using schema.org/Invoice and schema.org/PayAction, I was able to get the email structure that you've posted from PayPal. It also generated a "View Bill" button, which only shows in Inbox and not Gmail. Check out my example script below. The email markup tester seemed to like it, there were no errors found. Try sending it using this Gmail Schema Tester or through Apps Script with your Gmail account.
<script type="application/ld+json">
[
{
"#context": "http://schema.org",
"#type": "Invoice",
"description": "January 2015 Acme Bill",
"url": "https://www.americanexpress.com",
"accountId": "xxxx-xxxx-xxxx-1234",
"potentialaction": {
"url": "https://example.com",
"#type": "PayAction"
},
"paymentDue": "2020-01-30",
"minimumPaymentDue": {
"#type": "PriceSpecification",
"price": "$15.00"
},
"totalPaymentDue": {
"#type": "PriceSpecification",
"price": "$200.00"
},
"paymentStatus": "payment due",
"provider": {
"#type": "Organization",
"name": "Acme Bank"
}
}
]
</script>
You should get this:
I marked up my email and sent it using the Gmail App Script tutorial.
<script type="application/ld+json">
{
"#context": "http://schema.org",
"#type": "EmailMessage",
"action": {
"#type": "ReviewAction",
"review": {
"#type": "Review",
"itemReviewed": {
"#type": "FoodEstablishment",
"name": "Joe's Diner"
},
"reviewRating": {
"#type": "Rating",
"bestRating": "5",
"worstRating": "1"
}
},
"handler": {
"#type": "HttpActionHandler",
"url": "http://gmail-demo-heroku-123.herokuapp.com/review",
"requiredProperty": {
"#type": "Property",
"name": "review.reviewRating.ratingValue"
},
"optionalProperty": {
"#type": "Property",
"name": "review.reviewBody"
},
"method": "http://schema.org/HttpRequestMethod/POST"
}
},
"description": "We hope you enjoyed your meal at Joe's Diner. Please tell us about it."
}
</script>
It shows up correctly in my inbox. It shows a review button. When I click on it it has a field for the body of the review and 5 stars that you can select. The Call To Action says publish on Gmail.com which is a little strange (and may point to the core issue), but I'm not sure.
When I click on the review button in Gmail and fill out the form, it provides the following error when I submit it.
Unable to send rating to gmail.com. Click on the stars again to retry.
The endpoint I provide can be reached and returns a 200 when I call it from console.
payload = {'review.reviewRating.ratingValue' : '2.0', 'review.reviewBody' : 'incredible'}
requests.post('http://gmail-demo-heroku-123.herokuapp.com/review',payload)
<Response [200]>
Why is Gmail giving this error? Is there a good way to debug this request coming from Gmail? Also, why is the Review Card saying Publish to Gmail.com in the Call To Action? The Schema.org markup appears to be correct in the email.