Microdata Integration

Microdata Integration

With the help of microdata (also called microdata or structured data), the products from your online shop can be transferred to an email with a click. For this, your template must be extended.
Info
The use of structured data is also advantageous for search engines, as the data structures can be evaluated by major search engines. Your website can achieve a higher ranking with it.

Usage

Email templates

Requirements

The microdata must be in the vocabulary Schema.org or data-vocabulary.org. You can check the structured data of your webshop here, provided it uses the microdata vocabulary Schema.org:

Example

Template Source Code
Editor-View
Template Source Code
Example: Template with Microdata store article

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>Microdata Template</title>
  5.     <meta charset="UTF-8">
  6.     <style transform="true">
  7.       .font { font-family: Arial, sans-serif; }
  8.     </style>
  9.     <!-- cssToAttribute -->
  10. </head>
  11. <body>
  12. [CONTAINER name='contents' label='Inhalte' type='div' editor-only='true' microdata_able='true']

  14. [BETWEEN]
  15. <table border="0" cellspacing="0" cellpadding="0" width="640" align="center">
  16.   <tr>
  17.     <td style="height: 20px;"></td>
  18.   </tr>
  19. </table>
  20. [BETWEEN]

  22. [ELEMENT  name='shop-article-2-col'
  23.           label='Shop-Artikel (2 Spalten)'
  24.           type='div'
  25.           editor-only='true'
  26.           microdata_able='true'
  27.           microdata_type='schema.org']
  28. <table border="0" cellspacing="0" cellpadding="0" width="640" align="center">
  29.     <tr>
  30.         [BLOCK name='product-data' label='Produktangaben' independent='true']
  31.         <td style="width:200px;" valign="top">
  32.             [INPUT  type='a_img'
  33.                     name='bild'
  34.                     label='Bild'
  35.                     microdata='src:product-image,alt:product-name,href:url,comment:product-name'
  36.                     replace_path='//shop|https://shop'
  37.                     attributes='style="width:200px; height: auto; display: block;"'
  38.                     required='true' /]
  39.         </td>
  40.         <td style="width:20px;"></td>
  41.         [/BLOCK]
  42.         <td valign="top" class="font">
  43.             [BLOCK name='product-data' label='Produktangaben' independent='true']
  44.             [INPUT  type='h1'
  45.                     name='name'
  46.                     label='Produktname'
  47.                     rows='2'
  48.                     microdata='product-name'
  49.                     required='true' /]
  50.             [/BLOCK]

  52.             [BLOCK name='product-data' label='Produktangaben' independent='true']
  53.             <br /><br />
  54.             [INPUT  type='span'
  55.                     name='description'
  56.                     label='Beschreibung'
  57.                     rows='5'
  58.                     microdata='product-description'
  59.                     required='true' /]
  60.             [/BLOCK]

  62.             [BLOCK name='product-data' label='Produktangaben' independent='true']
  63.             <br /><br />
  64.             [INPUT  type='span'
  65.                     name='price'
  66.                     label='Preis'
  67.                     rows='1'
  68.                     microdata='product-offers-price'
  69.                     attributes='style="font-weight: bold;"'
  70.                     required='true' /] €
  71.             [/BLOCK]

  73.             [BLOCK name='product-data' label='Produktangaben' independent='true']
  74.             <br /><br />
  75.             [INPUT  type='a'
  76.                     name='link'
  77.                     label='Link'
  78.                     microdata='text:product-name,href:url,comment:product-name'
  79.                     required='true' /]
  80.             [/BLOCK]
  81.         </td>
  82.     </tr>
  83. </table>
  84. [/ELEMENT]

  86. [/CONTAINER]
  87. </body>
  88. </html>
Editor-View
View of the "Content" tab:

Editor view of the Microdata template

Click on the Microdata icon

Microdata icon

opens the "Import Microdata Article" dialog. Here, the desired target element can be selected and the values of the imported fields can be edited.
All attributes for microdata integration can be found in the MWML reference:
  1. CONTAINER attributes for microdata integration
  2. ELEMENT attributes for microdata integration
Learn in the next step how to embed HTML source code from your website:
  1. Embed external content