Banner erstellen
Erfahren Sie, wie Sie Banner erstellen, wenn Sie Campaigns und Canvases in Braze aufbauen. Allgemeine Informationen finden Sie unter Über Banner.
Voraussetzungen
Bevor Sie Ihr Banner starten können, muss Ihr Entwicklungsteam Placements in Ihrer App oder Website einrichten. Sie können in der Zwischenzeit trotzdem Ihre Banner-Campaign entwerfen, aber Sie können die Campaign erst starten, wenn die Placements konfiguriert sind.
Banner-Nachricht erstellen
Schritt 1: Plazierungen in Braze erstellen
Falls Sie dies noch nicht getan haben, müssen Sie in Braze Bannerplatzierungen erstellen, mit denen Sie die Standorte in Ihrer App oder Website definieren, an denen Banner angezeigt werden können. Um eine Platzierung zu erstellen, gehen Sie zu Einstellungen > Bannerplatzierungen und wählen Sie dann Platzierung erstellen.

Geben Sie Ihrer Platzierung einen Namen und vergeben Sie eine Platzierungs-ID. Konsultieren Sie unbedingt andere Teams, bevor Sie eine ID zuweisen, da diese während des gesamten Lebenszyklus der Karte verwendet wird und später nicht mehr geändert werden sollte. Weitere Informationen finden Sie unter Platzierungs-IDs.

Schritt 2: Wählen Sie, wo Sie Ihre Nachricht erstellen möchten
Sie sind nicht sicher, ob Ihre Nachricht als Campaign oder Canvas gesendet werden sollte? Campaigns eignen sich besser für einzelne, gezielte Messaging-Kampagnen, während Canvases besser für mehrstufige User Journeys geeignet sind.
- Gehen Sie zu Messaging > Campaigns und wählen Sie Campaign erstellen.
- Wählen Sie Banner.
- Geben Sie Ihrer Campaign einen klaren und aussagekräftigen Namen.
- Fügen Sie bei Bedarf Teams und Tags hinzu. Tags erleichtern das Auffinden Ihrer Campaigns und das Erstellen von Berichten. Wenn Sie beispielsweise den Berichts-Builder verwenden, können Sie nach den relevanten Tags filtern.
- Wählen Sie das zuvor erstellte Placement aus, um es mit Ihrer Campaign zu verknüpfen.
- Fügen Sie bei Bedarf Varianten hinzu. Sie können für jede Variante einen anderen Nachrichtentyp und ein anderes Layout wählen. Weitere Informationen zu Varianten finden Sie unter Multivariate und A/B-Tests.
- Wählen Sie ein Startdatum und eine Startzeit für Ihre Banner-Campaign. Standardmäßig laufen Banner unbegrenzt. Sie können dies ändern, indem Sie Endzeit auswählen und ein Enddatum sowie eine Endzeit festlegen.

Wenn alle Nachrichten in Ihrer Campaign ähnlich sein oder denselben Inhalt haben werden, verfassen Sie Ihre Nachricht, bevor Sie zusätzliche Varianten hinzufügen. Anschließend können Sie Von Variante kopieren aus dem Dropdown Variante hinzufügen auswählen.
- Erstellen Sie Ihren Canvas mit dem Canvas-Composer.
- Nachdem Sie Ihren Canvas eingerichtet haben, fügen Sie im Canvas-Builder einen Nachrichtenschritt hinzu. Geben Sie Ihrem Schritt einen klaren und aussagekräftigen Namen.
- Wählen Sie Banner als Ihren Messaging-Kanal.
- Wählen Sie ein Placement für das Banner.
- Legen Sie die Priorität fest. Die Banner-Priorität bestimmt die Reihenfolge, in der Banner angezeigt werden, wenn sie dasselbe Placement nutzen.
- Legen Sie eine Ablaufzeit für das Banner fest. Dies kann nach einer bestimmten Dauer, nachdem der Schritt verfügbar ist, oder zu einem bestimmten Datum und einer bestimmten Uhrzeit erfolgen. Die maximale Ablaufdauer beträgt 31 Tage, nachdem der Schritt für die Nutzer:innen verfügbar wird.
Schritt 3: Banner verfassen
Wählen Sie als Nächstes, wie Sie mit dem Erstellen beginnen möchten:
- Drag-and-drop-Editor: Beginnen Sie mit einem leeren Banner und erstellen Sie es visuell mit Blöcken und Zeilen.
- HTML-Editor: Beginnen Sie mit einem leeren Banner und arbeiten Sie direkt in HTML.
- Templates: Öffnen Sie die Template-Bibliothek und wählen Sie ein Design aus Braze-Templates oder Ihre Templates. Templates werden im Drag-and-drop-Editor zur Anpassung geöffnet.

