มาร์กอัปอีเมลใช้ Structured Data ในอีเมลเพื่อทํางาน Gmail รองรับทั้ง JSON-LD และ Microdata คุณจึงใช้รูปแบบใดรูปแบบหนึ่งในการมาร์กอัปข้อมูลในอีเมลได้ วิธีนี้ช่วยให้ Google เข้าใจช่องต่างๆ และให้ผลการค้นหา การดำเนินการ และการ์ดที่เกี่ยวข้องแก่ผู้ใช้ เช่น หากอีเมลเกี่ยวกับการจองกิจกรรม คุณอาจต้องการกำกับเนื้อหาเกี่ยวกับเวลาเริ่มต้น สถานที่จัดงาน จำนวนตั๋ว และข้อมูลอื่นๆ ทั้งหมดที่ระบุการจอง
มาร์กอัปแรก
สมมติว่าคุณมีหน้าที่รับผิดชอบในการส่งตั๋ว Google I/O 2013 ให้กับผู้เข้าร่วม และคุณต้องการใช้ข้อมูลความหมายมาร์กอัปในอีเมลเหล่านี้ อย่างน้อยที่สุด อีเมลยืนยันตั๋วจะมี HTML ที่มีลักษณะต่อไปนี้
<html>
<body>
<p>
Dear John, thanks for booking your Google I/O ticket with us.
</p>
<p>
BOOKING DETAILS<br/>
Order for: John Smith<br/>
Event: Google I/O 2013<br/>
When: May 15th 2013 8:30am PST<br/>
Venue: Moscone Center, 800 Howard St., San Francisco, CA 94103<br/>
Reservation number: IO12345<br/>
</p>
</body>
</html>
การกำกับเนื้อหาอีเมลนี้เป็นเรื่องง่าย คุณสามารถเพิ่มข้อมูลที่เกี่ยวข้องในเนื้อหาอีเมลได้ทุกที่ภายใน body
ของ HTML ของอีเมลในรูปแบบที่มีโครงสร้างซึ่งสอดคล้องกับรูปแบบที่รองรับ บล็อกโค้ดต่อไปนี้แสดงลักษณะของอีเมลที่มีการทำเครื่องหมาย
JSON-LD
<html>
<body>
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "EventReservation",
"reservationNumber": "IO12345",
"underName": {
"@type": "Person",
"name": "John Smith"
},
"reservationFor": {
"@type": "Event",
"name": "Google I/O 2013",
"startDate": "2013-05-15T08:30:00-08:00",
"location": {
"@type": "Place",
"name": "Moscone Center",
"address": {
"@type": "PostalAddress",
"streetAddress": "800 Howard St.",
"addressLocality": "San Francisco",
"addressRegion": "CA",
"postalCode": "94103",
"addressCountry": "US"
}
}
}
}
</script>
<p>
Dear John, thanks for booking your Google I/O ticket with us.
</p>
<p>
BOOKING DETAILS<br/>
Reservation number: IO12345<br/>
Order for: John Smith<br/>
Event: Google I/O 2013<br/>
Start time: May 15th 2013 8:00am PST<br/>
Venue: Moscone Center, 800 Howard St., San Francisco, CA 94103<br/>
</p>
</body>
</html>
Microdata
<html>
<body>
<div itemscope itemtype="http://schema.org/EventReservation">
<meta itemprop="reservationNumber" content="IO12345"/>
<div itemprop="underName" itemscope itemtype="http://schema.org/Person">
<meta itemprop="name" content="John Smith"/>
</div>
<div itemprop="reservationFor" itemscope itemtype="http://schema.org/Event">
<meta itemprop="name" content="Google I/O 2013"/>
<time itemprop="startDate" datetime="2013-05-15T08:30:00-08:00"/>
<div itemprop="location" itemscope itemtype="http://schema.org/Place">
<meta itemprop="name" content="Moscone Center"/>
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<meta itemprop="streetAddress" content="800 Howard St."/>
<meta itemprop="addressLocality" content="San Francisco"/>
<meta itemprop="addressRegion" content="CA"/>
<meta itemprop="postalCode" content="94103"/>
<meta itemprop="addressCountry" content="US"/>
</div>
</div>
</div>
</div>
<p>
Dear John, thanks for booking your Google I/O ticket with us.
</p>
<p>
BOOKING DETAILS<br/>
Reservation number: IO12345<br/>
Order for: John Smith<br/>
Event: Google I/O 2013<br/>
Start time: May 15th 2013 8:00am PST<br/>
Venue: Moscone Center, 800 Howard St., San Francisco, CA 94103<br/>
</p>
</body>
</html>
Microdata (แทรกในหน้า)
<html>
<body>
<p>
Dear John, thanks for booking your Google I/O ticket with us.
</p>
<p itemscope itemtype="http://schema.org/EventReservation">
BOOKING DETAILS<br/>
Reservation number: <span itemprop="reservationNumber">IO12345</span><br/>
Order for: <span itemprop="underName" itemscope itemtype="http://schema.org/Person">
<span itemprop="name">John Smith</span>
</span><br/>
<div itemprop="reservationFor" itemscope itemtype="http://schema.org/Event">
Event: <span itemprop="name">Google I/O 2013</span><br/>
<time itemprop="startDate" datetime="2013-05-15T08:30:00-08:00">Start time: May 15th 2013 8:00am PST</time><br/>
Venue: <span itemprop="location" itemscope itemtype="http://schema.org/Place">
<span itemprop="name">Moscone Center</span>
<span itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">800 Howard St.</span>,
<span itemprop="addressLocality">San Francisco</span>,
<span itemprop="addressRegion">CA</span>,
<span itemprop="postalCode">94103</span>,
<span itemprop="addressCountry">US</span>
</span>
</span>
</div>
</p>
</body>
</html>
อีเมลข้างต้นมีชุดข้อมูลขั้นต่ำในการกำหนดการจองกิจกรรม คุณมาร์กอัปข้อมูลอื่นๆ ในอีเมลเพื่อปรับปรุงประสบการณ์ของผู้ใช้ได้ ตัวอย่างเช่น พร็อพเพอร์ตี้ ticketToken
ของออบเจ็กต์ FlightReservation
ช่วยให้คุณเพิ่มรูปภาพบาร์โค้ด เช่น คิวอาร์โค้ด ซึ่งรวมอยู่ในการ์ดบอร์ดดิ้งพาสได้
ดูข้อมูลเกี่ยวกับประเภทและพร็อพเพอร์ตี้ที่รองรับทั้งหมดได้ที่คู่มืออ้างอิง