Anleitung: Einen Posteingang mit Content Cards erstellen
Folgen Sie dem Beispielcode in dieser Anleitung, um einen Posteingang mit Braze Content Cards zu erstellen.
Voraussetzungen
Bevor Sie dieses Feature nutzen können, müssen Sie das Android Braze SDK integrieren.
Einen Posteingang mit Content Cards für Android erstellen (Compose)
Wir testen derzeit dieses neue Tutorial-Format. Teilen Sie uns Ihre Meinung mit – Ihr Feedback hilft uns, zukünftige Anleitungen zu verbessern.
1. Debugging aktivieren (optional) {#1-enable-debugging-optional}
Um die Fehlerbehebung während der Entwicklung zu erleichtern, sollten Sie das Debugging aktivieren.
2. Eine UI-Ansicht erstellen {#2-build-a-ui-view}
Verwenden Sie für Jetpack Compose eine LazyColumn, um Content Cards in einer scrollbaren Liste anzuzeigen.
3. Content-Card-Updates abonnieren {#3-subscribe-to-content-card-updates}
Verwenden Sie einen DisposableEffect, um den Lebenszyklus des Abos zu verwalten und sicherzustellen, dass eine ordnungsgemäße Bereinigung erfolgt, wenn das Composable die Komposition verlässt.
4. Eine angepasste Posteingangs-UI erstellen {#4-build-a-custom-inbox-ui}
Mit den Attributen der Content-Card wie title, description und url können Sie Content Cards erstellen, die Ihren spezifischen UI-Anforderungen entsprechen. In diesem Fall erstellen wir einen Posteingang mit den Composables Card und Column von Jetpack Compose.
5. Impressionen und Klicks tracken {#5-track-impressions-and-clicks}
Sie können Impressionen und Klicks mithilfe der für Content Cards verfügbaren Methoden logImpressions und logClick protokollieren.
Impressionen sollten nur einmal protokolliert werden, wenn eine Karte von Nutzer:innen angesehen wird. Verwenden Sie LaunchedEffect, um Impressionen zu protokollieren, wenn eine Karte sichtbar wird. Beachten Sie, dass Sie möglicherweise den Lebenszyklus der Ansicht Ihrer App sowie den Anwendungsfall berücksichtigen müssen, um sicherzustellen, dass Impressionen korrekt protokolliert werden.
Einen Posteingang mit Content Cards für Android erstellen (RecyclerView)
1. Debugging aktivieren (optional)
Um die Fehlerbehebung während der Entwicklung zu erleichtern, sollten Sie das Debugging aktivieren.
2. Eine UI-Ansicht erstellen
In dieser Anleitung verwenden wir Androids RecyclerView, um Content Cards anzuzeigen. Wir empfehlen jedoch, eine UI mit Klassen und Komponenten zu erstellen, die Ihrem Anwendungsfall entspricht. Braze stellt die UI standardmäßig bereit, aber diese Anleitung führt Sie durch die Erstellung einer angepassten Ansicht, um das Erscheinungsbild und Verhalten anzupassen.
3. Content-Card-Updates abonnieren
Verwenden Sie subscribeToContentCardsUpdates, damit Ihre UI reagieren kann, wenn neue Content Cards verfügbar sind. Hier werden Subscriber innerhalb der Activity-Lifecycle-Hooks registriert und entfernt.
4. Eine angepasste Posteingangs-UI erstellen
Mit den Attributen der Content-Card wie title, description und url können Sie Content Cards erstellen, die Ihren spezifischen UI-Anforderungen entsprechen. In diesem Fall erstellen wir einen Posteingang mit Androids nativer RecyclerView.
5. Impressionen und Klicks tracken
Sie können Impressionen und Klicks mithilfe der für Content Cards verfügbaren Methoden logImpressions und logClick protokollieren.
Impressionen sollten nur einmal protokolliert werden, wenn eine Karte von Nutzer:innen angesehen wird. Hier verwenden wir einen einfachen Mechanismus, um doppelte Protokollierungen mit einem Flag pro Karte zu verhindern. Beachten Sie, dass Sie möglicherweise den Lebenszyklus der Ansicht Ihrer App sowie den Anwendungsfall berücksichtigen müssen, um sicherzustellen, dass Impressionen korrekt protokolliert werden.
Voraussetzungen
Bevor Sie dieses Feature nutzen können, müssen Sie das Swift Braze SDK integrieren. Außerdem müssen Sie In-App Messages für Swift aktivieren.
Einen Posteingang mit Content Cards für Swift erstellen
Wir testen derzeit dieses neue Tutorial-Format. Teilen Sie uns Ihre Meinung mit – Ihr Feedback hilft uns, zukünftige Anleitungen zu verbessern.
1. Debugging aktivieren (optional)
Um die Fehlerbehebung während der Entwicklung zu erleichtern, sollten Sie das Debugging aktivieren.
2. Eine UI-Ansicht erstellen
In dieser Anleitung verwenden wir Swifts UITableViewController. Wir empfehlen jedoch, eine UI mit Klassen und Komponenten zu erstellen, die Ihrem Anwendungsfall entspricht.
3. Content-Card-Updates abonnieren
Abonnieren Sie den Content-Cards-Listener, um die neuesten Updates zu erhalten, und rufen Sie anschließend requestRefresh() auf, um die neuesten Content Cards für diese Nutzer:in anzufordern.
4. Eine angepasste Posteingangs-UI erstellen
Mit den Attributen der Content-Card wie title, description und imageUrl können Sie Content Cards erstellen, die Ihren spezifischen UI-Anforderungen entsprechen. In diesem Fall erstellen wir einen Posteingang mit den nativen Tabellen-APIs von Swift.
5. Impressionen und Klicks tracken
Sie können Impressionen und Klicks mithilfe der für eine Content-Card verfügbaren Methoden logClick(using:) und logImpression(using:) protokollieren.
Darüber hinaus können Sie logDismissed(using:) für Dismissals verwenden.
Impressionen sollten nur einmal protokolliert werden, wenn sie von Nutzer:innen angesehen werden. Hier wird ein einfacher Mechanismus unter Verwendung eines Set und willDisplay eingesetzt, um dies zu erreichen. Beachten Sie, dass Sie möglicherweise den UI-Lebenszyklus Ihrer App sowie den Anwendungsfall berücksichtigen müssen, um sicherzustellen, dass Impressionen korrekt protokolliert werden.
Voraussetzungen
Bevor Sie dieses Feature nutzen können, müssen Sie das Internet Braze SDK integrieren. Es ist jedoch keine zusätzliche Einrichtung erforderlich.
Einen Posteingang mit Content Cards für Web erstellen
Wir testen derzeit dieses neue Tutorial-Format. Teilen Sie uns Ihre Meinung mit – Ihr Feedback hilft uns, zukünftige Anleitungen zu verbessern.
1. Debugging aktivieren (optional)
Um die Fehlerbehebung während der Entwicklung zu erleichtern, sollten Sie das Debugging aktivieren. Optional können Sie auch Braze Web SDK-Methoden in der Konsole ausführen.
2. Die UI erstellen {#2-build-the-ui}
Erstellen Sie eine UI für die Posteingangsseite. Hier erstellen wir eine einfache HTML-Seite, die ein div mit der ID cards-list enthält. Dieses wird als Zielcontainer für die Darstellung von Content Cards verwendet.
3. Content-Card-Updates abonnieren
Abonnieren Sie den Content-Cards-Listener, um die neuesten Updates zu erhalten, und rufen Sie anschließend requestContentCardsRefresh() auf, um die neuesten Content Cards für diese Nutzer:in anzufordern. Alternativ können Sie den Subscriber vor openSession() aufrufen, um eine automatische Aktualisierung beim Sitzungsstart auszulösen.
4. Die Posteingangs-Elemente erstellen {#4-build-the-inbox-elements}
Durch die Verwendung der Attribute der Content-Card wie title, description und url können Sie Content Cards entsprechend Ihren spezifischen UI-Anforderungen anzeigen.
5. Impressionen und Klicks tracken
Sie können Impressionen und Klicks mithilfe der für Content Cards verfügbaren Methoden logContentCardImpressions und logContentCardClick protokollieren.
Darüber hinaus können Sie logCardDismissal für Dismissals verwenden.
Impressionen sollten nur einmal protokolliert werden, wenn sie von Nutzer:innen angesehen werden. Hier verhindert ein IntersectionObserver zusammen mit einem Set, das nach card.id schlüsselt, doppelte Protokollierungen. Beachten Sie, dass Sie möglicherweise den UI-Lebenszyklus Ihrer App sowie den Anwendungsfall berücksichtigen müssen, um sicherzustellen, dass Impressionen korrekt protokolliert werden.