Schritt 3.1: Banner gestalten
Sie können Blöcke und Zeilen per Drag-and-drop in den Canvas-Bereich ziehen, um mit dem Erstellen Ihrer Nachricht zu beginnen. Eine Referenz der Banner-Editor-Blöcke und Links zu gemeinsamen Eigenschaftsdetails finden Sie unter Editor-Blöcke (Banner).

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.
Um die Hintergrund-Eigenschaften, Rahmeneinstellungen und mehr Ihrer Nachricht anzupassen, wählen Sie Styles. Wenn Sie nur den Stil für einen bestimmten Block oder eine bestimmte Zeile anpassen möchten, wählen Sie ihn aus, um Änderungen vorzunehmen.

Der HTML-Editor eignet sich am besten für Teams, die bereits eigene HTML-Templates pflegen oder die volle Kontrolle über Markup und Styling wünschen. Sie können benutzerdefiniertes HTML direkt in den Editor schreiben oder einfügen. Liquid-Personalisierungs-Tags werden vollständig unterstützt, sodass Sie auf Nutzerattribute, angepasste Attribute, Katalogartikel und mehr verweisen können.

Benötigen Sie Hilfe beim Erstellen Ihres Banner-HTMLs? Wählen Sie Ask Operator im HTML-Editor und beschreiben Sie das gewünschte Banner. BrazeAI Operator™ generiert HTML, das Sie überprüfen und in den Editor einfügen können. Weitere Informationen finden Sie unter Nachrichten generieren.
Für Klick- und Schließen-Tracking in Ihrem benutzerdefinierten HTML müssen Sie JavaScript-Bridge-Methoden explizit aufrufen. Die vollständige Referenz finden Sie unter Benutzerdefinierter Code und JavaScript-Bridge für Banner.

Um Nutzer:innen in verschiedenen Sprachen innerhalb einer einzelnen Banner-Campaign anzusprechen, lesen Sie Mehrsprachige Nachrichten.
Schritt 3.2: Klick-Verhalten definieren (optional)
Wenn Nutzer:innen auf einen Link im Banner klicken, können Sie wählen, ob sie tiefer in Ihre App navigiert oder auf eine andere Webseite weitergeleitet werden. Zusätzlich können Sie wählen, ein angepasstes Attribut oder Event zu protokollieren, wodurch das Profil der Nutzer:innen mit benutzerdefinierten Daten aktualisiert wird, wenn sie auf das Banner klicken. Für eine detailliertere Klick-Verfolgung weisen Sie jedem interaktiven Element eine benutzerdefinierte Kennung über das Feld Bezeichner für Berichterstellung in dessen Eigenschafts-Panel zu.

