Search code examples
gmailgoogle-schemas

Invoice Receipts in Gmail for Answers In Search


I was creating code at google scripts https://goo.gl/pKUc7D to test order / invoice reciept markup from Google's own documentation at https://developers.google.com/gmail/markup/reference/order

It did not work. I could be missing something? The structured data testing tool gave me green checks for everything in the script textarea. I'm going to github the results to share with anyone else who runs whmcs billing software.


Solution

  • I'm not familiar with WHMCS billing software and how it works. I checked out your sample and I was a little confused. I see you're using:

    http://schema.org/Invoice
    

    This isn't supported in Gmail/Inbox. You'll have to follow the microdata example(s) for Order on the documentation. I noticed that even though your markup checks out with the Email Markup Tester, it doesn't mean it will be supported.

    I extracted the details from your sample data and created an example for you.

     <div itemscope itemtype="http://schema.org/Order">  
          <div itemprop="merchant" itemscope itemtype="http://schema.org/Organization">
            <meta itemprop="name" content="StrikeHawk eCommerce, Inc."/>
          </div>
          <meta itemprop="orderNumber" content="8360"/>
          <meta itemprop="priceCurrency" content="USD"/>
          <meta itemprop="price" content="10.71"/>
          <div itemprop="acceptedOffer" itemscope itemtype="http://schema.org/Offer">
            <div itemprop="itemOffered" itemscope itemtype="http://schema.org/Product">
              <meta itemprop="name" content="Hosting" />
              <link itemprop="image" href="https://lh4.googleusercontent.com/-U20_IAhRras/Uuqtev8Na3I/AAAAAAAAAIc/ptToUbM6cAY/s250-no/google-plus-photo.png"/>
            </div>
            <meta itemprop="price" content="5.35"/>
            <meta itemprop="priceCurrency" content="USD"/>
            <div itemprop="eligibleQuantity" itemscope itemtype="http://schema.org/QuantitativeValue">
              <meta itemprop="value" content="1"/>
            </div>
          </div>
          <div itemprop="acceptedOffer" itemscope itemtype="http://schema.org/Offer">
            <div itemprop="itemOffered" itemscope itemtype="http://schema.org/Product">
              <meta itemprop="name" content="Addon" />
              <link itemprop="image" href="https://lh4.googleusercontent.com/-U20_IAhRras/Uuqtev8Na3I/AAAAAAAAAIc/ptToUbM6cAY/s250-no/google-plus-photo.png"/>
            </div>
            <meta itemprop="price" content="5.35"/>
            <meta itemprop="priceCurrency" content="USD"/>
            <div itemprop="eligibleQuantity" itemscope itemtype="http://schema.org/QuantitativeValue">
              <meta itemprop="value" content="1"/>
            </div>
          </div>
          <div itemprop="billingAddress" itemscope itemtype="http://schema.org/PostalAddress">
            <meta itemprop="name" content="Denver Prophit Jr" />
            <meta itemprop="streetAddress" content="P.O. Box 0595" />
            <meta itemprop="addressLocality" content="New Smyrna Beach" />
            <meta itemprop="addressRegion" content="FL" />
            <meta itemprop="addressCountry" content="United States" />
          </div>
    <link itemprop="orderStatus" href="http://schema.org/OrderProcessing"/>
    <meta itemprop="isGift" content="false"/>
      <meta itemprop="discount" content="0.00"/>
      <meta itemprop="discountCurrency" content="USD"/>
      <link itemprop="url" href="https://www.google.com/+StrikehawkeComm"/>
      <div itemprop="customer" itemscope itemtype="http://schema.org/Person">
        <meta itemprop="name" content="Denver Prophit Jr"/>
           </div>

    This will trigger a View Order button that will direct your customer to the "invoice/receipt." Also note, I used the discount property, which I noticed in your microdata, the discount was being recognized as an item purchased.

    enter image description here

    Oh, also, if you're trying to send a bill, set the orderStatus as:

      <link itemprop="orderStatus" href="http://schema.org/OrderPaymentDue"/>
    

    I hope this helps.