Flexcard にデータとアクションを表示する

学習の目的

この単元を完了すると、次のことができるようになります。

• 管理パッケージ用 Omnistudio のさまざまな Flexcard 要素について説明する。
  
• Block 要素の目的を説明する。
  
• Text 要素と Field 要素の目的を説明する。
  
• Icon 要素の目的を説明する。
  
• Menu 要素と Action 要素の目的を説明する。
  

Flexcard 要素

Flexcard をさらに深く理解しようと多くの方がワクワクしていると思いますので、さっそく見ていきましょう。  

このスクリーンショットの Flexcard には 2 つの個別の領域があります。左側の領域には、カスタマー取引先に関する取引先基本情報 (アイコン、タイトル、4 つの項目、アクションのメニュー) が表示されています。右側の領域には、以下の例では何も表示されていませんが、最終的には気象情報が表示されます。この単元では、取引先情報側に焦点を当てて説明します。

まず、Flexcard のデータとスタイルを取り除き、その下で要素がどのように動作するかを示します。

Block 要素

この Flexcard は 2 つの Block 要素で構成されています。Block 要素では、Flexcard 内のほかの要素の論理グループを結合します。Block を折りたたみ可能にすることで、そのコンテンツを非表示にしたり展開したりすることができます。別の Block の中に Block を配置することもできます。

Account Block には、いくつかの単純なユーザーインターフェース (UI) 要素 (Text、Icon、Menu UI 要素) があります。また、Flexcard のヘッダーとなる、Icon 要素と Text 要素をグループ化した別の Block も含まれています。

Text と Field 要素

この例では、Text 要素はデータソースから返されたデータ項目を追加するために使用されています。Text 要素では、リッチテキストエディターを使用してテキストと解析された差し込み項目を結合します。リッチテキストエディターは、テキストの各セクションに HTML div を追加して、Text 要素のレイアウトを作成します。この要素には、テキストの書式設定用の [Style (スタイル)] メニューもあります。 

Field 要素を使用して、データソースから返されたデータを Flexcard に表示することもできます。

この要素を使用してデータ項目を追加するには、2 つの方法があります。最も簡単なのは、[項目] リストから項目をキャンバスにドラッグする方法です。[項目] リストには、使用可能なデータ項目のリストが表示されます。

2 つ目の方法は、[Elements (要素)] リストから Field 要素をキャンバスにドラッグする方法です。Field 要素には、データ項目からの出力が表示されます。

[FIELD PROPERTIES (項目プロパティ)] には、[Field Type (項目種別)] 設定があり、適切な書式でデータを表示するのに役立ちます。たとえば、[日付] 項目種別に日付が適切な書式で表示されます。

Icon 要素

Icon 要素には、Salesforce Lightning Design System のアイコンライブラリからアクセスする Salesforce SVG アイコン、またはアップロードするカスタムアイコンが表示されます。

クリックしたときにアクションを実行するようにアイコンを設定できます。この機能は、Image、Block、Toggle 要素にもあります。

Menu と Action 要素

Menu 要素 (1) で、Flexcard 上のアクションのリストからメニューを作成します。メニューのドロップダウンにあるメニューボタンと各アクションにスタイルを設定します。この要素は、Flexcard に多くのアクションを追加したいが、カードを煩雑にしたくない場合に便利なオプションです。Action 要素 (2) で、テキストまたはクリックするとアクションが実行されるボタンを表示します。

使用可能なアクションには複数の種別があります。

カスタマイズ可能な Flexcard を使用すると、あらゆる種別の有益な情報を一目で確認できますね。次は、Flexcard に表示されるデータと追加する Action 要素にスタイルを設定する方法を学習しましょう。

リソース

• Salesforce ヘルプ: Flexcard Elements (Flexcard 要素) (管理パッケージ用 Omnistudio)