Das Klick-Verhalten kann überschrieben werden, wenn ein bestimmtes Element (z. B. ein Button, Link oder Bild des Banners) ein eigenes Klick-Verhalten hat. Zum Beispiel bei folgenden Klick-Verhalten:
- Ein Banner hat ein Klick-Verhalten, das zur Startseite einer Website weiterleitet.
- Ein Bild im Banner hat ein Klick-Verhalten, das zur Produktseite einer Website weiterleitet.
Im HTML-Editor erfolgt das Klick-Tracking nicht automatisch. Sie müssen brazeBridge.logClick() innerhalb Ihres HTMLs für jedes klickbare Element aufrufen, das Sie verfolgen möchten. Beispiel:
<a href="https://example.com" onclick="brazeBridge.logClick()">Shop now</a>
Die vollständige JavaScript-Bridge-Referenz finden Sie unter Benutzerdefinierter Code und JavaScript-Bridge für Banner.
Schritt 3.3: Schließen-Verhalten konfigurieren (optional)

Für das Schließen von Bannern sind die folgenden Mindest-SDK-Versionen erforderlich. Ältere SDK-Versionen rendern keine Banner mit aktiviertem Schließen.
Aktivieren Sie das Kontrollkästchen Banner kann geschlossen werden im Abschnitt Schließen-Verhalten, um Nutzer:innen das Schließen des Banners zu ermöglichen. Dies ist nützlich, wenn Sie einem breiten Publikum ein zeitlich begrenztes Angebot präsentieren, aber nicht interessierten Nutzer:innen trotzdem ermöglichen möchten, die Nachricht auszublenden.
Wenn das Schließen aktiviert ist, können Sie den Schließen-Button im Abschnitt Schließen-Verhalten anpassen:
| Einstellung | Beschreibung |
|---|---|
| Button-Größe | Die Größe des Schließen-Buttons, der auf dem Banner angezeigt wird. |
| Button-Farbe | Die Farbe des Schließen-Buttons. |
| ARIA-Label | Das barrierefreie Label für den Schließen-Button, das von Screenreadern verwendet wird. Standardmäßig „Schließen“, wenn leer gelassen. |
Wenn Nutzer:innen ein Banner schließen, wird es für diese Nutzer:innen nicht erneut angezeigt, selbst wenn sie weiterhin die Targeting-Kriterien der Campaign erfüllen.
Im HTML-Editor wird das Schließen in Ihrem HTML über brazeBridge.closeMessage() gesteuert. Kombinieren Sie es mit brazeBridge.logClick(), um die Schließen-Aktion auch als Klick-Event zu verfolgen. Beispiel:
<a href="#" onclick="brazeBridge.logClick(); brazeBridge.closeMessage();">✕ Close</a>
Wenn Nutzer:innen ein Banner auf diese Weise schließen, wird es für diese Nutzer:innen nicht erneut angezeigt, selbst wenn sie weiterhin die Targeting-Kriterien der Campaign erfüllen.
Die vollständige JavaScript-Bridge-Referenz finden Sie unter Benutzerdefinierter Code und JavaScript-Bridge für Banner.
Schritt 3.4: Benutzerdefinierte Eigenschaften hinzufügen (optional)
Sie können einem Banner benutzerdefinierte Eigenschaften hinzufügen, um strukturierte Metadaten wie Strings oder JSON-Objekte anzuhängen. Diese Eigenschaften beeinflussen nicht die Darstellung des Banners, können jedoch über das Braze SDK abgerufen werden, um das Verhalten oder Erscheinungsbild Ihrer App zu verändern. Beispielsweise könnten Sie:
- Senden Sie Metadaten für Ihre Drittanbieter-Analytics oder Integrationen.
- Verwenden Sie Metadaten wie einen
timestampoder ein JSON-Objekt, um bedingte Logik zu triggern. - Steuern Sie das Verhalten eines Banners basierend auf enthaltenen Metadaten wie
ratiooderformat.
Benutzerdefinierte Eigenschaften funktionieren im Drag-and-drop-Editor und im HTML-Editor auf dieselbe Weise. Um eine benutzerdefinierte Eigenschaft hinzuzufügen, wählen Sie Einstellungen > Eigenschaften > Eigenschaft hinzufügen.

