Skip to content

Enregistrer les analyses

Lors de la création d’une interface utilisateur personnalisée pour les Content Cards, vous devez enregistrer manuellement les données analytiques telles que les impressions, les clics et les rejets, car cela n’est géré automatiquement que pour les modèles de cartes par défaut. L’enregistrement de ces événements fait partie intégrante de l’intégration des Content Cards et est essentiel pour garantir l’exactitude des rapports et de la facturation des Campaigns. Pour ce faire, alimentez votre interface utilisateur personnalisée avec les données provenant des modèles de données Braze, puis enregistrez manuellement les événements. Une fois que vous avez compris comment enregistrer les analyses, vous pouvez découvrir les façons courantes dont les clients de Braze créent des Content Cards personnalisées.

Enregistrement des données analytiques

Lors du déploiement de vos Content Cards personnalisées, vous pouvez analyser les objets Content Card et extraire les données de leur payload, telles que title, cardDescription et imageUrl. Vous pouvez ensuite utiliser les données du modèle obtenu pour alimenter votre interface utilisateur personnalisée.

Pour obtenir les modèles de données des Content Cards, abonnez-vous aux mises à jour des Content Cards. Deux propriétés méritent une attention particulière :

  • id : Représente la chaîne d’identifiant de la Content Card. Il s’agit de l’identifiant unique utilisé pour enregistrer les données analytiques des Content Cards personnalisées.
  • extras : Englobe toutes les paires clé-valeur du tableau de bord de Braze.

Toutes les propriétés en dehors de id et extras sont facultatives à analyser pour les Content Cards personnalisées. Pour plus d’informations sur le modèle de données, consultez l’article d’intégration de chaque plateforme : Android, iOS, Web.

Enregistrez une fonction de rappel pour vous abonner aux mises à jour lorsque les cartes sont actualisées.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

import * as braze from "@braze/web-sdk";

braze.subscribeToContentCardsUpdates((updates) => {
  const cards = updates.cards;
// For example:
  cards.forEach(card => {
    if (card.isControl) {
      // Do not display the control card, but remember to call `logContentCardImpressions([card])`
    }
    else if (card instanceof braze.ClassicCard || card instanceof braze.CaptionedImage) {
      // Use `card.title`, `card.imageUrl`, etc.
    }
    else if (card instanceof braze.ImageOnly) {
      // Use `card.imageUrl`, etc.
    }
  })
});

braze.openSession();

Étape 1 : Créer une variable d’abonnement privée

Pour vous abonner aux mises à jour des cartes, déclarez d’abord une variable privée dans votre classe personnalisée pour contenir votre abonné :

1
2

// subscriber variable
private IEventSubscriber<ContentCardsUpdatedEvent> mContentCardsUpdatedSubscriber;

Étape 2 : S’abonner aux mises à jour

Ensuite, ajoutez le code suivant pour vous abonner aux mises à jour des Content Cards depuis Braze, généralement dans la méthode Activity.onCreate() de votre activité Content Cards personnalisée :

1
2
3
4
5
6
7
8
9
10
11
12
13

// Remove the previous subscriber before rebuilding a new one with our new activity.
Braze.getInstance(context).removeSingleSubscription(mContentCardsUpdatedSubscriber, ContentCardsUpdatedEvent.class);
mContentCardsUpdatedSubscriber = new IEventSubscriber<ContentCardsUpdatedEvent>() {
    @Override
    public void trigger(ContentCardsUpdatedEvent event) {
        // List of all Content Cards
        List<Card> allCards = event.getAllCards();

        // Your logic below
    }
};
Braze.getInstance(context).subscribeToContentCardsUpdates(mContentCardsUpdatedSubscriber);
Braze.getInstance(context).requestContentCardsRefresh();

Étape 3 : Se désabonner

Nous recommandons également de vous désabonner lorsque votre activité personnalisée n’est plus visible. Ajoutez le code suivant à la méthode de cycle de vie onDestroy() de votre activité :

1

Braze.getInstance(context).removeSingleSubscription(mContentCardsUpdatedSubscriber, ContentCardsUpdatedEvent.class);

Étape 1 : Créer une variable d’abonnement privée

Pour vous abonner aux mises à jour des cartes, déclarez d’abord une variable privée dans votre classe personnalisée pour contenir votre abonné :

1

private var contentCardsUpdatedSubscriber: IEventSubscriber<ContentCardsUpdatedEvent>? = null

Étape 2 : S’abonner aux mises à jour

