# Salesforce CMS ファイルをデータテーブルに表示する
## 概要
このチュートリアルでは、次の手順で使用する方法を案内します： [Avonni **データテーブル**](https://docs.avonnicomponents.com/experience-cloud/experience-cloud-ja/chtoriaru/konpnento/dtatburu) コンポーネントを使って、以下からファイルの一覧を表示します。 **Salesforce コンテンツ管理システム (CMS) コレクション**。テーブルの設定方法と各ファイルに対して「ダウンロード」ボタンを追加する方法を学びます。特に Experience Cloud サイト内でユーザーにシームレスな体験を提供します。
**学習内容：**
* Avonni データテーブルを Salesforce CMS コレクションに接続する方法。
* タイトルや作成日などのコンテンツ詳細を表示する列を設定する方法。
* 「ダウンロード」ボタンを含むカスタムアクション列を追加する方法。
* 次の **Download CMS** インタラクションを使用して、ファイルをユーザーがダウンロードできるようにする方法。
**前提条件：**
* 次のものが有効である必要があります： **Salesforce CMS コレクション** に1つ以上の公開されたコンテンツアイテム（例：PDF、画像）が含まれていること。
* 次のものが必要です： **18文字の ID** この CMS コレクションの。
***
## ガイド付き手順
{% stepper %}
{% step %}
### データテーブルコンポーネントを追加
まず、CMS ファイルの一覧を表示するデータテーブルを設定しましょう。
1. 左側の **コンポーネントライブラリ** パネルから、次の項目を見つけます： **Avonni データテーブル** コンポーネントをキャンバスにドラッグします。
{% endstep %}
{% step %}
### データソースを設定
次に、データテーブルを特定の Salesforce CMS コレクションに接続する必要があります。
1. データテーブルを選択した状態で、プロパティパネルにある次の項目を探します： **データソース** プロパティ。
2. 一覧から **CMS コレクション** をデータソースの種類として選択します。
3. 表示される **コレクション ID** フィールドに、次のものを入力します： **18文字の ID** あなたの Salesforce CMS コレクションまたはコンテンツキーの。
これでデータテーブルは接続され、コレクション内のコンテンツアイテムを認識します。
{% endstep %}
{% step %}
### コンテンツ情報を表示する列を追加
次に、ファイルのどの詳細をテーブルに表示するかを定義します。
1. データテーブルのプロパティで、次のセクションに移動します： **列** セクション。
2. をクリック **「列を追加」** して新しい列を作成します。
3. **ソースフィールド：** CMS コンテンツデータからフィールドを選択します（例： `タイトル`).
4. **列ラベル：** ユーザー向けの分かりやすいラベルを付けます（例：「ドキュメントタイトル」）。
5. この手順を繰り返して、作成日などの関連列を追加します（例： `CreatedDate` または `LastModifiedDate`.
{% endstep %}
{% step %}
### ダウンロードアクションを追加して設定
これは、ファイルをユーザーがアクセスできるようにするための最も重要な手順です。ファイル名に直接リンクできないため、専用のアクションボタンを作成します。
1. **アクション列を追加：** 表示される **列** データテーブルプロパティのセクションで、もう一度 **「列を追加」** をクリックします。列の設定で、その **タイプ** を **ボタン**.
2. **に設定します。**
* ボタンアイテムを設定：
* ボタン列のプロパティ内で、新しいボタンアイテムを追加します。 **次のような** ラベル
* を付けます：例えば「ダウンロード」や「ファイルを表示」など。 **アイコン名** を設定します（例： `utility:download`）視覚的な手がかりとして役立ちます。
3. **「Download CMS」インタラクションを作成：**
* 先ほど設定した「ダウンロード」アクションアイテムを選択します。
* その **インタラクション** セクションに移動し、次のものを追加します： **クリック時** のインタラクション。
* に対して、 **タイプ**を選択します **Download CMS**.
* この特定のインタラクションは、表の特定の行に関連する CMS ファイルのダウンロードを安全に生成して開始するよう設計されています。他のプロパティはこのインタラクションには必要ありません。
{% endstep %}
{% step %}
### 保存と公開
Avonni データテーブルが Experience Cloud ページ上で完全に設定されたので、最後のステップはサイト訪問者向けにライブにすることです。Experience Builder では作業中に構成変更が通常保存されますが、変更を訪問者が確認できるようにするには、 **公開** サイトをして、変更を公開する必要があります。
{% endstep %}
{% endstepper %}
## なぜ専用の「Download CMS」インタラクションを使うのか？
コンテンツが Salesforce CMS で管理され、Experience Cloud サイトに表示される場合、ファイルには単純なリンクで移動できる標準の「レコード詳細ページ」がありません。テーブル内のファイル名は単なるテキストです。次の **Download CMS** インタラクションは、安全な橋渡しとして機能し、行に関連するファイルバージョンを正しく特定してユーザーのためにダウンロードを開始します。これにより、信頼性の高いシームレスなユーザー体験が保証されます。
## **結果**
これで Salesforce CMS コンテンツを一覧表示する動的でユーザーフレンドリーなテーブルができました。ユーザーが任意の行の「ダウンロード」ボタンをクリックすると、対応するファイルが直接デバイスにダウンロードされます。