Füllen Sie für jede Eigenschaft, die Sie hinzufügen möchten, die folgenden Felder aus:
| Feld | Beschreibung | Beispiel |
|---|---|---|
| Eigenschaftstyp | Der Datentyp für die Eigenschaft. Unterstützte Typen sind String, Boolean, Nummer, Zeitstempel, Bild-URL und JSON-Objekt. | String |
| Eigenschaftsschlüssel | Der eindeutige Bezeichner für die Eigenschaft. Dieser Schlüssel wird im SDK verwendet, um auf die Eigenschaft zuzugreifen. | color |
| Wert | Der der Eigenschaft zugewiesene Wert. Muss zum ausgewählten Eigenschaftstyp passen. | #FF0000 |
Wenn Sie fertig sind, wählen Sie Fertig.

Schritt 3.5: Mit Connected Content personalisieren (optional)

Connected Content for Banners befindet sich derzeit im Early Access. Kontaktieren Sie Ihre:n Braze Account Manager:in, wenn Sie an der Teilnahme am Early Access interessiert sind.
Da Banner inline während einer Session-Aktualisierung gerendert werden, funktioniert Connected Content in diesem Kanal anders als in anderen Kanälen:
- Es werden nur GET-Anfragen unterstützt.
- Alle Placements in einer einzelnen Aktualisierung (bis zu 10) teilen sich ein Rendering-Budget von etwa zwei Sekunden. Wenn ein Aufruf langsam ist, das Zeitlimit überschreitet oder das Budget überschritten wird, wird das Connected-Content-Ergebnis für dieses Placement als null behandelt. Banner führen keine Wiederholungsversuche durch.
Für beste Ergebnisse:
- Halten Sie Ihre Endpunkte schnell und cachen Sie Antworten wann immer möglich.
- Begrenzen Sie die Anzahl eindeutiger Connected-Content-URLs über die Placements hinweg, die zusammen gerendert werden.
- Vermeiden Sie verkettete Aufrufe, bei denen eine Connected-Content-Antwort die URL für den nächsten bestimmt. Jeder zusätzliche Aufruf trägt zum gemeinsamen Budget bei.
- Verwenden Sie Liquid-Guard-Anweisungen oder den
default-Filter, um null-Ergebnisse zu behandeln und leere Banner zu vermeiden.
Schritt 4: Erstellen Sie den Rest Ihrer Campaign oder Ihres Canvas
Banner-Priorität festlegen (optional)
Die Banner-Priorität bestimmt die Reihenfolge, in der Banner angezeigt werden, wenn sie dasselbe Placement nutzen. Um die Priorität manuell festzulegen:
- Wählen Sie Set exact priority.
- Ziehen Sie die Campaigns per Drag-and-drop in die richtige Prioritätsreihenfolge.
- Wählen Sie Apply Sort.

Wenn Sie mehrere Banner-Campaigns mit derselben Placement-ID haben, empfehlen wir die Verwendung des Drag-and-drop-Prioritätssortierers, um die genaue Priorität festzulegen.
Wiederberechtigung konfigurieren (optional)
Standardmäßig sind Nutzer:innen, die ein Banner geschlossen haben, nie wieder für diese Campaign berechtigt. Um geschlossenen Nutzer:innen das erneute Anzeigen des Banners zu ermöglichen, gehen Sie zum Schritt Zustellungskontrollen und wählen Sie Nutzer:innen erlauben, wieder für die Campaign berechtigt zu werden. Wenn aktiviert, legen Sie ein Abklingfenster in Minuten, Stunden, Tagen oder Wochen fest.
Der Countdown beginnt, wenn die Nutzer:innen das Banner schließen. Nach Ablauf des Fensters sind die Nutzer:innen automatisch wieder berechtigt – kein Neustart der Campaign erforderlich. Die Wiederberechtigung wird pro Nutzer:in und Campaign verfolgt.
Zielgruppe auswählen
- Wählen Sie unter Zielgruppen Segmente oder Filter, um Ihre Zielgruppe einzugrenzen. Sie erhalten automatisch eine Vorschau der ungefähren Segment-Größe. Die genaue Segment-Zugehörigkeit wird berechnet, bevor die Nachricht gesendet wird.

