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 Ihren Banner starten können, muss Ihr Entwicklungsteam Platzierungen in Ihrer App oder auf Ihrer Website einrichten. In der Zwischenzeit können Sie bereits einen Entwurf Ihrer Banner-Kampagne erstellen. Starten können Sie die Kampagne jedoch erst, wenn die Platzierungen konfiguriert sind.
Für Platzierungen im Web können Sie auch Web-Targeting nutzen. So legen Sie fest, wo ein Banner auf Ihrer Website erscheint, ohne für jede Platzierung Code zum Einfügen schreiben zu müssen.
Banner-Nachricht erstellen
Schritt 1: Platzierungen in Braze erstellen
Falls Sie dies noch nicht getan haben, müssen Sie in Braze Banner-Platzierungen 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 > Banner-Platzierungen und wählen Sie dann Platzierung erstellen.
Geben Sie Ihrer Platzierung einen Namen und weisen Sie eine Platzierungs-ID zu. Stimmen Sie sich unbedingt mit anderen Teams ab, 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 aus, wo Sie Ihre Nachricht erstellen möchten
Sie sind sich nicht sicher, ob Sie Ihre Nachricht über eine Kampagne oder ein Canvas versenden sollten? Kampagnen eignen sich besser für einzelne, gezielte Messaging-Kampagnen, Canvases hingegen für mehrstufige Nutzer-Journeys.
- Gehen Sie zu Messaging > Kampagnen und wählen Sie Kampagne erstellen aus.
- Wählen Sie Banner aus.
- Geben Sie Ihrer Kampagne einen eindeutigen und aussagekräftigen Namen.
- Fügen Sie bei Bedarf Teams und Tags hinzu. Mit Tags lassen sich Ihre Kampagnen leichter finden und für Berichte nutzen. Wenn Sie beispielsweise den Berichts-Builder verwenden, können Sie nach den entsprechenden Tags filtern.
- Wählen Sie die zuvor erstellte Platzierung aus, um sie mit Ihrer Kampagne 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-Kampagne. 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 Kampagne ähnlich sind oder denselben Inhalt haben, verfassen Sie Ihre Nachricht, bevor Sie weitere Varianten hinzufügen. Anschließend können Sie im Dropdown-Menü Variante hinzufügen die Option Von Variante kopieren auswählen.
- Erstellen Sie Ihr Canvas mit dem Canvas-Composer.
- Nachdem Sie Ihr Canvas eingerichtet haben, fügen Sie im Canvas-Builder einen Nachrichtenschritt hinzu. Geben Sie Ihrem Schritt einen eindeutigen und aussagekräftigen Namen.
- Wählen Sie Banner als Messaging-Kanal aus.
- Wählen Sie eine Platzierung für das Banner aus.
- Legen Sie die Priorität fest. Die Banner-Priorität bestimmt die Reihenfolge, in der Banner angezeigt werden, wenn sie dieselbe Platzierung verwenden.
- Legen Sie einen Ablauf für das Banner fest. Dieser kann nach einer bestimmten Zeitspanne ab Verfügbarkeit des Schritts 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 aus, wie Sie mit der Erstellung beginnen möchten:
- Drag-and-Drop-Editor: Beginnen Sie mit einem leeren Banner und gestalten 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 aus. Templates werden zur Anpassung im Drag-and-Drop-Editor 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 der Erstellung Ihrer Nachricht zu beginnen. Eine Übersicht über die Banner-Editor-Blöcke sowie 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 Hintergrundeigenschaften, Rahmeneinstellungen und mehr für Ihre Nachricht anzupassen, wählen Sie Stile aus. Wenn Sie nur den Stil eines bestimmten Blocks oder einer bestimmten Zeile anpassen möchten, wählen Sie diesen bzw. diese 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 haben möchten. Sie können angepasstes 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 des HTML für Ihr Banner? Wählen Sie im HTML-Editor Operator fragen aus und beschreiben Sie das gewünschte Banner. BrazeAI Operator™ generiert HTML, das Sie prüfen und in den Editor einfügen können. Weitere Informationen finden Sie unter Nachrichten generieren.
Für das Tracking von Klicks und Schließungen in Ihrem angepassten HTML müssen Sie die Methoden der JavaScript-Bridge explizit aufrufen. Die vollständige Referenz finden Sie unter Angepasster Code und JavaScript-Bridge für Banner.
Wie Sie innerhalb einer einzelnen Banner-Kampagne Nutzer:innen in verschiedenen Sprachen ansprechen, erfahren Sie unter Mehrsprachige Nachrichten.
Schritt 3.2: Verhalten bei Klick festlegen (optional)
Wenn Nutzer:innen auf einen Link im Banner klicken, können Sie sie tiefer in Ihre App führen oder auf eine andere Webseite weiterleiten. Zusätzlich können Sie ein angepasstes Attribut oder Event protokollieren, das das Nutzerprofil mit angepassten Daten aktualisiert, wenn auf das Banner geklickt wird. Für ein detaillierteres Klick-Tracking weisen Sie jedem interaktiven Element über das Feld Bezeichner für Berichte in dessen Eigenschaften-Panel einen angepassten Bezeichner zu.
Das Verhalten bei Klick kann überschrieben werden, wenn ein bestimmtes Element des Banners (z. B. ein Button, Link oder Bild) ein eigenes Verhalten bei Klick hat. Angenommen, es gibt folgende Verhaltensweisen bei Klick:
- Ein Banner hat ein Verhalten bei Klick, das auf die Startseite einer Website weiterleitet.
- Ein Bild im Banner hat ein Verhalten bei Klick, das auf die Produktseite einer Website weiterleitet.
Im HTML-Editor erfolgt das Klick-Tracking nicht automatisch. Sie müssen brazeBridge.logClick() in Ihrem HTML für jedes anklickbare Element aufrufen, das Sie tracken möchten. Zum Beispiel:
<a href="https://example.com" onclick="brazeBridge.logClick()">Shop now</a>
Die vollständige Referenz zur JavaScript-Bridge finden Sie unter Angepasster Code und JavaScript-Bridge für Banner.
Schritt 3.3: Verhalten beim Schließen konfigurieren (optional)
Das Schließen von Bannern erfordert die folgenden SDK-Mindestversionen. Ältere SDK-Versionen rendern Banner mit aktivierter Schließen-Funktion nicht.
Aktivieren Sie im Abschnitt Verhalten beim Schließen das Kontrollkästchen Banner kann geschlossen werden, damit Nutzer:innen das Banner schließen können. Das ist hilfreich, wenn Sie ein zeitlich begrenztes Angebot einer breiten Zielgruppe präsentieren, uninteressierten Nutzer:innen aber dennoch ermöglichen möchten, die Nachricht auszublenden.
Wenn das Schließen aktiviert ist, können Sie den Schließen-Button im Abschnitt Verhalten beim Schließen 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 „Close“, wenn das Feld leer bleibt. |
Wenn Nutzer:innen ein Banner schließen, wird es ihnen nicht erneut angezeigt, auch wenn sie die Targeting-Kriterien der Kampagne weiterhin erfüllen.
Im HTML-Editor wird das Schließen in Ihrem HTML über brazeBridge.closeMessage() gesteuert. Kombinieren Sie es mit brazeBridge.logClick(), um das Schließen zusätzlich als Klick-Event zu tracken. Zum Beispiel:
<a href="#" onclick="brazeBridge.logClick(); brazeBridge.closeMessage();">✕ Close</a>
Wenn Nutzer:innen ein Banner auf diese Weise schließen, wird es ihnen nicht erneut angezeigt, auch wenn sie die Targeting-Kriterien der Kampagne weiterhin erfüllen.
Die vollständige Referenz zur JavaScript-Bridge finden Sie unter Angepasster Code und JavaScript-Bridge für Banner.
Schritt 3.4: Angepasste Eigenschaften hinzufügen (optional)
Sie können einem Banner angepasste Eigenschaften hinzufügen, um strukturierte Metadaten wie Strings oder JSON-Objekte anzuhängen. Diese Eigenschaften beeinflussen nicht, wie das Banner angezeigt wird, können aber über das Braze SDK abgerufen werden, um das Verhalten oder Aussehen Ihrer App zu verändern. Sie könnten zum Beispiel:
- 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.
Angepasste Eigenschaften funktionieren im Drag-and-Drop-Editor und im HTML-Editor auf dieselbe Weise. Um eine angepasste Eigenschaft hinzuzufügen, wählen Sie Einstellungen > Eigenschaften > Eigenschaft hinzufügen aus.
Füllen Sie für jede Eigenschaft, die Sie hinzufügen möchten, Folgendes aus:
| Feld | Beschreibung | Beispiel |
|---|---|---|
| Eigenschaftstyp | Der Datentyp der Eigenschaft. Unterstützte Typen sind String, Boolean, Zahl, Zeitstempel, Bild-URL und JSON-Objekt. | String |
| Eigenschaftsschlüssel | Der eindeutige Bezeichner der Eigenschaft. Über diesen Schlüssel wird im SDK auf die Eigenschaft zugegriffen. | color |
| Wert | Der Wert, der der Eigenschaft zugewiesen wird. Er muss dem ausgewählten Eigenschaftstyp entsprechen. | #FF0000 |
Wenn Sie fertig sind, wählen Sie Fertig aus.
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 während einer Sitzungsaktualisierung inline gerendert werden, funktioniert Connected-Content in diesem Kanal anders als in anderen Kanälen:
- Es werden nur GET-Anfragen unterstützt.
- Alle Platzierungen 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 aufgebraucht ist, wird das Connected-Content-Ergebnis für diese Platzierung als null behandelt. Banner führen keine erneuten Versuche durch.
Für optimale Ergebnisse:
- Halten Sie Ihre Endpunkte schnell und cachen Sie Antworten, wann immer möglich.
- Begrenzen Sie die Anzahl eindeutiger Connected-Content-URLs über die Platzierungen hinweg, die zusammen gerendert werden.
- Vermeiden Sie verkettete Aufrufe, bei denen eine Connected-Content-Antwort die URL für den nächsten Aufruf bestimmt. Jeder zusätzliche Aufruf belastet das gemeinsame Budget.
- Verwenden Sie Liquid-Guard-Anweisungen oder den
default-Filter, um Null-Ergebnisse abzufangen und leere Banner zu vermeiden.
Schritt 4: Restliche Kampagne oder Canvas erstellen
Banner-Priorität festlegen (optional)
Die Banner-Priorität bestimmt die Reihenfolge, in der Banner angezeigt werden, wenn sie dieselbe Platzierung verwenden. So legen Sie die Priorität manuell fest:
- Wählen Sie Exakte Priorität festlegen aus.
- Ordnen Sie die Kampagnen per Drag-and-Drop in der richtigen Priorität an.
- Wählen Sie Sortierung anwenden aus.
Wenn Sie mehrere Banner-Kampagnen mit derselben Platzierungs-ID haben, empfehlen wir, die exakte Priorität mit der Drag-and-Drop-Prioritätssortierung festzulegen.
Wiederholte Berechtigung konfigurieren (optional)
Standardmäßig sind Nutzer:innen, die ein Banner schließen, für diese Kampagne nie wieder berechtigt. Damit Nutzer:innen, die das Banner geschlossen haben, es erneut sehen können, gehen Sie zum Schritt Zustellungseinstellungen und wählen Nutzer:innen erlauben, die Kampagne erneut zu erhalten aus. Wenn diese Option aktiviert ist, legen Sie ein Wartezeitfenster in Minuten, Stunden, Tagen oder Wochen fest.
Der Countdown beginnt, sobald Nutzer:innen das Banner schließen. Nach Ablauf des Zeitfensters sind die Nutzer:innen automatisch wieder berechtigt – ein Neustart der Kampagne ist nicht erforderlich. Die erneute Berechtigung wird pro Nutzer:in und pro Kampagne getrackt.
Zielgruppe auswählen
- Wählen Sie unter Zielgruppen Segmente oder Filter aus, um Ihre Zielgruppe einzugrenzen. Sie erhalten automatisch eine Vorschau der ungefähren Segmentgröße. Die genaue Segmentzugehörigkeit wird vor dem Versand der Nachricht berechnet.
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.
- Unter Konversionen zuweisen können Sie tracken, wie oft Nutzer:innen nach Erhalt einer Kampagne bestimmte Aktionen ausführen. Dazu definieren Sie Konversions-Events mit einem Zeitfenster von bis zu 30 Tagen, in dem die Aktion als Konversion gezählt wird.
Konversions-Events auswählen
Mit Braze können Sie Konversions-Events tracken, also wie oft Nutzer:innen nach Erhalt einer Kampagne bestimmte Aktionen ausführen. Sie können ein Zeitfenster von bis zu 30 Tagen festlegen, in dem eine Konversion gezählt wird, wenn die Nutzer:innen die angegebene Aktion ausführen.
Falls noch nicht geschehen, vervollständigen Sie die übrigen Abschnitte Ihrer Canvas-Komponente. Details zur Erstellung des restlichen Canvas, einschließlich multivariater Tests und Optimieren mit BrazeAITM, finden Sie unter Canvas erstellen.
Um die erneute Berechtigung für Banner-Schritte in Canvas zu steuern, verwenden Sie die Einstellungen für den Wiedereintritt in Canvas. Weitere Informationen finden Sie unter Erneute Berechtigung für Kampagnen 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
Wenn Sie mit der Erstellung Ihrer Kampagne oder Ihres Canvas fertig sind, überprüfen Sie die Details, testen Sie sie und versenden Sie sie, sobald Sie bereit sind.