Skip to content

デフォルトのコンテンツカードフィードのカスタマイズ

コンテンツカードフィードは、モバイルまたは Web アプリケーションの一連のコンテンツカードです。この記事では、フィードの更新時の設定、カードの順序、複数フィードの管理、「空のフィード」エラーメッセージについて説明します。コンテンツカードで使用するカスタマイズオプションのタイプの基本的な概要については、カスタマイズの概要を参照してください。

フィードの更新

デフォルトでは、コンテンツカードフィードは次の場合に自動的に更新されます。

  1. 新しいセッションが開始される場合
  2. フィードが開かれ、最後の更新から 60 秒以上経過した場合

SDK は、特定の時間に手動で更新するように設定することもできます。

Android SDK からrequestContentCardsRefresh を呼び出すことで、いつでも手動で Braze コンテンツカードの更新を要求します。

Braze.ContentCards クラスでrequestRefresh メソッドを呼び出すことで、いつでも Swift SDK から Braze コンテンツカードの手動更新を要求します。

Swift では、オプションの補完ハンドラまたはネイティブの Swift concurrency API を使用した非同期リターンを使用して、コンテンツカードを更新できます。

完了ハンドラ

非同期/待機

Web SDK からrequestContentCardsRefresh() を呼び出して、いつでも手動で Braze コンテンツカードのリフレッシュを要求します。

また、getCachedContentCards を呼び出して、最新のコンテンツカード更新から現在利用可能なすべてのカードを取得することもできます。

表示されるカードの順序をカスタマイズする

コンテンツカードの表示順序を変更できます。これにより、時間的制約のあるプロモーションなど、特定のタイプのコンテンツに優先順位を付けることで、ユーザーエクスペリエンスを微調整できます。

ContentCardsFragment は、IContentCardsUpdateHandler に依存して、フィードに表示される前にコンテンツカードのソートまたは変更を処理します。カスタム更新ハンドラは、ContentCardsFragmentsetContentCardUpdateHandler で設定できます。

以下はデフォルトのIContentCardsUpdateHandlerであり、カスタマイズの開始点として使用できます。

ContentCardsFragmentソースは GitHub にあります。

Jetpack Compose でコンテンツカードをフィルタリングおよびソートするには、cardUpdateHandlerパラメータを設定します。以下に例を示します。

静的なAttributes.defaults 変数を直接変更して、カードフィードの順序をカスタマイズします。

BrazeContentCardUI.ViewController.Attributes によるカスタマイズは Objective-C では使用できません。

showContentCards():filterFunction パラメーターを使用して、フィードのコンテンツカードの表示順序をカスタマイズします。以下に例を示します。

「空のフィード」メッセージのカスタマイズ

ユーザーがコンテンツカードに適格でない場合、SDK は次のような「空のフィード」エラーメッセージを表示します。「更新はありません。後で再度確認してください。」この「空のフィード」エラーメッセージは、次のようにカスタマイズできます。

「これはカスタムの空状態のメッセージです。」と表示される空のフィードエラーメッセージ

ContentCardsFragment によって、ユーザがコンテンツカードに対応していないと判断された場合は、空のフィードエラーメッセージが表示されます。

特殊なアダプタEmptyContentCardsAdapter は、標準のContentCardAdapter を置き換えてこのエラーメッセージを表示します。カスタムメッセージ自体を設定するには、文字列リソースcom_braze_feed_emptyを上書きします。

このメッセージを表示するために使用されるスタイルは、Braze.ContentCardsDisplay.Empty で見つけることができ、次のコードスニペットで再現されます。

コンテンツカードスタイル要素のカスタマイズの詳細については、スタイルのカスタマイズを参照してください。

Jetpack Compose で「空のフィード」エラーメッセージをカスタマイズするには、emptyStringContentCardsListに渡します。emptyTextStyleContentCardListStylingに渡して、このメッセージをさらにカスタマイズすることもできます。

