分析のロギング
コンテンツカードを完全にカスタマイズして表示したい場合は、独自のコンテンツカードプレゼンテーション UI を実装できます。ただし、インプレッション、クリック、離脱などのデータは、デフォルトのカードモデルを使用する場合にのみ自動的に処理されます。完全なカスタム UI を実装する場合、このデータを手動で処理する必要があります。そのためには、カスタム UI に Braze データモデルのデータを入力し、インプレッションやクリックなどの分析を手動で記録します。分析の記録方法を理解したら、Braze の顧客がカスタムコンテンツカードを作成する一般的な方法がわかります。
カード更新のリスニング
カスタムコンテンツカードを実装する場合、コンテンツカードオブジェクトを解析して、title、cardDescription、imageUrlなどのペイロードデータを抽出できます。その後、生成されたモデルデータを使用してカスタム UI を作成できます。
コンテンツカードデータモデルを入手するには、コンテンツカードの更新を購読します。特に注意すべきプロパティが2つあります。
id:コンテンツカード ID の文字列を表します。これは、カスタムコンテンツカードの分析を記録するために使用される一意の識別子です。extras:Braze ダッシュボードのすべてのキーと値のペアが含まれます。
カスタムコンテンツカードではidおよびextras以外のすべてのプロパティの解析は任意です。データモデルの詳細については、Android、iOS、Web の各プラットフォームの統合記事を参照してください。
ステップ1:プライベートサブスクライバー変数を作成する
カード更新を購読するには、まずカスタムクラスでサブスクライバーを保持するプライベート変数を宣言します。
1
2
// subscriber variable
private IEventSubscriber<ContentCardsUpdatedEvent> mContentCardsUpdatedSubscriber;
ステップ2:更新を購読する
次に、通常はカスタムコンテンツカードアクティビティのActivity.onCreate()内で、以下のコードを追加して、Braze のコンテンツカードの更新を購読します。
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();
ステップ3:購読解除
また、カスタムアクティビティが表示されなくなったら、購読を解除することをおすすめします。アクティビティのonDestroy()ライフサイクルメソッドに次のコードを追加します。
1
Braze.getInstance(context).removeSingleSubscription(mContentCardsUpdatedSubscriber, ContentCardsUpdatedEvent.class);
ステップ1:プライベートサブスクライバー変数を作成する
カード更新を購読するには、まずカスタムクラスでサブスクライバーを保持するプライベート変数を宣言します。
1
private var contentCardsUpdatedSubscriber: IEventSubscriber<ContentCardsUpdatedEvent>? = null
ステップ2:更新を購読する
次に、通常はカスタムコンテンツカードアクティビティのActivity.onCreate()内で、以下のコードを追加して、Braze のコンテンツカードの更新を購読します。
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).subscribeToContentCardsUpdates(contentCardsUpdatedSubscriber)
Braze.getInstance(context).requestContentCardsRefresh()
// List of all Content Cards
val allCards = event.allCards
// Your logic below
}
Braze.getInstance(context).subscribeToContentCardsUpdates(mContentCardsUpdatedSubscriber)
Braze.getInstance(context).requestContentCardsRefresh(true)
ステップ3:購読解除
また、カスタムアクティビティが表示されなくなったら、購読を解除することをおすすめします。アクティビティのonDestroy()ライフサイクルメソッドに次のコードを追加します。
1
Braze.getInstance(context).removeSingleSubscription(contentCardsUpdatedSubscriber, ContentCardsUpdatedEvent::class.java)
コンテンツカードデータモデルにアクセスするには、brazeインスタンスのcontentCards.cards を呼び出します。
1
let cards: [Braze.ContentCard] = AppDelegate.braze?.contentCards.cards
さらに、購読を維持して、コンテンツカードの変更を観察することもできます。これには次の2つの方法があります。
- キャンセル可能な状態を維持する。または、
AsyncStreamを維持する。
キャンセル可能
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
1
NSArray<BRZContentCardRaw *> *contentCards = AppDelegate.braze.contentCards.cards;
さらに、コンテンツカードの購読を維持する場合は、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`.
}];
カードが更新されたときに更新を購読するコールバック関数を登録します。
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();
コンテンツカードは、openSession()の前にサブスクライブリクエストが呼び出された場合にのみ、セッション開始時に更新されます。フィードを手動で更新することもいつでも選択できます。
イベントのロギング
インプレッション、クリック、離脱などの貴重な指標を素早く簡単に記録できます。これらの分析を手動で処理するようにカスタムクリックリスナーを設定します。
BrazeManager は、コンテンツカードオブジェクト配列リストなどの Braze SDK 依存関係を参照して、Cardに Braze ロギングメソッドを呼び出させることができます。ContentCardable基本クラスを使用すると、BrazeManagerへのデータの参照や提供が容易になります。
インプレッションやカードのクリックを記録するには、Card.logClick() またはCard.logImpression() をそれぞれ呼び出します。
isDismissed を使用して、Braze の特定のコンテンツカードを手動で「却下」として記録したり設定したりできます。カードがすでに却下済みとしてマークされている場合、そのカードを再度却下済みとしてマークすることはできません。
カスタムクリックリスナーを作成するには、IContentCardsActionListener を実装するクラスを作成してBrazeContentCardsManagerに登録します。ユーザーがコンテンツカードをクリックしたときに呼び出されるonContentCardClicked() メソッドを実装します。次に、コンテンツカードクリックリスナーを使用するよう Braze に指示します。
以下に例を示します。
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) {
}
});
以下に例を示します。
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) {
}
}
カスタム UI でコントロールバリアントコンテンツカードを処理するには、com.braze.models.cards.Card を渡した後、他のコンテンツカードタイプと同様に logImpression メソッドを呼び出します。オブジェクトはコントロールインプレッションを暗黙的にログに記録して、ユーザーがいつコントロールカードを表示したかを分析に通知します。
BrazeContentCardUIViewControllerDelegate プロトコルを実装し、デリゲートオブジェクトをBrazeContentCardUI.ViewControllerのdelegateプロパティとして設定します。このデリゲートは、カスタムオブジェクトのデータを Braze に渡してログに記録するように処理します。例については、コンテンツカードUIチュートリアル を参照してください。
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;
}
カスタム UI でコントロールバリアントコンテンツカードを処理するには、Braze.ContentCard.Control を渡した後、他のコンテンツカードタイプと同様に logImpression メソッドを呼び出します。オブジェクトはコントロールインプレッションを暗黙的にログに記録して、ユーザーがいつコントロールカードを表示したかを分析に通知します。
logContentCardImpressions 以下を使用して、ユーザーがカードを閲覧したときのインプレッションイベントをログに記録します。
1
2
3
import * as braze from "@braze/web-sdk";
braze.logContentCardImpressions([card1, card2, card3]);
logContentCardClick を使用して、ユーザーがカードを操作したときのカードクリックイベントをログに記録します。
1
2
3
import * as braze from "@braze/web-sdk";
braze.logContentCardClick(card);
GitHub でこのページを編集