Ensuite, ajoutez le code suivant pour vous abonner aux mises à jour des Content Cards depuis Braze, généralement dans la méthode Activity.onCreate() de votre activité Content Cards personnalisée :

1
2
3
4
5
6
7
8
9
10

// Remove the previous subscriber before rebuilding a new one with our new activity.
Braze.getInstance(context).removeSingleSubscription(contentCardsUpdatedSubscriber, ContentCardsUpdatedEvent::class.java)
contentCardsUpdatedSubscriber = IEventSubscriber { event ->
  // List of all Content Cards
  val allCards = event.allCards

  // Your logic below
}
Braze.getInstance(context).subscribeToContentCardsUpdates(contentCardsUpdatedSubscriber)
Braze.getInstance(context).requestContentCardsRefresh(true)

Étape 3 : Se désabonner

Nous recommandons également de vous désabonner lorsque votre activité personnalisée n’est plus visible. Ajoutez le code suivant à la méthode de cycle de vie onDestroy() de votre activité :

1

Braze.getInstance(context).removeSingleSubscription(contentCardsUpdatedSubscriber, ContentCardsUpdatedEvent::class.java)

Pour accéder au modèle de données des Content Cards, appelez contentCards.cards sur votre instance braze.

1

let cards: [Braze.ContentCard] = AppDelegate.braze?.contentCards.cards

De plus, vous pouvez également maintenir un abonnement pour observer les changements dans vos Content Cards. Vous pouvez le faire de deux manières :

  1. En maintenant un cancellable ; ou
  2. En maintenant un AsyncStream.

Cancellable

1
2
3
4
5
6

// This subscription is maintained through a Braze cancellable, which will observe for changes until the subscription is cancelled.
// You must keep a strong reference to the cancellable to keep the subscription active.
// The subscription is canceled either when the cancellable is deinitialized or when you call its `.cancel()` method.
let cancellable = AppDelegate.braze?.contentCards.subscribeToUpdates { [weak self] contentCards in
  // Implement your completion handler to respond to updates in `contentCards`.
}

AsyncStream

1

let stream: AsyncStream<[Braze.ContentCard]> = AppDelegate.braze?.contentCards.cardsStream

Accesseurs de snapshot non bloquants

Utilisez ces méthodes pour lire l’état mis en cache actuel sans bloquer le thread appelant. Chaque gestionnaire de complétion est toujours livré sur le thread principal.

1
2
3
4
5
6
7
8
9
10
11
12
13
14

// All cached cards.
AppDelegate.braze?.contentCards.getCachedContentCards { cards in
  // Use `cards` here.
}

// Unviewed cards only (excludes control cards).
AppDelegate.braze?.contentCards.getUnviewedCards { cards in
  // Use `cards` here.
}

// Date of the last server sync for the current user (nil until the first sync completes).
AppDelegate.braze?.contentCards.getLastUpdate { date in
  // Use `date` here.
}

1

NSArray<BRZContentCardRaw *> *contentCards = AppDelegate.braze.contentCards.cards;

De plus, si vous souhaitez maintenir un abonnement à vos Content Cards, vous pouvez appeler subscribeToUpdates :

1
2
3
4

// This subscription is maintained through Braze cancellable, which will continue to observe for changes until the subscription is cancelled.
BRZCancellable *cancellable = [self.braze.contentCards subscribeToUpdates:^(NSArray<BRZContentCardRaw *> *contentCards) {
  // Implement your completion handler to respond to updates in `contentCards`.
}];

Pour lire l’état mis en cache actuel sans bloquer le thread appelant, utilisez les méthodes suivantes. Chaque gestionnaire de complétion est livré sur le thread principal.

1
2
3
4
5
6
7
8
9
10
11
12
13
14

// All cached cards.
[AppDelegate.braze.contentCards getCachedContentCardsWithCompletion:^(NSArray<BRZContentCardRaw *> *cards) {
  // Use `cards` here.
}];

// Unviewed cards only (excludes control cards).
[AppDelegate.braze.contentCards getUnviewedCardsWithCompletion:^(NSArray<BRZContentCardRaw *> *cards) {
  // Use `cards` here.
}];

// Date of the last server sync for the current user (nil until the first sync completes).
[AppDelegate.braze.contentCards getLastUpdateWithCompletion:^(NSDate * _Nullable date) {
  // Use `date` here.
}];

Pour écouter les mises à jour, abonnez-vous aux événements de mise à jour des Content Cards :

1
2
3
4
5
6
7
8
9
10