代わりに表示するコンポーザブルがある場合は、emptyComposableContentCardsListに渡します。emptyComposableを指定した場合、emptyStringは使用されません。

関連するAttributes を設定して、ビューコントローラーの空の状態をカスタマイズします。

空のコンテンツカードフィードに自動的に表示される言語を変更するには、アプリのContentCardsLocalizable.strings ファイルでローカライズ可能なコンテンツカード文字列を再定義します。

Web SDK では、「空のフィード」の言語をプログラムで置き換えることはできません。フィードが表示されるたびに置き換えることを選択できますが、フィードが更新され、空のフィードテキストがすぐに表示されないため、これはお勧めしません。

複数のフィード

コンテンツカードは、特定のカードのみが表示されるようにアプリでフィルタリングできます。これにより、さまざまなユースケースで複数のコンテンツカードフィードを使用できます。たとえば、トランザクションフィードとマーケティングフィードの両方を維持できます。これを行うには、Braze ダッシュボードでキーと値のペアを設定して、コンテンツカードのさまざまなカテゴリーを作成します。次に、これらのタイプのコンテンツカードを異なる方法で処理し、一部のタイプをフィルタリングして他のタイプを表示するフィードをアプリまたはサイトに作成します。

ステップ 1:カードにキーと値のペアを設定する

コンテンツカードキャンペーンを作成する場合は、各カードでキーと値のペアデータを設定します。このキーと値のペアを使用して、カードを分類します。キーと値のペアは、カードのデータモデルのextrasプロパティに保存されます。

この例では、カードが表示されるコンテンツカードフィードを指定するキーfeed_typeを使用してキーと値のペアを設定します。この値は、home_screenmarketingなど、カスタムフィードの値になります。

ステップ2:コンテンツカードのフィルタリング

キーと値のペアが割り当てられたら、他のタイプのカードを表示およびフィルタリングするカードを表示するロジックを含むフィードを作成します。この例では、feed_type: "Transactional"のキーと値のペアが一致するカードのみを表示します。

コンテンツカードのフィルタリングは、Card.getExtras() を介してダッシュボードに設定されたキーと値のペアを読み取り、カスタム更新ハンドラを使用してフィルタリング (または他の必要なロジックを実行) することで実現できます。

詳細に説明すると、コンテンツカードフィードがContentCardsFragment に表示されます。デフォルトのIContentCardsUpdateHandlerは、Braze SDK からContentCardsUpdatedEvent を受け取り、表示するカードのリストを返しますが、カードの並べ替えのみを行い、それ自体は削除やフィルタリングを実行しません。

ContentCardsFragmentでフィルタリングできるようにするには、カスタムのIContentCardsUpdateHandler を作成します。このIContentCardsUpdateHandlerを変更して、前に設定したfeed_typeの目的の値と一致しないカードをリストから削除します。以下に例を示します。

IContentCardsUpdateHandlerを作成したら、それを使用するContentCardsFragmentを作成します。このカスタムフィードは、他のContentCardsFragmentと同様に使用できます。アプリのさまざまな部分で、ダッシュボードに用意されているキーに基づいて、さまざまなコンテンツカードフィードを表示します。各ContentCardsFragmentフィードには、各フラグメントのカスタムIContentCardsUpdateHandlerのおかげで一意のカードセットが表示されます。

以下に例を示します。

このフィードに表示されるコンテンツカードをフィルタリングするには、cardUpdateHandlerを使用します。以下に例を示します。

次の例では、Transactionalタイプカードのコンテンツカードフィードを示します。

さらに一歩進むために、ビューコントローラーに表示されるカードは、transformプロパティをAttributes構造体に設定して、条件でフィルタリングされたカードのみを表示することでフィルタリングできます。

次の例では、Transactionalタイプカードのコンテンツカードフィードを示します。

次に、カスタムフィードのトグルを設定できます。

詳細については、SDK メソッドドキュメント を参照してください。

「このページはどの程度役に立ちましたか?」
New Stuff!