Skip to content

Content Cardsの動作をカスタマイズする

この実装ガイドでは、Content Cardsの動作の変更、ペイロードへのキーと値のペアなどの追加、一般的なカスタマイズのレシピについて説明します。Content Cardsタイプの完全なリストについては、Content Cardsについてを参照してください。

キーと値のペア

Brazeでは、キーと値のペアを使用して、Content Cardsを通じてユーザーデバイスに追加のデータペイロードを送信できます。これらは内部メトリクスの追跡、アプリコンテンツの更新、プロパティのカスタマイズに役立ちます。ダッシュボードを使用してキーと値のペアを追加します

キーと値のペアは、card オブジェクトにextrasとして保存されます。これらを使用して、アプリケーションでさらに処理するためのデータをカードとともに送信できます。これらの値にアクセスするにはcard.extrasを呼び出します。

キーと値のペアは、card オブジェクトにextrasとして保存されます。これらを使用して、アプリケーションでさらに処理するためのデータをカードとともに送信できます。これらの値にアクセスするにはcard.extras を呼び出します。

キーと値のペアは、card オブジェクトにextrasとして保存されます。これらを使用して、アプリケーションでさらに処理するためのデータをカードとともに送信できます。これらの値にアクセスするにはcard.extras を呼び出します。

補足コンテンツとしてのContent Cards

ローカルデータとBraze Content Cardsを組み合わせたハイブリッドリストのフィード。

Content Cardsを既存のフィードにシームレスにブレンドして、複数のフィードからのデータを同時に読み込むことができます。これにより、Braze Content Cardsと既存のフィードコンテンツが一体となった、まとまりのある調和したエクスペリエンスを実現できます。

付属の例では、ローカルデータとBrazeを活用したContent Cardsの両方から生成されたアイテムのハイブリッドリストを持つフィードを示しています。この方法により、Content Cardsは既存のコンテンツと見分けがつかないように表示できます。

APIトリガーのキーと値のペア

APIトリガーキャンペーンは、カードの値がユーザーに表示するコンテンツを決定するために外部要因に依存する場合に有効な戦略です。たとえば、補足コンテンツを表示するには、Liquidを使用してキーと値のペアを設定します。class_typeはセットアップ時に決定されている必要がある点に注意してください。

補足Content Cardsのユースケースのキーと値のペア。この例では、「tile_id」、「tile_deeplink」、「tile_title」など、カードのさまざまな要素がLiquidを使用して設定されています。

インタラクティブコンテンツとしてのContent Cards

画面の左下隅に50パーセントのプロモーションを表示するインタラクティブなContent Card。クリックすると、プロモーションがカートに適用されます。

Content Cardsを活用して、ユーザー向けにダイナミックなインタラクティブ体験を作成できます。この例では、チェックアウト時にContent カードのポップアップが表示され、ユーザーに直前のプロモーションを提供します。このように適切に配置されたカードは、ユーザーに特定のアクションを促す「ナッジ」を与える優れた方法です。

このユースケースのキーと値のペアには、希望の割引額として設定されたdiscount_percentageと、coupon_codeとして設定されたclass_typeが含まれます。これらのキーと値のペアにより、チェックアウト画面でタイプ固有のContent Cardsをフィルタリングして表示できます。キーと値のペアを使用して複数のフィードを管理する方法の詳細については、デフォルトのContent カードフィードのカスタマイズを参照してください。

チェックアウトプロモーションを表示するインタラクティブなContent Card。

Content Cardsバッジ

赤いバッジに数字の7が表示されたSwiftyというBrazeサンプルアプリが映ったiPhoneのホーム画面

バッジは、ユーザーの注意を引くのに最適な小さなアイコンです。バッジを使用して新しいContent Cardsのコンテンツをユーザーに通知することで、ユーザーをアプリに呼び戻し、セッションを増やすことができます。

未読Content Cards数をバッジとして表示する

未読Content Cardsの数をアプリのアイコンにバッジとして表示できます。

未読カード数は、以下を呼び出すことでいつでもリクエストできます。

1
braze.getCachedContentCards().getUnviewedCardCount();

この情報を使用して、未読Content Cardsの数を示すバッジを表示できます。詳細については、SDKリファレンスドキュメント を参照してください。

未読カード数は、以下を呼び出すことでいつでもリクエストできます。

1
Braze.getInstance(context).getContentCardUnviewedCount();
1
Braze.getInstance(context).contentCardUnviewedCount

この情報を使用して、未読Content Cardsの数を示すバッジを表示できます。詳細については、SDKリファレンスドキュメント を参照してください。

以下のサンプルでは、braze.contentCardsを使用して未読Content Cardsの数をリクエストし、表示します。アプリが閉じられてユーザーのセッションが終了した後、このコードはカード数をリクエストし、viewedプロパティに基づいてカード数をフィルタリングします。

UISceneライフサイクルを採用しているアプリ(Xcode 27以降でビルドされたアプリでは必須)では、AppDelegate.swiftapplicationDidEnterBackground(_:)ではなく、SceneDelegate.swiftsceneDidEnterBackground(_:)に実装する必要があります。

1
func sceneDidEnterBackground(_ scene: UIScene)

このメソッド内で、特定のセッション中にユーザーがカードを閲覧する間、バッジカウントをアクティブに更新する以下のコードを実装します。

1
2
let unreadCards = AppDelegate.braze?.contentCards.cards.filter { $0.viewed == false }
UIApplication.shared.applicationIconBadgeNumber = unreadCards?.count ?? 0
1
(void)sceneDidEnterBackground:(UIScene *)scene

このメソッド内で、特定のセッション中にユーザーがカードを閲覧する間、バッジカウントをアクティブに更新する以下のコードを実装します。

1
2
3
4
5
6
7
NSInteger unreadCardCount = 0;
for (BRZContentCardRaw *card in AppDelegate.braze.contentCards.cards) {
  if (card.viewed == NO) {
    unreadCardCount += 1;
  }
}
[UIApplication sharedApplication].applicationIconBadgeNumber = unreadCardCount;
New Stuff!