Wenn du Code zu deinen Emails hinzufügen möchtest, der im Email Builder nicht verfügbar ist, kannst du dafür den Code-Modus verwenden und so den MJML-Code direkt bearbeiten. Damit stehen dir alle Funktionalitäten von MJML uneingeschränkt zur Verfügung.

In diesem Tutorial lernst du:

Grundlegendes zur Codierung von MJML

Warum wir MJML statt HTML verwenden, erfährst du auf dieser Seite:

Formate für Emails: MJML vs. HTML

Kurz zusammengefasst: MJML ist eine Open Source Markup-Sprache, die dafür entwickelt wurde, Inhalte in allen Email-Clients richtig (und das heisst vor allem auch responsiv) darzustellen. MJML wird dabei nur im Hintergrund verwendet: Vor dem Versenden der Email wird sie in responsives HTML umgesetzt.

MJML nimmt dir damit viel Arbeit ab, denn die MJML-Komponenten sind Layout-Container, die eine einfache Codierung zulassen, die nachträglich automatisch in ein komplexes HTML-Layout übersetzt werden. Wie das MJML-Layout grundsätzlich aufgebaut ist, lernst du in unserem Email-Editor-Tutorial.

Wenn du auf der Code-Ebene mit MJML arbeiten möchtest, kannst du die offizielle MJML-Dokumentation nutzen, um dich über die möglichen Komponenten und deren Attribute zu informieren. Einige der wichtigsten MJML-Komponenten sind:

<aside> 💡 Wichtig ist noch: MJML beinhaltet auch HTML-Code, und zwar innerhalb des MJML-Text-Elements <mj-text>. Innerhalb von <mj-text> ist jedes HTML-Element mit allen passenden Attributen möglich. Wenn du dafür Ressourcen benötigst, findest du hier eine HTML-Dokumentation.

</aside>

Passe deine Email im Code-Modus an