Skip to content

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

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

キーと値のペア

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

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

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

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

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

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

右の例は、ローカルデータとBrazeを活用したContent Cardsによるハイブリッドなアイテムリストを持つフィードを示しています。これにより、Content Cardsは既存のコンテンツと区別がつかなくなります。

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

APIトリガーCampaignは、カードの値が外部要因に依存してユーザーに表示するコンテンツを決定する場合に使用するのに適した戦略です。たとえば、補足的なコンテンツを表示するには、Liquidを使用してキーと値のペアを設定します。なお、class_typeはセットアップ時に把握しておく必要があります。

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

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

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

Content Cardsを活用して、ユーザーのためのダイナミックでインタラクティブな体験を作成できます。右の例では、Content Cardのポップアップがチェックアウト時に表示され、ユーザーに最新のプロモーションを提供しています。このようなカードをうまく配置することで、ユーザーを特定のアクションに「後押し」することができます。

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

Content Cardsバッジ

Brazeのサンプルアプリ「Swifty」が表示されたiPhoneのホーム画面に、赤いバッジで数字の7が表示されている

バッジは小さなアイコンで、ユーザーの注意を引くのに最適です。バッジを使って新しい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プロパティに基づいてカードの数をフィルタリングします。

1
func applicationDidEnterBackground(_ application: UIApplication)

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

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

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

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!