Ihre Nachricht wird ausschließlich an Nutzer:innen gesendet, die bereits die Bedingungen erfüllen, die Sie im Schritt „Zielgruppe“ festgelegt haben. Anschließend müssen sie noch den Trigger erfüllen, den Sie im Schritt „Zustellung planen“ definieren. Stellen Sie sich die Zielgruppe als einen Warteraum vor – nur Personen, die sich bereits darin befinden, können voranschreiten, wenn die nächste Aktion erfolgt.
- Verfolgen Sie unter Konversionen zuweisen, wie oft Nutzer:innen nach Erhalt einer Campaign bestimmte Aktionen ausführen, indem Sie Konversions-Events mit einem Zeitfenster von bis zu 30 Tagen definieren, innerhalb dessen die Aktion als Konversion gezählt wird.
Konversions-Events auswählen
Braze ermöglicht es Ihnen, Konversions-Events zu verfolgen – wie oft Nutzer:innen nach Erhalt einer Campaign bestimmte Aktionen ausführen. Sie haben die Möglichkeit, ein Zeitfenster von bis zu 30 Tagen festzulegen, in dem eine Konversion gezählt wird, wenn die Nutzer:innen die angegebene Aktion ausführen.
Falls noch nicht geschehen, vervollständigen Sie die verbleibenden Abschnitte Ihrer Canvas-Komponente. Details zum Erstellen des restlichen Canvas, einschließlich multivariatem Testen und Optimieren mit BrazeAITM, finden Sie unter Canvas erstellen.
Um die Wiederberechtigung für Canvas-Banner-Schritte zu steuern, verwenden Sie die Canvas-Wiedereintrittseinstellungen. Weitere Informationen finden Sie unter Wiederberechtigung für Campaigns und Canvas.
Schritt 5: Nachricht testen (optional)
Wählen Sie Vorschau, um eine Vorschau Ihres Banners anzuzeigen oder eine Testnachricht zu senden.

Beachten Sie, dass Ihre Vorschau aufgrund von Hardware-Unterschieden möglicherweise nicht mit der endgültigen Darstellung auf dem Gerät einer Nutzer:in identisch ist.
Um eine Testnachricht zu senden, fügen Sie entweder eine Inhalts-Testgruppe oder einzelne Nutzer:innen als Testempfänger:innen hinzu und wählen Sie dann Test senden. Sie können Ihre Testnachricht bis zu 5 Minuten lang auf dem Gerät ansehen. Anschließend können Sie Vorschau-Link kopieren auswählen, um einen teilbaren Vorschau-Link zu generieren und zu kopieren, der zeigt, wie das Banner für eine zufällige Nutzer:in aussehen wird. Der Link ist sieben Tage lang gültig, bevor er neu generiert werden muss.

Überprüfen Sie beim Durchsehen Ihres Test-Banners Folgendes:
- Ist Ihre Banner-Campaign einer Platzierung zugewiesen?
- Werden die Bilder und Medien auf Ihren Zielgerätetypen und Bildschirmgrößen wie erwartet angezeigt und verhalten sie sich korrekt?
- Führen Ihre Links und Buttons die Nutzer:innen dorthin, wohin sie gelangen sollen?
- Funktioniert Liquid wie erwartet? Haben Sie einen Standardattributwert für den Fall vorgesehen, dass Liquid keine Informationen zurückgibt?
- Ist Ihr Text klar, prägnant und korrekt?
Weitere Informationen finden Sie unter Testnachrichten senden.
Schritt 6: Überprüfen und bereitstellen
Nachdem Sie Ihre Campaign oder Ihren Canvas fertig erstellt haben, überprüfen Sie die Details, testen Sie sie und senden Sie sie, wenn Sie bereit sind.