Editor-Blöcke im Drag-and-Drop-Editor
Editor-Blöcke sind die Kacheln, die Sie im Drag-and-Drop-Editor in Zeilen und Spalten ziehen.
Wählen Sie den Editor aus, den Sie verwenden:
E-Mail-Editor-Blöcke
Editor-Blöcke befinden sich im Bereich Content für E-Mail-Nachrichten. Ziehen Sie einen Block in eine Spalte im Drag-and-Drop-Editor; er passt sich automatisch an die Spaltenbreite an.
Weitere Informationen zum Erstellen von E-Mails im Drag-and-Drop-Editor finden Sie unter E-Mail per Drag-and-Drop erstellen und Weitere Anpassungen in diesem Artikel.

Sie können auch angepasste Attribute zu jeder URL innerhalb der Editor-Blöcke Image, Button oder Text hinzufügen.
Title
Fügt Text für Überschriften innerhalb der E-Mail hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| Title | Wählt den Überschriftenstil aus. |
| Font family | Der Schriftstil für Ihren Titel. |
| Font weight | Die allgemeine Fettung der Schrift. |
| Font size | Bestimmt die Größe Ihres Textes. |
| Text color | Ändert die Farbe des Titels. |
| Link color | Ändert die Farbe des Links. |
| Align | Verschiebt den Titel nach links, zentriert oder rechts. |
| Line height | Ändert den Abstand zwischen Textzeilen. |
| Letter spacing | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Text direction | Standard ist links nach rechts, kann aber auf rechts nach links geändert werden. |
Paragraph
Gibt Text in die Nachricht ein. Eine Symbolleiste hilft bei der Schrift- und Textbearbeitung.
| Eigenschaft | Beschreibung |
|---|---|
| Font family | Der Schriftstil für Ihren Absatztext. |
| Font weight | Die allgemeine Fettung der Schrift. |
| Font size | Bestimmt die Größe Ihres Textes. |
| Text color | Ändert die Farbe des Textes. |
| Link color | Ändert die Farbe des Links. |
| Align | Verschiebt den Text nach links, zentriert oder rechts. |
| Paragraph spacing | Ändert den Abstand zwischen Absätzen. |
| Line height | Ändert den Abstand zwischen Textzeilen. |
| Letter spacing | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Text direction | Standard ist links nach rechts, kann aber auf rechts nach links geändert werden. |
List
Fügt eine Aufzählungsliste hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| List type | Der Typ der Liste. Kann entweder Aufzählung oder Nummerierung sein. |
| List style type | Bestimmt den Stil Ihrer Liste. |
| Start list from | Bestimmt die Startnummer für Ihre Liste. |
| Font family | Der Schriftstil für Ihren Absatztext. |
| Font weight | Die allgemeine Fettung der Schrift. |
| Font size | Bestimmt die Größe Ihres Textes. |
| Text color | Ändert die Farbe des Textes. |
| Link color | Ändert die Farbe des Links. |
| Align | Verschiebt den Text nach links, zentriert oder rechts. |
| List items spacing | Ändert den Abstand zwischen Listenelementen. |
| List items indent | Ändert den Einzug der Listenelemente. |
| Line height | Ändert den Abstand zwischen Textzeilen. |
| Letter spacing | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Text direction | Standard ist links nach rechts, kann aber auf rechts nach links geändert werden. |
Button
Fügt einen Standard-Button hinzu. Über die Eigenschaften können Sie das Styling bearbeiten und das Linkverhalten festlegen.
| Eigenschaft | Beschreibung |
|---|---|
| Button options | Legt verschiedene Button-Optionen fest, wie Schrift, Größe, Breite, Farbe und Padding. |
| Button hover | Der Stil des Buttons, wenn Nutzer:innen mit einer Maus oder einem Trackpad darüber fahren. Umfasst die Hintergrundfarbe, Schriftfarbe und Rahmenstile des Buttons. |
Klickverhalten
| Eigenschaft | Beschreibung |
|---|---|
| Link type | Bestimmt die Aktion beim Klicken auf den Button und legt das entsprechende Protokoll fest. |
| URL | Dynamisch basierend auf dem Linktyp Open web page. |
| Mail to, subject, and body | Für den Linktyp Send email: Legt die Empfänger-E-Mail-Adresse, den Betreff und den Inhalt fest, die in einem E-Mail-Entwurf vorausgefüllt werden, wenn Nutzer:innen den Button auswählen. |
| Tel | Für die Linktypen Make call und Send SMS: Legt die Telefonnummer fest, die Nutzer:innen anrufen oder an die sie eine SMS senden, wenn sie den Button auswählen. |
| Message | Für den Linktyp Send SMS: Legt den Inhalt fest, der in einem SMS-Entwurf vorausgefüllt wird, wenn Nutzer:innen den Button auswählen. |
Divider
Fügt eine durchgezogene, gepunktete oder gestrichelte Linie ein, um beim Abstand zu helfen.
| Eigenschaft | Beschreibung |
|---|---|
| Transparent | Wenn aktiviert, werden die Linien- und Breitenoptionen entfernt. |
| Line | Die verschiedenen Linienformate: gepunktet, gestrichelt oder durchgezogen. Sie können auch die Dicke und Farbe der Trennlinie ändern. |
| Width | Passt die Ausdehnung der Trennlinie in 5er-Schritten an. |
| Align | Verschiebt die Linie nach links, zentriert oder rechts. |
Spacer
Fügt Abstand oder Padding zwischen anderen Blöcken hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| Height | Passt die Höhe des Abstandshalter-Blocks an. Der Standardwert beträgt 60 px. |
Image
Fügt ein Bild aus der Medienbibliothek ein. Für dynamische Bilder (Bilder mit Liquid oder Connected Content) müssen Sie ein Fallback-Bild festlegen, um die automatischen Breiteneinstellungen zu verwenden. Bildspezifikationen finden Sie unter E-Mail-Bildspezifikationen.

