Tutoriel : Créer une boîte de réception avec Content Cards
Suivez l’exemple de code de ce tutoriel pour créer une boîte de réception avec les Content Cards de Braze.
Conditions préalables
Avant de pouvoir utiliser cette fonctionnalité, vous devrez intégrer le SDK Android Braze.
Créer une boîte de réception avec Content Cards pour Android (Compose)
Nous testons actuellement ce nouveau format de tutoriel. Nous vous invitons à nous faire part de vos commentaires, https://docs.google.com/forms/d/e/1FAIpQLSe_5uhWM7eXXk9F_gviO_pvA4rkYO3WA9B6tNJZ3TY91md5bw/viewform?usp=pp_url&entry.569173304=General+Feedbackcar ils nous aideront à améliorer les prochains guides.
1. Activer le débogage (facultatif) {#1-enable-debugging-optional}
Pour faciliter la résolution des problèmes lors du développement, pensez à activer le débogage.
2. Créer une vue d’interface utilisateur {#2-build-a-ui-view}
Pour Jetpack Compose, utilisez un LazyColumn pour afficher les Content Cards dans une liste déroulante.
3. S’abonner aux mises à jour des Content Cards {#3-subscribe-to-content-card-updates}
Utilisez un DisposableEffect pour gérer le cycle de vie de l’abonnement, en veillant à ce que le nettoyage soit effectué correctement lorsque le composable quitte la composition.
4. Créer une interface utilisateur personnalisée pour la boîte de réception {#4-build-a-custom-inbox-ui}
L’utilisation des attributs des Content Cards tels que title, description et url vous permet de créer des Content Cards adaptées à vos besoins spécifiques en matière d’interface utilisateur. Dans ce cas, nous créons une boîte de réception à l’aide des composables Card et Column de Jetpack Compose.
5. Suivre les impressions et les clics {#5-track-impressions-and-clicks}
Vous pouvez enregistrer les impressions et les clics à l’aide des méthodes logImpressions et logClick disponibles pour les Content Cards.
Les impressions ne doivent être enregistrées qu’une seule fois lorsqu’une carte est consultée par l’utilisateur. Utilisez LaunchedEffect pour enregistrer les impressions lorsqu’une carte devient visible. Notez qu’il peut être nécessaire de prendre en compte le cycle de vie de la vue de votre application, ainsi que le cas d’utilisation, afin de garantir que les impressions sont correctement enregistrées.
Créer une boîte de réception avec Content Cards pour Android (RecyclerView)
1. Activer le débogage (facultatif)
Pour faciliter la résolution des problèmes lors du développement, pensez à activer le débogage.
2. Créer une vue d’interface utilisateur
Dans ce tutoriel, nous utilisons le RecyclerView d’Android pour afficher les Content Cards, mais nous vous recommandons de créer une interface utilisateur avec des classes et des composants adaptés à votre cas d’utilisation. Braze fournit l’interface utilisateur par défaut, mais ce tutoriel vous guide dans la création d’une vue personnalisée afin d’en personnaliser l’apparence et le comportement.
3. S’abonner aux mises à jour des Content Cards
Utilisez subscribeToContentCardsUpdates pour permettre à votre interface utilisateur de réagir lorsque de nouvelles Content Cards sont disponibles. Ici, les abonnés sont enregistrés et supprimés dans les hooks du cycle de vie de l’activité.
4. Créer une interface utilisateur personnalisée pour la boîte de réception
L’utilisation des attributs des Content Cards tels que title, description et url vous permet de créer des Content Cards adaptées à vos besoins spécifiques en matière d’interface utilisateur. Dans ce cas, nous créons une boîte de réception avec le RecyclerView natif d’Android.
5. Suivre les impressions et les clics
Vous pouvez enregistrer les impressions et les clics à l’aide des méthodes logImpressions et logClick disponibles pour les Content Cards.
Les impressions ne doivent être enregistrées qu’une seule fois lorsqu’une carte est consultée par l’utilisateur. Ici, nous utilisons un mécanisme simple pour éviter les doublons grâce à un indicateur par carte. Notez qu’il peut être nécessaire de prendre en compte le cycle de vie de la vue de votre application, ainsi que le cas d’utilisation, afin de garantir que les impressions sont correctement enregistrées.
Conditions préalables
Avant de pouvoir utiliser cette fonctionnalité, vous devrez intégrer le SDK Swift Braze. Vous devrez également activer les messages in-app pour Swift.
Créer une boîte de réception avec Content Cards pour Swift
Nous testons actuellement ce nouveau format de tutoriel. Nous vous invitons à nous faire part de vos commentaires, https://docs.google.com/forms/d/e/1FAIpQLSe_5uhWM7eXXk9F_gviO_pvA4rkYO3WA9B6tNJZ3TY91md5bw/viewform?usp=pp_url&entry.569173304=General+Feedbackcar ils nous aideront à améliorer les prochains guides.
1. Activer le débogage (facultatif)
Pour faciliter la résolution des problèmes lors du développement, pensez à activer le débogage.
2. Créer une vue d’interface utilisateur
Dans ce tutoriel, nous utilisons le UITableViewController de Swift, mais nous vous recommandons de créer une interface utilisateur avec des classes et des composants adaptés à votre cas d’utilisation.
3. S’abonner aux mises à jour des Content Cards
Abonnez-vous à l’écouteur des Content Cards pour recevoir les dernières mises à jour, puis appelez requestRefresh() pour demander les Content Cards les plus récentes pour cet utilisateur.
4. Créer une interface utilisateur personnalisée pour la boîte de réception
L’utilisation des attributs des Content Cards tels que title, description et imageUrl vous permet de créer des Content Cards adaptées à vos besoins spécifiques en matière d’interface utilisateur. Dans ce cas, nous créons une boîte de réception à l’aide des API de table natives de Swift.
5. Suivre les impressions et les clics
Vous pouvez enregistrer les impressions et les clics à l’aide des méthodes logClick(using:) et logImpression(using:) disponibles pour une Content Card.
De plus, vous pouvez utiliser logDismissed(using:) pour les fermetures.
Les impressions ne doivent être enregistrées qu’une seule fois lorsqu’elles sont consultées par l’utilisateur. Ici, un mécanisme simple utilisant un Set et willDisplay est utilisé pour y parvenir. Notez qu’il peut être nécessaire de prendre en compte le cycle de vie de l’interface utilisateur de votre application, ainsi que le cas d’utilisation, afin de garantir que les impressions sont correctement enregistrées.
Conditions préalables
Avant de pouvoir utiliser cette fonctionnalité, vous devez intégrer le SDK de Braze. Cependant, aucune configuration supplémentaire n’est nécessaire.
Créer une boîte de réception avec Content Cards pour le Web
Nous testons actuellement ce nouveau format de tutoriel. Nous vous invitons à nous faire part de vos commentaires, https://docs.google.com/forms/d/e/1FAIpQLSe_5uhWM7eXXk9F_gviO_pvA4rkYO3WA9B6tNJZ3TY91md5bw/viewform?usp=pp_url&entry.569173304=General+Feedbackcar ils nous aideront à améliorer les prochains guides.
1. Activer le débogage (facultatif)
Pour faciliter la résolution des problèmes lors du développement, pensez à activer le débogage. Vous pouvez également exécuter les méthodes du SDK Web de Braze dans la console.
2. Créer l’interface utilisateur {#2-build-the-ui}
Créez une interface utilisateur pour la page de la boîte de réception. Ici, nous créons une page HTML basique qui inclut un div avec l’identifiant cards-list. Celui-ci sert de conteneur cible pour le rendu des Content Cards.
3. S’abonner aux mises à jour des Content Cards
Abonnez-vous à l’écouteur des Content Cards pour recevoir les dernières mises à jour, puis appelez requestContentCardsRefresh() pour demander les Content Cards les plus récentes pour cet utilisateur. Vous pouvez également appeler l’abonné avant openSession() pour un rafraîchissement automatique au démarrage de la session.
4. Créer les éléments de la boîte de réception {#4-build-the-inbox-elements}
L’utilisation des attributs des Content Cards tels que title, description et url vous permet d’afficher des Content Cards adaptées à vos besoins spécifiques en matière d’interface utilisateur.
5. Suivre les impressions et les clics
Vous pouvez enregistrer les impressions et les clics à l’aide des méthodes logContentCardImpressions et logContentCardClick disponibles pour les Content Cards.
De plus, vous pouvez utiliser logCardDismissal pour les fermetures.
Les impressions ne doivent être enregistrées qu’une seule fois lorsqu’elles sont consultées par l’utilisateur. Ici, un IntersectionObserver associé à un Set indexé par card.id empêche la duplication des enregistrements. Notez qu’il peut être nécessaire de prendre en compte le cycle de vie de l’interface utilisateur de votre application, ainsi que le cas d’utilisation, afin de garantir que les impressions sont correctement enregistrées.