Eigenes Newsletter-Template erstellen

Aus Sendcockpit

Wechseln zu:Navigation, Suche
Wenn Sie Ihr Newsletter-Template selbst programmieren, können wir Ihnen keinen kostenlosen Support für die HTML-Programmierung und die Darstellungsoptimierung bei den verschiedenen E-Mail Clients geben. Gerne erstellen auch wir ein individuelles Template für Sie. Kontaktieren Sie uns einfach.
Warning


Inhaltsverzeichnis

Allgemeines

Hier erfahren Sie, wie Sie eigene Mailing-Templates erstellen können. Sie finden die Verwaltung der Templates im Hauptmenü Benutzerkonto unter dem Reiter Mailing-Templates.


Neben der Erstellung eines vollkommen neuen Templates können Sie auch ein bereits bestehendes Template modifizieren. Dazu stellen wir Ihnen auch kostenlos die Quellcodes all unserer Standard-Templates zur Verfügung. Wie das geht, erfahren Sie hier.
Info

Quellcode Beispiel-Template

Hier finden Sie den Quellcode eines Beispiel-Templates zum Download. Bitte laden Sie sich diese Datei zum besseren Verständnis der nachfolgenden Informationen herunter. Im folgenden wird öfter Bezug darauf genommen.
Download

Das Prinzip Elemente

Ein Template besteht im einfachsten Fall aus einem ganz gewöhnlichen HTML-Quellcode, jedoch ergänzt um einige spezielle Platzhalter, die so genannten Elemente. Diese ermöglichen bei Verwendung des Templates das einfache Editieren von Inhalten über unseren Editor.

Die drei Elemente mit Beispielen für die Einbindung

Text-Element

Bei Text-Elementen kann später im Editor lediglich der Text geändert werden. Die Formatierung ist vorgegeben.

<chamtxt linkstyle="text-decoration:none;">Ein Text-Element</chamtxt>

HTML-Element

Bei HTML-Elementen kann zusätzlich die Formatierung und Ausrichtung über unseren WYSIWYG-Editor angepasst werden.

<chamhtml>Ein HTML-Element</chamhtml>

Bild-Element

Bild-Elemente erlauben das Hochladen und Einbinden eigener Bilder über den Editor.

<chamimg><img class="cham_img" width="100"></chamimg>
Vergessen Sie auf keinen Fall die Klasse "cham_img" bei Verwendung von Bild-Elementen anzugeben. Anderenfalls kann es zu Problemen im späteren Newsletter kommen. Dort tauchen dann vermehrt die beiden Zeichen IE auf.
Warning

Editierbare und nicht editierbare Bereiche

Öffnen Sie die Datei quellcode.txt mit einem Text-Editor. Diese Datei bildet das Grundgerüst des Templates. Sie finden dort gewöhnlichen HTML-Code, sowie die oben beschriebenen Elemente.
Info

Bereiche, die NICHT über den Editor editierbar sein sollen

Bereiche, die fix ins Template integriert und nicht über unseren Editor veränderbar sein sollen, werden direkt als HTML-Code eingetragen. Beispielsweise finden Sie in Zeile 15 ein Bild, das fester Bestandteil des Templates ist.

Bereiche, die über den Editor editierbar sein sollen

In den Zeilen 21 und 22 hingegen finden Sie ein Text-Element umschlossenen mit dem Platzhalter chamtext. Das Design dieses Text-Elements wird vorab in der TD definiert und kann später nicht über den Editor geändert werden. Innerhalb der Platzhalter finden Sie einen bereitsvorbelegten Text. Dieser kann später im Editor angeklickt und beliebig geändert werden. Selbstverständlich können Sie an beliebigen Stellen auch HTML- und Bild-Elemente einfügen, die dann ebenfalls über den Editor geändert werden können.

Das Prinzip Module

Module sind nichts anderes als HTML-Schnipsel, die später vom Benutzer dynamisch über den Editor an bestimmten Stellen des Templates eingefügt werden können. Module können also einen ganz gewöhnlichen HTML-Quellcode enthalten und optional ein oder mehrere der obigen Elemente. Sie können in Ihrem Benutzerkonto beliebig viele unterschiedliche Module erstellen.

Platzierung von Modulen im Quellcode

Damit der Editor weiß, an welchen Stellen der Benutzer Module einfügen darf, müssen Sie dies im Quellcode wie folgt markieren:

<chammodule>

Verschachtelte Module

Auch verschachtelte Module sind möglich. So können Modulplatzhalter nicht nur im Haupt-Quellcode (quellcode.txt) verbaut werden, sondern auch in den Modulen selbst. Möglich wäre also im Modul Bildergalerie den Modulplatzhalter <chammodule> zu setzen, um dort beispielsweise das Modul Bilder einzufügen. Damit der Editor weiß, dass das Modul Bild nur im Modul Bildergalerie eingefügt werden darf, müssen Sie das Modul wie folgt benennen:

Bildergalerie::Bild

Wie unterscheiden sich Module von Elementen?

