Skip to content
mailblocks

Einbettbarer E‑Mail-EditorJede E‑Mail ist ein Stapel aus Blöcken.

Mailblocks bringt mit einem einzigen Script-Tag einen Drag-and-drop-E‑Mail-Editor in Ihr Produkt. Ihre Nutzer gestalten responsive E‑Mails, Ihre App erhält sauberes HTML und MJML. Und niemand muss sich je wieder mit Outlook herumschlagen.

Kostenlos testenLive-Editor ausprobieren

14 Tage kostenlos, ohne Kreditkarte. Läuft ab der ersten Minute auf localhost.

  • Bild
  • Überschrift
  • Spalten
  • Button
  • Trennlinie
  • HTML

Block-Bibliothek

Jeder Block, nach dem Ihre Nutzer greifen.

Jeder Block wird als MJML exportiert und sieht in Gmail, Outlook und Apple Mail gleich aus. Ohne jede Konfiguration.

  • Überschrift
  • Text
  • Bild
  • Button
  • Spalten
  • Wrapper
  • Trennlinie
  • Abstand
  • Social Media
  • Tabelle
  • HTML
  • KI-Entwurf

Integration

In drei Schritten ist der Editor in Ihrer App.

  1. 1

    Skript einbinden

    Ein Script-Tag, wenige Kilobyte. Der Editor selbst wird in einem Sandbox-iframe von Mailblocks geladen.

  2. 2

    Editor mounten

    Geben Sie ein Element, Ihren Public Key und die ID der bearbeitenden Person an. Mehr ist nicht einzurichten.

  3. 3

    Ergebnis speichern

    Beim Speichern erhalten Sie das HTML für den Versand und ein Design-JSON zum Ablegen. Laden Sie das JSON jederzeit wieder, um weiterzuarbeiten.

<div id="editor" style="height: 720px"></div>
<script src="https://customer.mailblocks.app/sdk/v1.js"></script>
<script>
  const editor = Mailblocks.mount('#editor', {
    publicKey: 'pk_live_…',
    user: { id: currentUser.id },
    onSave: ({ html, design }) => saveTemplate(html, design),
  });
</script>

Für alle, die damit arbeiten

Ihre Nutzer bekommen einen echten Editor, kein Formular mit Vorschau.

Ziehen, ablegen, fertig

Abschnitte, Spalten und Blöcke rasten an ihrem Platz ein. Rückgängig, Wiederholen und Tastenkürzel funktionieren wie gewohnt.

Von Haus aus responsiv

Vorschau für Desktop und Smartphone, Blöcke je Gerät ausblenden. Das Ergebnis funktioniert in allen gängigen E‑Mail-Programmen.

Dark Mode, bewusst gestaltet

Jede Farbe kann eine dunkle Variante bekommen. Mailblocks schreibt die Media Queries, damit die E‑Mail auch in dunklen Postfächern stimmig aussieht.

Merge-Tags

Stellen Sie eigene Platzhalter bereit, gruppiert und beschriftet. Die Syntax bestimmen Sie: Handlebars, Liquid oder jede andere.

Bildbibliothek

Uploads, Ordner, Suche und Import per URL. Bei uns gehostet oder mit Ihrem eigenen Speicher verbunden.

Mit einer vorhandenen Vorlage starten

Eine MJML-Vorlage als Tags oder JSON einfügen und als bearbeitbare Blöcke weitermachen, statt bei null anzufangen.

KI-Vorlagengenerator

Der erste Entwurf steht, sobald er beschrieben ist.

Ihre Nutzer bauen Schritt für Schritt einen Satz zusammen und erhalten eine vollständige, bearbeitbare Vorlage aus echten Blöcken. Kein Screenshot, keine HTML-Wüste.

Erstelle einen Newsletter für Northwind Coffee zum Thema Herbströstungen, in freundlichem Ton und mit dem Aufruf „Jetzt bestellen“.

  • Acht geführte Schritte, bei Bedarf auch Freitext
  • Ergebnis in MJML, importiert als bearbeitbare Blöcke
  • Monatliches Kontingent je Tarif, gezählt auf unserer Seite
  • Prompts laufen auf unseren Servern und gelangen nie in den Browser
So funktioniert der KI-Generator →

White-Label

Der Editor trägt Ihre Farben, nicht unsere.