const subscription = Braze.addListener(Braze.Events.CONTENT_CARDS_UPDATED, (update) => {
  const cards = update.cards;
  cards.forEach(card => {
    if (card.isControl) {
      // Do not display the control card, but remember to log an impression
    } else {
      // Use card.title, card.cardDescription, card.image, etc.
    }
  });
});

Pour obtenir les données de Content Cards les plus récemment mises en cache :

1
2
3

import Braze from "@braze/react-native-sdk";

const cachedCards = await Braze.getCachedContentCards();

Pour demander une actualisation manuelle des Content Cards depuis les serveurs Braze :

1

Braze.requestContentCardsRefresh();

Enregistrement des événements

L’enregistrement d’indicateurs importants tels que les impressions, les clics et les fermetures est rapide et simple. Définissez un écouteur de clic personnalisé pour gérer manuellement ces données analytiques.

Enregistrez les événements d’impression lorsque les cartes sont consultées par les utilisateurs à l’aide de logContentCardImpressions :

1
2
3

import * as braze from "@braze/web-sdk";

braze.logContentCardImpressions([card1, card2, card3]);

Enregistrez les événements de clic sur les cartes lorsque les utilisateurs interagissent avec une carte à l’aide de logContentCardClick :

1
2
3

import * as braze from "@braze/web-sdk";

braze.logContentCardClick(card);

Le BrazeManager peut référencer les dépendances du SDK Braze telles que la liste de tableaux d’objets Content Card pour obtenir l’objet Card et appeler les méthodes d’enregistrement de Braze. Utilisez la classe de base ContentCardable pour référencer et fournir facilement des données au BrazeManager.

Pour enregistrer une impression ou un clic sur une carte, appelez respectivement Card.logClick() ou Card.logImpression().

Vous pouvez enregistrer manuellement ou marquer une Content Card comme « fermée » dans Braze pour une carte particulière avec isDismissed. Si une carte est déjà marquée comme fermée, elle ne peut pas être marquée comme fermée à nouveau.

Pour créer un écouteur de clic personnalisé, créez une classe qui implémente IContentCardsActionListener et enregistrez-la auprès de BrazeContentCardsManager. Implémentez la méthode onContentCardClicked(), qui sera appelée lorsque l’utilisateur clique sur une Content Card. Ensuite, indiquez à Braze d’utiliser votre écouteur de clic pour les Content Cards.

Par exemple :

1
2
3
4
5
6
7
8
9
10
11

BrazeContentCardsManager.getInstance().setContentCardsActionListener(new IContentCardsActionListener() {
  @Override
  public boolean onContentCardClicked(Context context, Card card, IAction cardAction) {
    return false;
  }

  @Override
  public void onContentCardDismissed(Context context, Card card) {

  }
});

Par exemple :

1
2
3
4
5
6
7
8
9

BrazeContentCardsManager.getInstance().contentCardsActionListener = object : IContentCardsActionListener {
  override fun onContentCardClicked(context: Context, card: Card, cardAction: IAction): Boolean {
    return false
  }

  override fun onContentCardDismissed(context: Context, card: Card) {

  }
}

Implémentez le protocole BrazeContentCardUIViewControllerDelegate et définissez votre objet délégué comme propriété delegate de votre BrazeContentCardUI.ViewController. Ce délégué se chargera de transmettre les données de votre objet personnalisé à Braze pour enregistrement. Pour un exemple, consultez le tutoriel sur l’interface utilisateur des Content Cards.

1
2
3
4
5
6
7
8
9
10
11
12

// Set the delegate when creating the Content Cards controller
contentCardsController.delegate = delegate

// Method to implement in delegate
func contentCard(
    _ controller: BrazeContentCardUI.ViewController,
    shouldProcess clickAction: Braze.ContentCard.ClickAction,
    card: Braze.ContentCard
  ) -> Bool {
  // Intercept the content card click action here.
  return true
}

1
2
3
4
5
6
7
8
9
10

// Set the delegate when creating the Content Cards controller
contentCardsController.delegate = delegate;

// Method to implement in delegate
- (BOOL)contentCardController:(BRZContentCardUIViewController *)controller
                shouldProcess:(NSURL *)url
                         card:(BRZContentCardRaw *)card {
  // Intercept the content card click action here.
  return YES;
}

Enregistrez les événements d’impression lorsque les cartes sont consultées par les utilisateurs :

1

Braze.logContentCardImpression(card.id);

Enregistrez les événements de clic sur les cartes lorsque les utilisateurs interagissent avec une carte :

1

Braze.logContentCardClicked(card.id);

Enregistrez les événements de fermeture lorsqu’un utilisateur ferme une carte :

1

Braze.logContentCardDismissed(card.id);

