Hol dir Hilfe von Experten
Von Schulungen bis hin zum Full-Service-Marketing: Unsere Partnercommunity kann dir dabei helfen, deine Ideen in die Tat umzusetzen.
Code-Inhaltsblöcke im neuen Builder verwenden
Verwende einen Code-Block, um HTML-Code direkt in deine E-Mail einzufügen. Dieser Block ist nützlich, wenn du mehr Kontrolle über dein Design benötigst als unsere anderen Inhaltsblöcke bieten.
In diesem Artikel erfährst du, wie du Code-Inhaltsblöcke im neuen E-Mail-Builder verwendest.
Vor dem Start
Bevor du mit diesem Vorgang beginnst, solltest du einige Punkte beachten.
- Dieser Artikel erklärt, wie du die Code-Inhaltsblöcke für den neuen Builder verwendest. Weitere Informationen zu Code-Inhaltsblöcken im klassischen Builder findest du unter Code-Inhaltsblöcke im klassischen Builder verwenden.
- Dies ist ein erweitertes Feature und somit für Benutzer empfohlen, die Vorkenntnisse in benutzerdefinierter Programmierung mitbringen. Wende dich an deinen Entwickler oder beauftrage einen Mailchimp-Experten, falls du Hilfe benötigst.
- Wir empfehlen, die Funktion Vorschau und Test bei deiner E-Mail zu verwenden. Damit erhältst du einen Eindruck davon, wie deine Kampagne bei Desktop- und Mobilgeräten aussieht.
- Die Überschrift- und Absatz-Inhaltsblöcke haben auch einen Code-Editor. Weitere Informationen findest du unter Überschrift-Inhaltsblöcke im neuen Builder verwenden und Absatz-Inhaltsblöcke im neuen Builder verwenden.
Hinweis
Im Artikel Über die E-Mail-Builder von Mailchimp erfährst du mehr über die einzelnen E-Mail-Builder und ihre Inhaltsblöcke.
Code-Inhaltsblöcke in deinen E-Mails verwenden
So verwendest du einen Code-Inhaltsblock:
- Klicke auf einen Block Code oder ziehe einen Code -Block von der Seitenleiste aus in dein Layout.
- Tippe deinen Code im Menü Code ein oder füge ihn dort ein.
Codeblock-Tipps
Hier sind einige Tipps dazu, wie du den Codeblock verwenden kannst.
- Verwende kein JavaScript.
Da die meisten E-Mail-Clients JavaScript blockieren, um vor Viren zu schützen, entfernen wir automatisch sämtliches erkennbares JavaScript aus deinem Code. - Verwende kein Textverarbeitungsprogramm zum Erstellen von HTML-Inhalten . Programme wie Microsoft Word oder Publisher können zusätzlichen Gestaltungscode hinzufügen, der deine Kampagne verfälscht. Wir empfehlen, den HTML-Code in einen einfachen Texteditor zu schreiben und anschließend den Code in den Codeblock einzufügen.
- Verwende eingebettete oder Inline-CSS.
In den meisten Fällen funktionieren externe CSS-Dateien nicht in HTML-E-Mails. Du kannst eingebettetes CSS oder Inline-CSS zu einem Codeblock hinzufügen, vorzugsweise über dem Textbereich deines Layouts. Für die besten Ergebnisse empfehlen wir, Inline-CSS zu verwenden. - Nutze Medienabfragen, um ein responsives Design zu gewährleisten.
Wenn du möchtest, dass dein Code auch für Mobilgeräte optimiert ist, musst du Medienabfragen einfügen. Eine Medienabfrage ist eine CSS-Komponente, mit der deine Inhalte sich an verschiedene Geräte anpassen können. Weitere Informationen findest du in der W3C-Empfehlung für Medienabfragen und im Leitfaden von Litmus zur Erstellung einer komplett neuen responsiven E-Mail. - Verwende das Content-Studio oder absolute Pfade für Bilder und Dateien . Mit unserem Content-Studio kannst du Dateien und Bilder für deine Kampagne hosten. Kopiere die Datei-URL aus dem Content Studio und füge sie in deinen Code im Codeblock ein. Wenn du deine Bilder auf deinem eigenen Server hosten möchtest, verwende absolute Pfade.
Unterstützte HTML-Elemente und Attribute
Wir bereinigen automatisch alle Elemente, die im Code-Editor nicht unterstützt werden.
| Element | Akzeptiertes Attribut |
|---|---|
<span> | `span` |
<code> | |
<sub> | `id` , `class` und `style` |
<sup> | `id` , `class` und `style` |
<del> | `id` , `class` , `title` und `style` |
<ins> | |
<small> | `id` , `class` und `style` |
<font> konvertiert zu <span> | `class` , `id` , `color` , `size` , `face` und `style` |
<a> | `href` , `title` , `target` und `style` |
<em> oder <i> | |
<strong> oder <b> | |
<p> | `id` , `class` und `style` |
<img /> | `class` , `id` , `src` , `alt` , `title` , `style` , `width` und `height` |
<table> | `class` , `id` , `src` , `alt` , `title` , `style` , `width` und `height` |
<tr> | `class` , `id` , `align` , `valignundstyle`` |
<th> | `class` , `id` , `colspan` , `rowspan` , `style` , `width` und `height` |
<td> | `class` , `id` , `colspan` , `rowspan` , `valign` , `style` , `width` und `height` |
<h1> | `id` , `class` und `style` |
<h2> | `id` , `class` und `style` |
<h3> | `id` , `class` und `style` |
<h4> | `id` , `class` und `style` |
<br> | |
<ol> | |
<ul> | |
<li> | |
<dl> | `id` , `class` und `style` |
<dt> | `id` , `class` und `style` |
<dd> | `id` , `class` und `style` |
<pre> | |
<link /> | `href` , `rel` , `type` und `media` |
<style> | `media` und `type` |
<u> konvertiert zu <span> | |
<s> konvertiert zu <span> |
Dynamische Inhalte aktivieren
Du kannst jeden Inhaltsblock in dynamische Inhalte umwandeln, um deinen Empfängern anhand von dir festgelegter Bedingungen unterschiedliche Inhalte anzuzeigen. So kannst du unterschiedliche Kontakttypen gleichzeitig mit einer einzigen E-Mail ansprechen.
Weitere Informationen über dynamische Inhalte und wie du sie in deinem Inhaltsblock aktivieren kannst, findest du im Artikel Informationen zu dynamischen Inhalten.
Technischer Support
Hast du eine Frage?
Zahlende Nutzer können sich anmelden, um E-Mail- oder Chat-Support zu erhalten.