Wenn Sie Bilder über Connected-Content oder Liquid einbinden, stellen Sie sicher, dass Ihre Bild-URL mit https:// beginnt. Die Verwendung von http:// führt zum Absturz Ihrer App.
| Eigenschaft | Beschreibung |
|---|---|
| Auto width | Ändert die Breite des Bildes in Pixeln. |
| Align | Legt die Bildausrichtung innerhalb des Blocks auf links, zentriert oder rechts fest. |
| Image with Liquid | Verwenden Sie Liquid-Logik, um dynamisch verschiedene Bilder innerhalb desselben Inhaltsblocks festzulegen. |
| URL | Legen Sie ein Bild über die Adresse fest, unter der es gehostet wird. |
| Alternate text | Eine kurze Beschreibung des Bildes, die Nutzer:innen dieselben Informationen vermittelt, die im Bild gezeigt werden. Unverzichtbar für die Barrierefreiheit mit Screenreadern oder wenn das Bild nicht geladen werden kann. |
| Image with rounded corners | Rendert das Bild mit abgerundeten Ecken. Standardmäßig werden Bilder mit eckigen Ecken gerendert. |
| Action | Löst eine Aktion aus, wenn Nutzer:innen auf das Bild klicken. |
| Block options | Legt das Padding um den Bildblock fest. |