Gestion du comportement au clic

Lorsqu’un utilisateur clique sur une Content Card dans un flux personnalisé, le comportement au clic (comme la navigation vers une URL, le deep linking ou l’enregistrement d’un événement personnalisé) n’est pas géré automatiquement. Utilisez handleBrazeAction pour traiter l’URL de la carte et exécuter l’action au clic configurée, y compris les actions Braze (URLs brazeActions://).

1
2
3
4
5
6
7
8
9
10
11
12

import * as braze from "@braze/web-sdk";

// In your card click handler
function onCardClick(card) {
  // Log the click
  braze.logContentCardClick(card);

  // Handle the on-click behavior
  if (card.url) {
    braze.handleBrazeAction(card.url);
  }
}
Paramètre Description
url Une URL valide, ou une URL d’action Braze valide avec le schéma brazeActions://.
openLinkInNewTab (Facultatif) Indique si l’URL doit s’ouvrir dans un nouvel onglet. La valeur par défaut est false.

Le comportement au clic est géré automatiquement par l’interface utilisateur par défaut des Content Cards. Pour les implémentations personnalisées, utilisez l’interface IContentCardsActionListener décrite dans Enregistrement de l’analytique.

Le comportement au clic est géré automatiquement par l’interface utilisateur par défaut des Content Cards. Pour les implémentations personnalisées, utilisez le protocole BrazeContentCardUIViewControllerDelegate décrit dans Enregistrement de l’analytique.

Lorsqu’un utilisateur clique sur une Content Card dans un flux personnalisé, le comportement au clic n’est pas géré automatiquement. Après avoir enregistré le clic avec Braze.logContentCardClicked(cardId), appelez Braze.processContentCardClickAction(cardId) pour traiter les deep links, les URLs et les actions brazeActions://. Pour la référence des méthodes, consultez Content Cards React Native.

1
2
3
4
5
6
7
8
9

import Braze from "@braze/react-native-sdk";

function onCardPress(card) {
  Braze.logContentCardClicked(card.id);

  if (card.url) {
    Braze.processContentCardClickAction(card.id);
  }
}

Rejets uniques supérieurs aux impressions uniques

Si les rejets uniques dépassent les impressions uniques, votre intégration personnalisée de Content Cards a enregistré des rejets sans enregistrer les impressions pour ces mêmes cartes. L’interface par défaut des Content Cards de Braze enregistre les deux automatiquement, ce décalage n’apparaît donc que lorsque vous utilisez une interface personnalisée.

Enregistrez une impression chaque fois que vous affichez une carte, et enregistrez un rejet lorsque l’utilisateur la ferme. Pour les noms de méthodes et des exemples, consultez les sections par plateforme ci-dessous.

Analyses manquantes pour les Content Cards

Si les Content Cards s’affichent correctement dans votre application mais que vous ne recevez systématiquement aucune donnée analytique (impressions, clics, etc.), il s’agit probablement d’un problème d’intégration SDK.

  • Vues personnalisées de Content Cards (Android, iOS, Web) : L’interface par défaut de Braze enregistre automatiquement les impressions et les clics sur toutes les plateformes. Si vous utilisez une vue ou un déploiement personnalisé de Content Cards, vous devez appeler explicitement les méthodes d’enregistrement appropriées dans votre application. Consultez Enregistrer les analyses pour votre plateforme. Pour les déploiements Web personnalisés en particulier, vérifiez que le SDK Web de Braze est chargé, consultez la console du navigateur pour détecter d’éventuelles erreurs et assurez-vous que les données des cartes sont bien reçues.
  • Initialisation du SDK et identification de l’utilisateur : Assurez-vous que le SDK est entièrement initialisé avant d’afficher les cartes. Les événements sont silencieusement ignorés (et non mis en file d’attente) si le SDK n’est pas initialisé, s’il est en mode d’initialisation différée ou s’il est désactivé pour le RGPD. Le SDK enregistre bien les analyses pour les utilisateurs anonymes, mais les indicateurs du tableau de bord comme « impressions quotidiennes uniques » nécessitent une identité utilisateur résolue. Appelez donc changeUser avant l’affichage des cartes dans la mesure du possible.

ID de Content Card

Chaque envoi d’une Campaign à un destinataire génère un nouvel ID de Content Card. Si le même utilisateur reçoit la Campaign à nouveau lors d’un envoi ultérieur, Braze attribue un nouvel ID. Référencez l’id de la carte lorsque vous enregistrez les impressions, les clics et les rejets dans vos déploiements personnalisés.
New Stuff!