Übergeben Sie ein Theme, und jedes Panel, jeder Button und jeder Dialog übernimmt es: Akzentfarbe, Flächen, Rahmen, Schriften, Eckenradius, hell und dunkel. In bezahlten Tarifen entfällt das Mailblocks-Badge.

Lizenzierung

Lizenziert für Ihre Domains. Überall sonst nutzlos.

Sie laden den Editor nie herunter, also kann auch nichts nach außen gelangen. Er läuft in einem Frame, der nur auf den Domains Ihrer Lizenz angezeigt wird.

  • app.yourproduct.com Lizenziert
  • staging.yourproduct.com Lizenziert
  • localhost:5173 Lokal · immer erlaubt
  • copy-of-your-app.net Nicht lizenziert · bleibt leer

frame-ancestors · signed · watermarked

An Ihre Domains gebunden

Der Browser selbst verweigert die Anzeige auf jeder Website, die nicht in Ihrer Lizenz steht.

Nichts wird ausgeliefert

Ihr Bundle enthält nur einen winzigen Loader. Der Editor-Code bleibt auf unseren Servern und trägt pro Lizenz ein eigenes Wasserzeichen.

Signierte Nutzer

Signieren Sie Nutzer-IDs optional auf Ihrem Server, damit niemand in Ihrem Namen Sitzungen öffnen kann.

Faire Abrechnung

Sie zahlen für monatlich aktive Editor-Nutzer, nicht für Seitenaufrufe. Lokale Entwicklung ist immer kostenlos.

Zu den Sicherheitshinweisen →

Preise

Sie zahlen für alle, die den Editor öffnen.

Jeder Tarif enthält den vollen Editor, den KI-Generator und die Bildbibliothek. Starten Sie mit einer 14-tägigen Testphase.

Startup

Für ein erstes Produkt, in dem Ihre Nutzer E‑Mails selbst gestalten.

49 $pro Monat

  • 50 aktive Editor-Nutzer / Monat
  • 1 Produktiv-Domain
  • 150 KI-Generierungen / Monat
  • 5 GB Bildspeicher
Mit Startup starten

Growth

Empfohlen

Für Produkte mit mehreren Apps, Mandanten oder Umgebungen.

129 $pro Monat

  • 250 aktive Editor-Nutzer / Monat
  • 3 Produktiv-Domains
  • 1.000 KI-Generierungen / Monat
  • 25 GB Bildspeicher
Mit Growth starten

Business

Für Plattformen, auf denen E‑Mail-Design zum Arbeitsalltag gehört.

299 $pro Monat

  • 1.000 aktive Editor-Nutzer / Monat
  • 10 Produktiv-Domains
  • 5.000 KI-Generierungen / Monat
  • 100 GB Bildspeicher
Mit Business starten

Enterprise

Individuelle Kontingente, Verträge und Support für große Plattformen.

Auf Anfrage

  • 10.000 aktive Editor-Nutzer / Monat
  • 50 Produktiv-Domains
  • 25.000 KI-Generierungen / Monat
  • 100 GB Bildspeicher
Kontakt aufnehmen
Tarife vergleichen →

Was Entwickler zuerst fragen

Muss ich mein Backend anpassen?

Nein. Der Editor liefert HTML und Design-JSON direkt im Browser. Speichern Sie beides dort, wo Sie Inhalte ohnehin ablegen. Das Signieren von Nutzer-IDs ist optional und braucht eine Zeile Code auf Ihrem Server.

Mit welchen Frameworks funktioniert das?

Mit allen. Das SDK ist reines JavaScript ohne Abhängigkeiten. Es läuft daher in React, Vue, Svelte, Angular, Laravel Blade, Rails oder auf einer statischen Seite.

Was genau ist ein aktiver Nutzer?

Eine eindeutige Nutzer-ID, die den Editor innerhalb eines Kalendermonats öffnet. Wer fünfzigmal bearbeitet, zählt trotzdem nur einmal. Sitzungen auf localhost und .test-Domains werden nie gezählt.

Kann ich den Editor selbst hosten?

Der Editor läuft bei Mailblocks, damit er lizenziert und aktuell bleibt. Ihre Designs, Ihr HTML und auf Wunsch auch Ihre Bilder bleiben auf Ihrer eigenen Infrastruktur.

Bauen Sie noch diese Woche einen richtigen E‑Mail-Editor in Ihr Produkt ein.

Testphase starten, drei Zeilen einfügen und die erste E‑Mail versenden, die Ihre Nutzer selbst gestaltet haben.

Kostenlos testenZur Dokumentation