Für Auto width wählt die automatische Bildgrößenanpassung die beste Größe für das Bild basierend auf einer Kombination aus Bildbreite und verfügbarem Platz im Layout:
- Bilder, die breiter als der verfügbare Platz sind, werden auf 100 % Breite gesetzt und behalten dieses Verhältnis auf Mobilgeräten bei, wobei die gesamte Displaybreite des Geräts genutzt wird.
- Bilder, die kleiner als der verfügbare Platz sind, verwenden die natürliche Größe des Bildes, um Verzerrungseffekte oder unscharfe Bilder zu vermeiden.
Gmail-Download-Button-Verhalten
Gmail fügt automatisch einen Download-Button an Bilder an, denen kein Hyperlink (href) zugeordnet ist. Wenn das Seitenverhältnis des Bildes jedoch 299 x 524 px oder kleiner ist, zeigt Gmail den Download-Button nicht an.
Um zu verhindern, dass der Download-Button bei größeren Bildern erscheint, können Sie den „#“-Link-Workaround anwenden:
- Wählen Sie den Image-Block aus.
- Gehen Sie im Panel Block Options zum Abschnitt Link.
- Setzen Sie den Link type auf Open web page.
- Geben Sie ein Rautezeichen (
#) in das URL-Eingabefeld ein.
Das Hinzufügen dieses Links verhindert, dass Gmail den Download-Button anzeigt, ohne die Nutzererfahrung zu beeinträchtigen.
Video
Erstellt einen Link zu Videoinhalten. Nur YouTube und Vimeo werden unterstützt.
| Eigenschaft | Beschreibung |
|---|---|
| URL | Die URL für das Video. |
| Title | Wird automatisch aus den Video-Metadaten generiert oder kann angepasst werden. |
| Play icon style | Umfasst verschiedene Optionen für den Play-Button oben auf einem Videobild. |
| Play icon color | Option zur Auswahl von Light oder Dark für den Play-Button. |
| Play icon size | Wählen Sie die Pixelgröße für den Play-Button. Vordefinierter Bereich von 50 px bis 80 px (in 5-px-Schritten). |

Videos, die auf Vimeo gehostet werden, funktionieren nur, wenn sie auf öffentlich gesetzt sind. Alle anderen Sicherheitseinstellungen in Vimeo (z. B. „Von Vimeo.com ausblenden“) erzeugen ein anderes Linkformat, das von diesem Content Block nicht unterstützt wird. Diese Arten von Links werden vom Builder verändert, was Braze daran hindert, ein Vorschaubild zu generieren.
Social
Fügt Social-Media-Plattform-Icons ein. Sie können benutzerdefinierte Bilder für markenspezifische Icons hochladen.
| Eigenschaft | Beschreibung |
|---|---|
| Select icon collection | Legt den Stil Ihrer Icon-Sammlung fest. |
| Configure icon collection | Legt die URL für jedes Social-Icon fest. Enthält den Umschalter More options zum Bearbeiten des Titels und Alternativtexts. |
| Align | Verschiebt das Social-Icon nach links, zentriert oder rechts. |
| Icon spacing | Bestimmt den Abstand zwischen den einzelnen Social-Icons. |
Icons
Fügt ein Icon ein. Sie können benutzerdefinierte Bilder hochladen. Braze verwendet ein übergroßes Platzhalter-Icon, bis Sie ein Bild hochladen.
| Eigenschaft | Beschreibung |
|---|---|
| Font family | Der Schriftstil für Ihren Absatztext. |
| Font weight | Die allgemeine Fettung der Schrift. |
| Font size | Bestimmt die Größe Ihres Textes. |
| Text color | Ändert die Farbe des Titels. |
| Link color | Ändert die Farbe des Links. |
| Align | Verschiebt das Icon nach links, zentriert oder rechts. |
| Letter spacing | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Icon size | Bestimmt die Größe Ihres Icons. |
| Icon spacing | Ändert den Abstand des Icons. |
| Icon padding | Ändert das Padding des Icons. |
HTML
Fügt rohes HTML ein. Empfohlen für Liquid, wie Connected Content oder bedingte Anweisungen.
| Eigenschaft | Beschreibung |
|---|---|
| HTML | Fügen Sie rohes HTML hinzu oder bearbeiten Sie es, einschließlich Liquid für Personalisierung oder bedingte Logik. |
Menu
Erstellt ein flexibles Menü für die Nachricht, die Sie gestalten.
| Eigenschaft | Beschreibung |
|---|---|
| Configure menu items | Fügt ein Menüelement hinzu. |
| Font family | Der Schriftstil für das Menü. |
| Font size | Die Größe Ihres Menüs. |
| Text color | Ändert die Farbe des Menüs. |
| Link color | Ändert die Farbe des Menütexts. |
| Align | Verschiebt das Menü nach links, zentriert oder rechts. |
| Letter spacing | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Layout | Bestimmt das Layout als horizontal oder vertikal. |
| Separator | Fügt Zeichen zwischen den Menüoptionen hinzu. |
| Mobile menu | Enthält Optionen zum Ändern der Icon-Größe, Farbe und des Icon-Typs bei Anzeige auf einem Mobilgerät. |
| Item padding | Ändert das Padding über den +- oder --Button oder durch Eingabe einer bestimmten Zahl. |
| All sides | Legt eine einheitliche Padding-Zahl fest, wenn das Elementpadding deaktiviert ist. |
Product
Rendert Produktzeilen aus einem Produktkatalog, entweder als statische Artikel aus einer Katalogauswahl (bis zu 12) oder als dynamische Produkte, die durch einen Canvas-E-Commerce-Trigger gesteuert werden (bis zu 24).
| Eigenschaft | Beschreibung |
|---|---|
| Content type | Legt fest, ob Produkte aus einer festen Katalog-Auswahl (Static, bis zu 12 Produkte) oder aus einem Canvas-E-Commerce-Empfehlungstrigger (Dynamic, bis zu 24 Produkte) stammen. Dynamic ist nur in Canvas-Nachrichtenschritten verfügbar. |
| Catalog | Wählt aus, welcher Produktkatalog die Produktdaten und Feldzuordnungen liefert. |
| Selection | (Nur Static) Wählt aus, welcher gefilterte Satz im Katalog bestimmt, welche Produkte angezeigt werden. |
| Show source details | Schaltet Hilfetext um, der den zugrunde liegenden Katalog oder das Ereignisfeld zeigt, das jedem Produktfeld zugeordnet ist. |
| Variant image | Zeigt oder blendet das Variantenbild für jede Produktkachel ein oder aus. |
| Product title | Zeigt oder blendet den Produkttitel für jede Kachel ein oder aus. |
| Price | Zeigt oder blendet den Produktpreis ein oder aus. |
| Button for product URL | Zeigt oder blendet einen Call-to-Action-Button ein oder aus, der zur Produkt-URL verlinkt. |
| Quantity | (Dynamic, nur Canvas, wenn der Einstiegstrigger kein Produktansichtsereignis ist) Zeigt oder blendet die Produktmenge aus dem Triggerereignis ein oder aus. |
| Product orientation | Legt die Bildposition innerhalb jeder Kachel fest: Image left, Image center oder Image right. |
| Alignment | Legt die horizontale Ausrichtung des Inhalts innerhalb jeder Kachel fest. |
| Max products per row | Legt fest, wie viele Produkte pro Zeile angezeigt werden: 1, 2 oder 3 (3 ist nur verfügbar, wenn die Ausrichtung Image center ist). |
| Product spacing | Legt den Abstand zwischen Produkten fest: Auto oder Custom. |
| Custom spacing | (Wenn Custom ausgewählt ist) Legt den Abstand in Pixeln zwischen Produkten fest. |
Personalisierung
Sie können Ihre E-Mail mithilfe von Liquid oder Connected Content personalisieren.
- Liquid: Wählen Sie unter Content > Personalization ein Attribut aus, kopieren Sie das Snippet und fügen Sie es in einen HTML-Block ein. Einfache Liquid-Snippets funktionieren zwar möglicherweise in Title-, Paragraph- und List-Blöcken, aber die Platzierung von Liquid in diesen Blöcken kann zu unerwartetem Verhalten und Layoutproblemen führen. Um Probleme zu vermeiden, verwenden Sie HTML-Blöcke für jegliche Liquid-Logik. Beachten Sie, dass Liquid in Image-Blöcken oder in Button-URL-Feldern nicht unterstützt wird.
- Connected Content: Fügen Sie einen HTML-Block hinzu und platzieren Sie Ihren
{% connected_content %}-Aufruf dort.
Landing-Page-Editor-Blöcke
Editor-Blöcke für Landing-Pages befinden sich im Bereich Build des Drag-and-Drop-Editors unter Rows und Blockkategorien. Ziehen Sie einen Block in eine Zeilenspalte; er passt sich automatisch an die Spaltenbreite an. Wählen Sie einen Block aus, um seine Einstellungen im rechten Eigenschaftenpanel zu bearbeiten.
Weitere Informationen zum Erstellen und Veröffentlichen von Landing-Pages finden Sie unter Landing-Pages erstellen.
Titel und Absatz
Fügt Überschriften- oder Fließtext hinzu. Nützlich zum Strukturieren von Abschnitten und zur Verbesserung der Lesbarkeit.
| Eigenschaft | Beschreibung |
|---|---|
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Dicke des Textes. |
| Schriftgröße | Bestimmt die Größe des Textes. |
| Zeilenhöhe | Ändert den Abstand zwischen den Textzeilen. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Textausrichtung | Verschiebt den Text, sodass er linksbündig, zentriert, rechtsbündig oder im Blocksatz ausgerichtet wird. |
| Textfarbe | Ändert die Farbe des Textes. |
Button
Fügt ein klickbares Element für Aktionen wie das Öffnen eines Links oder das Absenden eines Formulars hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| Button-Breite | Ändert die Breite des Buttons auf automatisch oder manuell. |
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Dicke des Textes. |
| Schriftgröße | Bestimmt die Größe des Textes. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Button-Ausrichtung | Verschiebt den Button nach links, zentriert oder rechts. |
| Button-Textfarbe | Ändert die Farbe des Textes auf dem Button. |
| Hintergrundfarbe | Ändert die Hintergrundfarbe des Buttons. |
| Rahmenstil | Bestimmt den Stil des Button-Rahmens. |
| Rahmenradius | Bestimmt, wie abgerundet die Ecken sind. |
Klickverhalten
| Aktion | Beschreibung |
|---|---|
| Formular senden, wenn Button angeklickt wird | Sendet das Formular und führt das ausgewählte Klick-Verhalten aus. Deaktivieren Sie diese Option, um nur das Klick-Verhalten auszuführen. |
| Separates Verhalten für jede Plattform festlegen | Passt das Verhalten des Buttons für jede Plattform separat an. |
| Klick-Verhalten | Bestimmt die Aktion, wenn Nutzer:innen den Button anklicken, z. B. die Nachricht schließen, eine Internet-URL öffnen, einen Deeplink zu einer bestimmten Seite der App erstellen, zu einer anderen Seite navigieren oder eine Push-Berechtigung anfordern. |
| Angepasste Attribute oder Events protokollieren | Bestimmt, ob das Anklicken des Buttons das Profil der Nutzer:innen mit angepassten Daten aktualisiert. Sie können auch den Bezeichner für das Reporting auswählen. |

Wenn Sie einen Button mit Submit form when button is clicked konfigurieren und eine Web-URL in einem neuen Tab öffnen, blockiert iOS Safari möglicherweise die Navigation. Öffnen Sie die URL nach dem Absenden im selben Tab, wenn Sie Formulare absenden. Weitere Informationen finden Sie unter Landing-Pages erstellen.
Optionsfeld
Fügt eine Liste von Optionen hinzu, aus denen Nutzer:innen eine auswählen können. Verwenden Sie das Eigenschaftenpanel, um die verfügbaren Optionen und das angepasste Attribut zu konfigurieren, das den ausgewählten Wert empfängt. Das Nutzerprofil protokolliert den ausgewählten Wert als angepasstes String-Attribut, wenn das Formular abgesendet wird. Angepasste Attribute mit anderen Datentypen werden nicht im Nutzerprofil gespeichert.
| Eigenschaft | Beschreibung |
|---|---|
| Name des angepassten Attributs | Legt fest, welches angepasste Nutzer:innen-Attribut die ausgewählte Option speichert, wenn das Formular gesendet wird. |
| Gesamtanzahl der Auswahlmöglichkeiten | Die Liste der Optionen; jede Option hat einen Labeltext (was Nutzer:innen sehen) und einen Attributwert (was gespeichert wird). Sie können bis zu 15 Auswahlmöglichkeiten hinzufügen, mindestens jedoch 2. |
| Schriftfamilie | Schriftart für den Text der Optionsgruppe. |
| Schriftstärke | Stärke des Textes (z. B. leicht, normal oder fett). |
| Schriftgröße | Größe des Textes. |
| Zeilenhöhe | Vertikaler Abstand zwischen den Textzeilen. |
| Textfarbe | Farbe des Optionstextes. |
| Zeichenabstand | Horizontaler Abstand zwischen den Zeichen. |
| Ausrichtung | Horizontale Ausrichtung der Auswahlmöglichkeiten innerhalb des Blocks. |
| Akzentfarbe | Farbe der Optionsfeld-Steuerelemente (z. B. der Indikator für den ausgewählten Zustand). |
| Padding | Abstand um den Block herum. |
Bild
Zeigt ein Bild aus einem Upload oder einer externen URL an.

Wenn Sie Bilder über Connected-Content oder Liquid einbinden, stellen Sie sicher, dass Ihre Bild-URL mit https:// beginnt. Die Verwendung von http:// führt zum Absturz Ihrer App.
| Eigenschaft | Beschreibung |
|---|---|
| URL | Die gehostete Adresse für das Bild. |
| Ausrichtung | Verschiebt das Bild nach links, zentriert oder nach rechts. |
| Hintergrundfarbe | Ändert die Farbe des Bildhintergrunds. |
| Rahmenstil | Bestimmt den Stil des Bildrahmens. |
| Rahmenradius | Bestimmt, wie abgerundet die Ecken des Bildes sind. |
Klickverhalten
| Aktion | Beschreibung |
|---|---|
| Alternativtext | Der geschriebene Text, der anstelle eines Bildes angezeigt wird, wenn das Bild nicht geladen werden kann. Screenreader lesen den Alternativtext vor, um Bilder zu erklären. Verwenden Sie daher eine einfache Sprache, um die wichtigsten Informationen über ein Bild zu vermitteln. |
| Formular senden, wenn auf das Bild geklickt wird | Sendet das Formular ab und führt das ausgewählte Klickverhalten aus. Deaktivieren Sie diese Option, um nur das Klickverhalten auszuführen. |
| Separate Verhaltensweisen für jede Plattform festlegen | Passt das Verhalten des Bildes für jede Plattform separat an. |
| Klickverhalten | Bestimmt die Aktion, wenn Nutzer:innen auf das Bild klicken, z. B. die Nachricht schließen, eine Web-URL öffnen, einen Deeplink zu einer bestimmten Seite der App erstellen, zu einer anderen Seite navigieren oder eine Push-Berechtigung anfordern. |
| Angepasste Attribute oder Ereignisse protokollieren | Bestimmt, ob das Klicken auf das Bild das Profil der Nutzer:innen mit angepassten Daten aktualisiert. Sie können auch den Bezeichner für das Reporting auswählen. |
Link
Fügt einen Hyperlink hinzu, den Nutzer:innen auswählen können, um zu einer URL zu navigieren. Kann in Text eingebettet oder eigenständig sein.
| Eigenschaft | Beschreibung |
|---|---|
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Stärke des Textes. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Textfarbe | Ändert die Farbe des Textes. |
Klickverhalten
| Aktion | Beschreibung |
|---|---|
| URL | Der Hyperlink, zu dem navigiert werden soll. |
| Bezeichner für Berichte | Legt den Bezeichner für die Berichterstellung fest. |
Abstandshalter
Fügt vertikalen Abstand zwischen Elementen hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| Hintergrundfarbe | Ändert die Hintergrundfarbe des SP. |
| Höhe | Ändert die Höhe des SP. Sie können dies auch ändern, indem Sie die Ziehpunkte am SP verwenden. |
Benutzerdefinierter Code
Fügt benutzerdefiniertes HTML, CSS oder JavaScript für erweiterte Anpassungen ein, z. B. Google Tag Manager.
| Eigenschaft | Beschreibung |
|---|---|
| Custom code | Ermöglicht das Hinzufügen, Bearbeiten oder Löschen von HTML, CSS und JavaScript. |
E-Mail-Erfassung
Fügt ein Formularfeld für E-Mail-Adressen hinzu. Beim Absenden wird die Adresse im Braze-Profil der Nutzer:in gespeichert.
| Eigenschaft | Beschreibung |
|---|---|
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Dicke des Textes. |
| Schriftgröße | Bestimmt die Größe des Textes. |
| Zeilenhöhe | Ändert den Abstand zwischen den Textzeilen. |
| Textfarbe | Ändert die Farbe des Textes. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Textausrichtung | Verschiebt den Text, sodass er linksbündig, zentriert, rechtsbündig oder im Blocksatz ausgerichtet ist. |
| Platzhaltertext | Eine Platzhalter-E-Mail-Adresse zur Anzeige. |
Telefonnummernerfassung
Fügt ein Formularfeld für Telefonnummern hinzu. Beim Absenden wird die Nutzer:in für Ihre ausgewählte SMS- oder WhatsApp-Abo-Gruppe angemeldet.
| Eigenschaft | Beschreibung |
|---|---|
| Abo-Gruppe | Die SMS- oder WhatsApp-Abo-Gruppe, bei der die Nutzer:in beim Senden abonniert ist. Enthält eine Option, Telefonnummern aus allen Ländern zu erfassen. |
| Textausrichtung | Verschiebt den Text, sodass er linksbündig, zentriert, rechtsbündig oder im Blocksatz ausgerichtet ist. |
| Platzhaltertext | Eine Platzhalter-Telefonnummer zur Anzeige. |
Eingabefeld
Fügt ein Formularfeld für Standardattribute (z. B. Vor- oder Nachname) oder einen angepassten Attribut-String hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| Erforderliches Eingabefeld | Legt fest, ob das Feld ausgefüllt werden muss, bevor das Formular gesendet werden kann. |
| Maximale Zeichenanzahl | Begrenzt, wie viele Zeichen ein:e Nutzer:in eingeben kann (angepasste String-Attribute sind auf 255 begrenzt). |
| Platzhaltertext | Text, der im Eingabefeld angezeigt wird, bis der/die Nutzer:in etwas eingibt. |
| Attribut | Speichert den übermittelten Wert als Vorname, Nachname oder Angepasstes Attribut im Nutzerprofil. |
| Name des angepassten Attributs | Wählt aus, welches angepasste String-Attribut den übermittelten Wert erhält (verfügbar, wenn Attribut auf Angepasstes Attribut gesetzt ist). |
| Schriftfamilie | Schriftart für den Eingabetext. |
| Schriftstärke | Stärke (z. B. leicht, normal oder fett) des Eingabetexts. |
| Schriftgröße | Größe des Eingabetexts. |
| Zeilenhöhe | Vertikaler Abstand zwischen den Textzeilen. |
| Zeichenabstand | Horizontaler Abstand zwischen den Zeichen. |
| Farbe | Farbe des in das Feld eingegebenen Textes. |
| Textausrichtung | Horizontale Ausrichtung des Eingabetexts innerhalb des Feldes. |
| Padding | Abstand um den Block herum. |
Dropdown
Eine vordefinierte Liste von Elementen; Nutzer:innen wählen eines aus. Sie können Werte angepassten Attribut-Strings zuordnen.
| Eigenschaft | Beschreibung |
|---|---|
| Erforderliches Eingabefeld | Legt fest, ob Nutzer:innen eine Option auswählen müssen, bevor das Formular gesendet werden kann. |
| Platzhaltertext | Text, der im Dropdown angezeigt wird, bis Nutzer:innen eine Option auswählen. |
| Name des angepassten Attributs | Legt fest, welches angepasste Nutzer:innen-Attribut den ausgewählten Wert erhält. |
| Optionen insgesamt | Die Liste der Optionen; jede Option hat ein Optionslabel (was Nutzer:innen sehen) und einen Attributwert (was gespeichert wird). |
| Schriftfamilie | Schriftart für den Dropdown-Text. |
| Schriftstärke | Stärke des Textes (z. B. leicht, normal oder fett). |
| Schriftgröße | Größe des Textes. |
| Zeilenhöhe | Vertikaler Zeilenabstand. |
| Textfarbe | Farbe des Dropdown-Textes. |
| Zeichenabstand | Horizontaler Abstand zwischen den Zeichen. |
| Ausrichtung | Horizontale Ausrichtung des Dropdowns (links oder zentriert). |
| Padding | Abstand um den Block. |
Kontrollkästchen
Wenn aktiviert, wird das boolesche angepasste Attribut des Blocks auf true gesetzt; wenn nicht aktiviert, auf false.
| Eigenschaft | Beschreibung |
|---|---|
| Erforderliches Eingabefeld | Gibt an, ob das Kontrollkästchen aktiviert sein muss, bevor das Formular gesendet werden kann. |
| Name des angepassten Attributs | Wählt aus, welches angepasste boolesche Attribut den Wert true erhält, wenn das Kontrollkästchen aktiviert ist, oder false, wenn es deaktiviert ist. |
| Akzentfarbe | Farbe, die für die Gestaltung des Kontrollkästchens verwendet wird. |
| Padding | Abstand um den Block herum. |
Kontrollkästchengruppe
Nutzer:innen wählen mehrere Optionen aus; Werte werden in einem definierten Array-angepassten Attribut gesetzt oder hinzugefügt.
| Eigenschaft | Beschreibung |
|---|---|
| Erforderliches Eingabefeld | Legt fest, ob Nutzer:innen mindestens die Mindestanzahl an Optionen auswählen müssen, bevor sie das Formular senden können. |
| Mindestauswahl | Mindestanzahl an Optionen, die Nutzer:innen auswählen müssen (wenn das Feld erforderlich ist). |
| Maximalauswahl | Maximale Anzahl an Optionen, die Nutzer:innen auswählen können. |
| Name des angepassten Attributs | Wählt aus, in welches Array-basierte angepasste Attribut die ausgewählten Werte geschrieben werden. |
| Aktion | Legt fest, ob beim Senden Artikel festgelegt (das Array wird ersetzt) oder Artikel hinzugefügt (an das Array angehängt) werden. |
| Gesamtauswahl | Die Liste der Optionen; jede Option hat einen Labeltext (was Nutzer:innen sehen) und einen Attributwert (was gespeichert wird). |
| Schriftfamilie | Schriftart für die Optionslabels. |
| Schriftstärke | Stärke (z. B. leicht, normal oder fett) des Optionslabeltexts. |
| Schriftgröße | Größe des Optionslabeltexts. |
| Zeilenhöhe | Vertikaler Abstand zwischen den Textzeilen. |
| Textfarbe | Farbe des Optionslabeltexts. |
| Zeichenabstand | Horizontaler Abstand zwischen den Zeichen. |
| Ausrichtung | Horizontale Ausrichtung der Gruppe (Anfang oder Zentriert). |
| Akzentfarbe | Farbe der Checkbox-Steuerelemente. |
| Padding | Abstand um den Block herum. |
Langtext
Mehrzeiliges Textfeld für umfrageähnliche Abläufe. Wenn Sie diesen Block nicht sehen, wenden Sie sich an den Braze-Support oder Ihren Braze-Customer-Success-Manager. Dieser Block ist für Standard-Landing-Pages nicht verfügbar.
| Eigenschaft | Beschreibung |
|---|---|
| Erforderliches Eingabefeld | Gibt an, ob das Feld ausgefüllt werden muss, bevor das Formular gesendet werden kann. |
| Mindestanzahl Zeichen | Die Mindestanzahl an Zeichen, die Nutzer:innen eingeben müssen. |
| Höchstanzahl Zeichen | Die Höchstanzahl an Zeichen, die Nutzer:innen eingeben können. |
| Zeichenanzahl ausblenden | Blendet den Live-Zeichenzähler für den Textbereich ein oder aus. |
| Platzhaltertext | Text, der im leeren Textbereich angezeigt wird, bis Nutzer:innen etwas eingeben. |
| Höhe (Textzeilen) | Steuert die Höhe des Textbereichs, gemessen in Zeilen. |
| Schriftfamilie | Schriftart für den Text im Textbereich. |
| Schriftstärke | Stärke des Textes (z. B. leicht, normal oder fett). |
| Schriftgröße | Größe des Textes. |
| Zeilenhöhe | Vertikaler Abstand zwischen den Textzeilen. |
| Textfarbe | Farbe des Textes. |
| Zeichenabstand | Horizontaler Abstand zwischen den Zeichen. |
Wissenswertes
- Video: Der Standard-Composer enthält keinen dedizierten Videoblock. Verwenden Sie Custom code, um bei Bedarf einen Player einzubetten. Weitere Informationen finden Sie unter Landing-Pages.
Banner-Editor-Blöcke
Ziehen Sie im Banner-Composer Zeilen und Blöcke aus dem Bereich Build in die Arbeitsfläche, um Ihre Nachricht zu gestalten. Wählen Sie Styles, um seitenweites Styling anzupassen, oder wählen Sie einen Block oder eine Zeile aus, um deren Eigenschaften im Seitenpanel zu bearbeiten.
Den vollständigen Ablauf zur Banner-Erstellung finden Sie unter Banner erstellen.
Der Banner-Composer bietet dieselben Arten von Layout-Blöcken wie andere Drag-and-Drop-Oberflächen, jedoch nicht den vollständigen Satz an Formularblöcken (z. B. keine Optionsfeld-, Kurztext-, Dropdown- oder Kontrollkästchenblöcke). Sie können Telefonnummernerfassung- und E-Mail-Erfassung-Blöcke hinzufügen; pro Nachricht ist nur ein Telefonnummernerfassungs- und ein E-Mail-Erfassungsblock zulässig.
Titel und Absatz
Fügt Überschriften- oder Fließtext mit Rich-Text-Optionen hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Dicke des Textes. |
| Schriftgröße | Bestimmt die Größe des Textes. |
| Zeilenhöhe | Ändert den Abstand zwischen den Textzeilen. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Textausrichtung | Verschiebt den Text, sodass er linksbündig, zentriert, rechtsbündig oder im Blocksatz ausgerichtet wird. |
| Textfarbe | Ändert die Farbe des Textes. |
Button
Fügt einen klickbaren Button hinzu. Sie können Links und Analytics-Optionen im Eigenschaftenpanel festlegen.
| Eigenschaft | Beschreibung |
|---|---|
| Button-Breite | Ändert die Breite des Buttons auf automatisch oder manuell. |
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Dicke des Textes. |
| Schriftgröße | Bestimmt die Größe des Textes. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Button-Ausrichtung | Verschiebt den Button nach links, zentriert oder rechts. |
| Button-Textfarbe | Ändert die Farbe des Textes auf dem Button. |
| Hintergrundfarbe | Ändert die Hintergrundfarbe des Buttons. |
| Rahmenstil | Bestimmt den Stil des Button-Rahmens. |
| Rahmenradius | Bestimmt, wie abgerundet die Ecken sind. |
Klickverhalten
| Aktion | Beschreibung |
|---|---|
| Formular senden, wenn Button angeklickt wird | Sendet das Formular und führt das ausgewählte Klick-Verhalten aus. Deaktivieren Sie diese Option, um nur das Klick-Verhalten auszuführen. |
| Separates Verhalten für jede Plattform festlegen | Passt das Verhalten des Buttons für jede Plattform separat an. |
| Klick-Verhalten | Bestimmt die Aktion, wenn Nutzer:innen den Button anklicken, z. B. die Nachricht schließen, eine Internet-URL öffnen, einen Deeplink zu einer bestimmten Seite der App erstellen, zu einer anderen Seite navigieren oder eine Push-Berechtigung anfordern. |
| Angepasste Attribute oder Events protokollieren | Bestimmt, ob das Anklicken des Buttons das Profil der Nutzer:innen mit angepassten Daten aktualisiert. Sie können auch den Bezeichner für das Reporting auswählen. |
Weitere Informationen finden Sie unter Klickverhalten definieren im Banner-Artikel.
Bild
Zeigt ein Bild von einer gehosteten URL an. Konfigurieren Sie die Anzeigeoptionen im Eigenschaftenpanel.

Wenn Sie Bilder über Connected-Content oder Liquid einbinden, stellen Sie sicher, dass Ihre Bild-URL mit https:// beginnt. Die Verwendung von http:// führt zum Absturz Ihrer App.
| Eigenschaft | Beschreibung |
|---|---|
| URL | Die gehostete Adresse für das Bild. |
| Ausrichtung | Verschiebt das Bild nach links, zentriert oder nach rechts. |
| Hintergrundfarbe | Ändert die Farbe des Bildhintergrunds. |
| Rahmenstil | Bestimmt den Stil des Bildrahmens. |
| Rahmenradius | Bestimmt, wie abgerundet die Ecken des Bildes sind. |
Klickverhalten
| Aktion | Beschreibung |
|---|---|
| Alternativtext | Der geschriebene Text, der anstelle eines Bildes angezeigt wird, wenn das Bild nicht geladen werden kann. Screenreader lesen den Alternativtext vor, um Bilder zu erklären. Verwenden Sie daher eine einfache Sprache, um die wichtigsten Informationen über ein Bild zu vermitteln. |
| Formular senden, wenn auf das Bild geklickt wird | Sendet das Formular ab und führt das ausgewählte Klickverhalten aus. Deaktivieren Sie diese Option, um nur das Klickverhalten auszuführen. |
| Separate Verhaltensweisen für jede Plattform festlegen | Passt das Verhalten des Bildes für jede Plattform separat an. |
| Klickverhalten | Bestimmt die Aktion, wenn Nutzer:innen auf das Bild klicken, z. B. die Nachricht schließen, eine Web-URL öffnen, einen Deeplink zu einer bestimmten Seite der App erstellen, zu einer anderen Seite navigieren oder eine Push-Berechtigung anfordern. |
| Angepasste Attribute oder Ereignisse protokollieren | Bestimmt, ob das Klicken auf das Bild das Profil der Nutzer:innen mit angepassten Daten aktualisiert. Sie können auch den Bezeichner für das Reporting auswählen. |
Link
Fügt einen Hyperlink ein, den Nutzer:innen auswählen können.
| Eigenschaft | Beschreibung |
|---|---|
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Stärke des Textes. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Textfarbe | Ändert die Farbe des Textes. |
Klickverhalten
| Aktion | Beschreibung |
|---|---|
| URL | Der Hyperlink, zu dem navigiert werden soll. |
| Bezeichner für Berichte | Legt den Bezeichner für die Berichterstellung fest. |
Abstandshalter
Fügt vertikalen Abstand zwischen Blöcken hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| Hintergrundfarbe | Ändert die Hintergrundfarbe des SP. |
| Höhe | Ändert die Höhe des SP. Sie können dies auch ändern, indem Sie die Ziehpunkte am SP verwenden. |
Benutzerdefinierter Code
Fügt benutzerdefiniertes HTML für erweiterte Layouts oder eingebettete Inhalte ein (z. B. Video). Klicks innerhalb von benutzerdefiniertem HTML werden nicht getrackt, es sei denn, Sie rufen brazeBridge.logClick() auf – siehe Benutzerdefinierter Code und JavaScript-Bridge für Banner.
| Eigenschaft | Beschreibung |
|---|---|
| Custom code | Fügen Sie HTML (und zugehörige Assets) für das Banner hinzu oder bearbeiten Sie es. |
Telefonnummernerfassung
Erfasst eine Telefonnummer. Beim Absenden wird die Nutzer:in für Ihre ausgewählte SMS- oder WhatsApp-Abo-Gruppe angemeldet. Nur einer pro Banner.
| Eigenschaft | Beschreibung |
|---|---|
| Abo-Gruppe | Die SMS- oder WhatsApp-Abo-Gruppe, bei der die Nutzer:in beim Senden abonniert ist. Enthält eine Option, Telefonnummern aus allen Ländern zu erfassen. |
| Textausrichtung | Verschiebt den Text, sodass er linksbündig, zentriert, rechtsbündig oder im Blocksatz ausgerichtet ist. |
| Platzhaltertext | Eine Platzhalter-Telefonnummer zur Anzeige. |
E-Mail-Erfassung
Erfasst eine E-Mail-Adresse und fügt sie beim Absenden dem Braze-Profil der Nutzer:in hinzu. Nur einer pro Banner.
| Eigenschaft | Beschreibung |
|---|---|
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Dicke des Textes. |
| Schriftgröße | Bestimmt die Größe des Textes. |
| Zeilenhöhe | Ändert den Abstand zwischen den Textzeilen. |
| Textfarbe | Ändert die Farbe des Textes. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Textausrichtung | Verschiebt den Text, sodass er linksbündig, zentriert, rechtsbündig oder im Blocksatz ausgerichtet ist. |
| Platzhaltertext | Eine Platzhalter-E-Mail-Adresse zur Anzeige. |
Langtext
Mehrzeiliges Textfeld für umfrageähnliche Abläufe. Wenn Sie diesen Block nicht sehen, wenden Sie sich an den Braze-Support oder Ihren Braze-Customer-Success-Manager.
| Eigenschaft | Beschreibung |
|---|---|
| Erforderliches Eingabefeld | Gibt an, ob das Feld ausgefüllt werden muss, bevor das Formular gesendet werden kann. |
| Mindestanzahl Zeichen | Die Mindestanzahl an Zeichen, die Nutzer:innen eingeben müssen. |
| Höchstanzahl Zeichen | Die Höchstanzahl an Zeichen, die Nutzer:innen eingeben können. |
| Zeichenanzahl ausblenden | Blendet den Live-Zeichenzähler für den Textbereich ein oder aus. |
| Platzhaltertext | Text, der im leeren Textbereich angezeigt wird, bis Nutzer:innen etwas eingeben. |
| Höhe (Textzeilen) | Steuert die Höhe des Textbereichs, gemessen in Zeilen. |
| Schriftfamilie | Schriftart für den Text im Textbereich. |
| Schriftstärke | Stärke des Textes (z. B. leicht, normal oder fett). |
| Schriftgröße | Größe des Textes. |
| Zeilenhöhe | Vertikaler Abstand zwischen den Textzeilen. |
| Textfarbe | Farbe des Textes. |
| Zeichenabstand | Horizontaler Abstand zwischen den Zeichen. |
Wissenswertes
- Video: Der Standard-Composer enthält keinen dedizierten Videoblock. Verwenden Sie Custom code, um bei Bedarf einen Player einzubetten. Weitere Informationen finden Sie unter Banner: Häufig gestellte Fragen.
- Liquid: Die meisten Liquid-Funktionen werden unterstützt; es gibt Ausnahmen wie Katalog-Rerender-Tags. Weitere Informationen finden Sie unter Banner: Häufig gestellte Fragen.
Präferenzzentrum-Editor-Blöcke
Ziehen Sie Blöcke aus dem Bereich Build in eine Zeile im Drag-and-Drop-Präferenzzentrum-Editor. Jeder Block hat eigene Einstellungen; das rechte Seitenpanel wechselt zu den Eigenschaften oder dem Styling des ausgewählten Elements.
Bevor Sie Blöcke bearbeiten, fügen Sie Abo-Gruppen hinzu und konfigurieren Sie den Abo-Smart-Block (siehe folgenden Abschnitt). Den vollständigen Einrichtungsablauf finden Sie unter E-Mail-Präferenzzentrum per Drag-and-Drop erstellen.
Titel und Absatz
Fügt Überschriften- oder Fließtext mit Rich-Text-Optionen hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Dicke des Textes. |
| Schriftgröße | Bestimmt die Größe des Textes. |
| Zeilenhöhe | Ändert den Abstand zwischen den Textzeilen. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Textausrichtung | Verschiebt den Text, sodass er linksbündig, zentriert, rechtsbündig oder im Blocksatz ausgerichtet wird. |
| Textfarbe | Ändert die Farbe des Textes. |
Button
Fügt einen klickbaren Button hinzu (z. B. Save oder Navigation).
| Eigenschaft | Beschreibung |
|---|---|
| Button-Breite | Ändert die Breite des Buttons auf automatisch oder manuell. |
| Schriftfamilie | Der Schriftstil für den Text. |
| Schriftstärke | Bestimmt die Dicke des Textes. |
| Schriftgröße | Bestimmt die Größe des Textes. |
| Zeichenabstand | Ändert den Abstand zwischen den einzelnen Zeichen. |
| Button-Ausrichtung | Verschiebt den Button nach links, zentriert oder rechts. |
| Button-Textfarbe | Ändert die Farbe des Textes auf dem Button. |
| Hintergrundfarbe | Ändert die Hintergrundfarbe des Buttons. |
| Rahmenstil | Bestimmt den Stil des Button-Rahmens. |
| Rahmenradius | Bestimmt, wie abgerundet die Ecken sind. |
Bild
Zeigt ein Bild aus der Medienbibliothek oder von einer URL an.

Wenn Sie Bilder über Connected-Content oder Liquid einbinden, stellen Sie sicher, dass Ihre Bild-URL mit https:// beginnt. Die Verwendung von http:// führt zum Absturz Ihrer App.
| Eigenschaft | Beschreibung |
|---|---|
| URL | Die gehostete Adresse für das Bild. |
| Ausrichtung | Verschiebt das Bild nach links, zentriert oder nach rechts. |
| Hintergrundfarbe | Ändert die Farbe des Bildhintergrunds. |
| Rahmenstil | Bestimmt den Stil des Bildrahmens. |
| Rahmenradius | Bestimmt, wie abgerundet die Ecken des Bildes sind. |
Abstandshalter
Fügt vertikalen Abstand zwischen Blöcken hinzu.
| Eigenschaft | Beschreibung |
|---|---|
| Hintergrundfarbe | Ändert die Hintergrundfarbe des SP. |
| Höhe | Ändert die Höhe des SP. Sie können dies auch ändern, indem Sie die Ziehpunkte am SP verwenden. |
Abo-Gruppen (Smart-Block)
Fügt einen Template-Block hinzu, der Abo-Gruppen, optionale Steuerelemente Subscribe to all / Unsubscribe from all und Beschreibungen auflistet. Konfigurieren Sie ihn, nachdem Sie Gruppen im Präferenzzentrum-Workflow hinzugefügt haben.
Nachdem Sie Abo-Gruppen hinzugefügt haben, wählen Sie den Smart-Block in der Arbeitsfläche aus, um:
- Abo-Gruppen neu anzuordnen
- Gruppen hinzuzufügen oder zu entfernen
- Beschreibungen hinzuzufügen oder zu entfernen
- Subscribe to all und Unsubscribe from all für die Gruppen in diesem Block umzuschalten
Das Steuerelement Unsubscribe from all am unteren Rand des Standard-Templates ist erforderlich und führt eine globale Abmeldung von E-Mails durch.
Wissenswertes
- Gemeinsame Stile: Sie können seitenweite Standardwerte unter Common Styles festlegen, bevor Sie einzelne Blöcke anpassen. Weitere Informationen finden Sie unter Präferenzzentrum mit dem Drag-and-Drop-Editor anpassen.
- Bestätigungsseite: Wechseln Sie oben im Editor zu Confirmation Page, um das Erlebnis nach dem Speichern mit denselben Blocktypen zu gestalten.