Externe Inhalte einbetten

Externe Inhalte einbetten

Mit externen-Inhalten lässt sich der Inhalt einer Website in deiner E-Mail oder Landingpage verwenden. Bitte beachte, dass der Inhalt nicht im Editor angezeigt wird - öffne dazu die Vorschau. Du kannst externe Inhalte beispielsweise verwenden, um in deinem Mailing abonnentenspezifische Produkte, Ansprechpartner oder ähnliches anzuzeigen.

Verwendung

E-Mail-Templates, Landingpage-Templates, E-Mails, Landingpages

Idea
Hinweise für die Verwendung in Mailings
  1. Links innerhalb externer Inhalte lassen sich nicht nachverfolgen.
  2. CSS-To-Inline und CSS-To-Attributes wird nicht in den externen Inhalten angewendet.
  3. Die Einbettung von externen Inhalten kann sich negativ auf die Versandgeschwindigkeit auswirken. Stelle entsprechend sicher, dass der Aufruf der eingebetteten Website ausreichend schnell ist.

Syntax

  1. [EXTERNAL-CONTENT ...]<WEBSITE-URL>[/EXTERNAL-CONTENT]

Attribute

Attribut
Beschreibung
failure-strategy
Werte: continue1, stop
Bei Verwendung in E-Mails. Legt fest, ob der Versand für den Abonnenten bei einem Fehler fortgesetzt oder abgebrochen werden soll. Abbrüche sind als Erstellungsfehler in der E-Mail-Statistik zu sehen.
fetch-attempts
Anzahl der Versuche bei Fehler.
Standard: 3
fetch-retry-after
Zeitabstand zwischen einzelnen Versuchen in Sekunden.
Standard: 3

Beispiele

Beispiel 1: Dynamische URL

Die URL lässt sich dynamisieren, beispielsweise durch Einfügen eines Platzhalters für ein Abonnentenfeld. So lassen sich für die Abonnenten individuelle Inhalte ausspielen:

Beispiel 1: URL-Parameter aus Abonnentendaten
  1. [EXTERNAL-CONTENT
  2.   failure-strategy='stop'
  3.   fetch-attempts='2'
  4.   fetch-retry-after='1'
  5. ]https://example.com/shop/?id=[Product_ID /][/EXTERNAL-CONTENT]

Beispiel 2: Mehrere externe Inhalte

Beispiel 2: Template-Quellcode für Zweispalter mit dynamischen Produkten
  1. <table border="0" cellpadding="0" cellspacing="0" width="640" align="center">
  2.     <tr>
  3.         <td style="width: 300px;">
  4.             [EXTERNAL-CONTENT]https://example.com/shop/?id=[Product_1_ID /][/EXTERNAL-CONTENT]
  5.         </td>
  6.         <td style="width: 40px;"></td>
  7.         <td style="width: 300px;">
  8.             [EXTERNAL-CONTENT]https://example.com/shop/?id=[Product_2_ID /][/EXTERNAL-CONTENT]
  9.         </td>
  10.     </tr>
  11. </table>

Beispiel 3: Vollständiges Template

Template-Quellcode
Quellcode der externen Inhalte
Editor-Ansicht
Vorschau/Ausgabe
Template-Quellcode
Beispiel 3: Template-Quellcode für Zweispalter mit Shop-Artikeln

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>Template mit externen Inhalten</title>
  5.     <meta charset="UTF-8">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7. </head>
  8. <body>
  9. [CONTAINER name='contents' label='Inhalte' type='div' editor-only='true']

  11. [BETWEEN]<br/><br/>[/BETWEEN]

  13. [ELEMENT  name='2-col-products'
  14.           label='2-Spalter - Produkte'
  15.           descr='Externe Inhalte'
  16.           default='true'
  17.           type='div'
  18.           editor-only='true']
  19. <table border="0" cellpadding="0" cellspacing="0" width="640" align="center">
  20.     <tr>
  21.         <td style="width: 300px;" valign="top">
  22.             [EXTERNAL-CONTENT]
  23.             [INPUT  type='url'
  24.                     name='url-1'
  25.                     label='URL Produkt 1'
  26.                     default='https://doku.webapps.sendnode.com/examples/product-2-col-1.html' /]
  27.             [/EXTERNAL-CONTENT]
  28.         </td>
  29.         <td style="width: 40px;"></td>
  30.         <td style="width: 300px;" valign="top">
  31.             [EXTERNAL-CONTENT]
  32.             [INPUT  type='url'
  33.                     name='url-2'
  34.                     label='URL Produkt 2'
  35.                     default='https://doku.webapps.sendnode.com/examples/product-2-col-2.html' /]
  36.             [/EXTERNAL-CONTENT]
  37.         </td>
  38.     </tr>
  39. </table>
  40. [/ELEMENT]

  42. [/CONTAINER]
  43. </body>
  44. </html>
