Defining a bill or invoice using Google email mark

Question

I know this can be done because i'm looking at an invoice from a telco in my gmail inbox mobile app but I don't know how to set the gmail markup / schema to make it happen.

The example I have shows:

August bill for xxxx
Total: $xxx, due MMM DD

$ Total amount due
$xxxx

Due date
DD MMM

Issuer
Telco X

Can anyone help? I can't find any guidance on the email markup pages on Google.

Answer 1

@AaronP, I've posted my findings and example in this issue similar to your question. Using schema.org/Invoice and schema.org/PayAction, I was able to get the email similar to what you received from Telco X. Keep in mind that this seems only active with Inbox and not Gmail.

 <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:

Answer 2

It uses regular http://schema.org markup within the HTML of the email. See gmail markup reference. Example adapted from google's gmail markup example:

<div itemscope itemtype="http://schema.org/Order">
<div itemprop="merchant" itemscope itemtype="http://schema.org/Organization">
 <meta itemprop="name" content="Amazon.com"/>
</div>
<meta itemprop="orderNumber" content="123-4567890-1234567"/>
<meta itemprop="priceCurrency" content="USD"/>
<meta itemprop="price" content="259.99"/>
<div itemprop="acceptedOffer" itemscope itemtype="http://schema.org/Offer">
<div itemprop="itemOffered" itemscope itemtype="http://schema.org/Product">
  <meta itemprop="name" content="Samsung Chromebook"/>
  <meta itemprop="sku" content="B009LL9VDG"/>
  <link itemprop="url" href="https://rads.stackoverflow.com/amzn/click/com/B009LL9VDG" rel="nofollow noreferrer"/>
  <link itemprop="image" href="http://ecx.images-amazon.com/images/I/81H-DO3qX0L._SX522_.jpg"/>
</div>
<meta itemprop="price" content="249.99"/>
<meta itemprop="priceCurrency" content="USD"/>
<div itemprop="eligibleQuantity" itemscope itemtype="http://schema.org/QuantitativeValue">
  <meta itemprop="value" content="1"/>
</div>
<div itemprop="seller" itemscope itemtype="http://schema.org/Organization">
  <meta itemprop="name" content="Samsung Marketplace Store"/>
</div>
</div>
</div>
<div itemprop="priceSpecification" itemscope itemtype="http://schema.org/DeliveryChargeSpecification">
<meta itemprop="price" content="10.00"/>
<meta itemprop="priceCurrency" content="USD"/>
</div>
<link itemprop="url" href="https://www.amazon.ca/gp/css/summary/edit.html/orderID=123-4567890-1234567"/>
<div itemprop="potentialAction" itemscope itemtype="http://schema.org/ViewAction">
<link itemprop="target" href="https://www.amazon.ca/gp/css/summary/edit.html/orderID=123-4567890-1234567"/>
</div>
<link itemprop="orderStatus" href="http://schema.org/OrderStatus/OrderProcessing"/>