Elemente sind Inhalte, die durch den Benutzer im Editor verändert werden können (Text, HTML oder Bild). Ein Modul dagegen ist eine Kombination aus herkömmlichen HTML-Code und dynamisch veränderbaren Inhalten, kann also wahlweise u.a. aus mehreren Elementen bestehen.

Außerdem können Module verschoben werden. Fügt der Benutzer z.B. einmal das Modul Editorial und mehrmals das Modul Arikel in einen Modulplatzhalter, kann er anschließend deren Reihenfolge beliebig per Drag & Drop verändern.

Bilddateien hinterlegen und verwenden

Um feste Bilder zu hinterlegen (kein Bildelement), können Sie Ihren eigenen Server verwenden und ganz einfach entsprechend verlinken z.B. durch http://www.ihredomain.com/bilder/bild1.jpg. Gerne übernehmen wir das Hosting der Bilder auch für Sie. Schicken Sie uns in diesem Fall eine kurze Nachricht mit den Bildern und der ID des Templates an support@sendcockpit.com Bitte binden Sie in diesem Fall die Bilder wie folgt ein:

<img src="§§tpl_img_path§§/image.jpg">

Formatierung von Hyperlinks

CSS-Angaben müssen immer inline definiert werden. Im Header definierte Formatierungen werden durch einige Freemailer ignoriert. Daher gibt es bei der Definition des Templates das Textfeld Hyperlink-Style. Alle CSS-Angaben, die an dieser Stelle gemacht werden, werden automatisch für jedes a-Tag im Mailing übernommen. Beispiel:

color:#a93f28; text-decoration:none;

Verwendung von Platzhaltern

Sie können verschiedene Platzhalter im Template verwenden. Siehe Hauptartikel.

Sonstiges

Kann ich Elemente mit Inhalten vorbelegen?

Das ist möglich. Für die Text- & HTML-Elemente finden Sie Beispiele oben im Abschnitt Die drei Elemente. Für das Bild-Element tragen Sie einfach für das Attribut src den entsprechenden Pfad zur Bilddatei ein.

Warum werden meine Angaben im Head ignoriert?

Alles was in Ihrem Template über <body> steht, wird beim ersten Speichern im Mailing-Editor durch einen Standard ersetzt, der die gleichbleibende Darstellung und Kodierung (UTF-8) des Mailings gewährleistet. Unabhängig davon werden CSS-Angaben, die nicht inline geschrieben werden, durch einige Freemailer ignoriert.

Vorschau-Bild & Vorschau-URL

Templateauswahl

Allgemeines

Wenn Sie in unserer Software ein neues Mailing erstellen, können Sie im ersten Schritt das gewünschte Template auswählen. Alle verfügbaren Templates werden mit einem Screenshot angezeigt. Für jedes Template gibt es zusätzlich optional eine Vorschau-Funktion.

Vorschau-Bild

Sie können das Vorschau-Bild für Ihr Mailing selbst hochladen. Dies erfolgt über den Reiter Vorschau. Wird kein Vorschau-Bild hinterlegt, erscheint bei der Templateauswahl ein neutrales Bild. Ihr eigens Bild muss die Abmessungen 250 X 280 Pixel (Breite X Höhe) haben und im JPG- oder GIF-Format gespeichert werden.

Vorschau-URL

Sie können für jedes Template eine Vorschau-URL angeben. Die URL kann über den Reiter Vorschau hinterlegt werden. Klickt man bei der Templateauswahl auf den Vorschau-Button, öffnet sich die Vorschau in einem neuen Fenster. Wird keine URL hinterlegt, erscheint bei der Templateauswahl kein Vorschau-Button.

Es steht Ihnen frei, welche URL Sie für die Vorschau angeben. Wir empfehlen jedoch folgende Vorgehensweise:

  1. Erstellen Sie ein Beispiel-Mailing mit Ihrem Template.
  2. Dieses Mailing sollte bestenfalls alle verfügbaren Module enthalten.
  3. Versenden Sie dieses Mailing einmalig (z.B. an sich selbst).
  4. Unsere Software generiert automatisch eine URL zum versendeten Mailing.
  5. Die URL finden Sie in der Detailansicht des versendeten Mailings unter dem Reiter URL.
  6. Verwenden Sie diese URL als Vorschau-URL.

Testversendungen

Führen Sie unbedingt umfangreiche Testversendungen an alle wichtigen Desktop- und Webmail-Clients durch, um eine optimale Darstellung Ihres E-Mailings sicherzustellen.
Warning

Quellcode eines bereits erstellten Mailings editieren

Manchmal kann es vorkommen, dass Sie bereits ein Mailing mit Ihrem neuen Template erstellt haben und danach noch kleine Anpassungen am Template vornehmen wollen. Änderungen am Template, werden dann nicht im bereits erstellten Mailing berücksichtigt. Damit Sie nun das Mailing nicht komplett neu erstellen müssen, können Sie den Quellcode des Mailings direkt editieren.

  1. Wählen Sie das entsprechende Mailing aus
  2. Klicken Sie auf E-Mailing editieren
  3. Im Editor finden Sie nun ganz unten rechts einen Link Quellcode editieren

Siehe auch

Kategorien
Developer
In anderen Sprachen