Quellcode der externen Inhalte
Beachte, dass im Quellcode der externen Inhalte nur die Inhalte selbst enthalten sein dürfen, da <head>, <body> etc. bereits im Template-Quellcode definiert sind.


Shop-Artikel 1: product-2-col-1.html
  1. <table border="0" cellpadding="0" cellspacing="0" width="300">
  2.     <tr>
  3.         <td><img src="https://doku.webapps.sendnode.com/examples/images/foscarini-lumiere-05-tavolo.jpg" style="width:300px;height:auto;display:block;"></td>
  4.     </tr>
  5.     <tr>
  6.         <td style="padding-top: 15px;">
  7.             <h1 style="margin-top: 0px; margin-bottom: 0px; font-family: Arial, sans-serif; font-size: 24px; line-height: 32px;">Lumiere 05 Tavolo Piccola</h1>
  8.         </td>
  9.     </tr>
  10.     <tr>
  11.         <td style="padding-top: 15px; font-family: Arial, sans-serif; font-size: 16px; line-height: 24px;">Die Foscarini Tischleuchte Lumiere 05 Tavolo Piccola ist ein Produkt des Designers Rodolfo Dordoni, der nicht nur in der Produktkonzeption, sondern auch als Architekt mit der Planung und Gestaltung von Ausstellungen und Showrooms beschäftigt ist.
  12.         </td>
  13.     </tr>
  14.     <tr>
  15.         <td style="padding-top: 25px;">
  16.             <table border="0" cellpadding="0" cellspacing="0">
  17.                 <tr>
  18.                     <td style="background-color: #E52D11; padding: 12px 25px;">
  19.                         <a href="#" style="font-family: Arial, sans-serif; font-size: 16px; line-height: 24px; font-weight: bold; color: #ffffff; text-decoration: none">Zum Produkt</a>
  20.                     </td>
  21.                 </tr>
  22.             </table>
  23.         </td>
  24.     </tr>
  25. </table>


Shop-Artikel 2: product-2-col-2.html
  1. <table border="0" cellpadding="0" cellspacing="0" width="300">
  2.     <tr>
  3.         <td><img src="https://doku.webapps.sendnode.com/examples/images/fritz-hansen-kaiser-idell-6631r.jpg" style="width:300px;height:auto;display:block;"></td>
  4.     </tr>
  5.     <tr>
  6.         <td style="padding-top: 15px;">
  7.             <h1 style="margin-top: 0px; margin-bottom: 0px; font-family: Arial, sans-serif; font-size: 24px; line-height: 32px;">Kaiser Idell 6631-T Luxus</h1>
  8.         </td>
  9.     </tr>
  10.     <tr>
  11.         <td style="padding-top: 15px; font-family: Arial, sans-serif; font-size: 16px; line-height: 24px;">Als formvollendete Einheit von Material, Funktion und gutem Aussehen ist die Kaiser Idell 6631 Luxus, produziert vom Lampenhersteller Fritz Hansen, zu Recht DER Klassiker unter den Schreibtischlampen. Christian Dells Entwurf der Kaiser Leuchte aus den frühen 1930er Jahren steht für die innovative Ingenieurskunst dieser Zeit und ist zugleich ein gelungenes Beispiel dafür, wie formale und funktionale Qualität die Zeiten überdauern.
  12.         </td>
  13.     </tr>
  14.     <tr>
  15.         <td style="padding-top: 25px;">
  16.             <table border="0" cellpadding="0" cellspacing="0">
  17.                 <tr>
  18.                     <td style="background-color: #E52D11; padding: 12px 25px;">
  19.                         <a href="#" style="font-family: Arial, sans-serif; font-size: 16px; line-height: 24px; font-weight: bold; color: #ffffff; text-decoration: none">Zum Produkt</a>
  20.                     </td>
  21.                 </tr>
  22.             </table>
  23.         </td>
  24.     </tr>
  25. </table>
Editor-Ansicht
Editor-Ansicht
Vorschau/Ausgabe
Vorschau
 

1. Standard: Wird das Attribut weggelassen, wird es automatisch mit diesem Wert initialisiert.