カルーセルでの複数の PDF ドキュメントの表示
Last update: Thu Mar 27 2025 00:00:00 GMT+0000 (Coordinated Universal Time)
- 適用対象：
- Experience Manager 6.5
- トピック：
- アダプティブフォーム
作成対象：
- 経験者
- 開発者
一般的な使用例としては、フォームを送信する前に確認するために、複数の PDF ドキュメントをフォームの入力者に表示します。
この使用例を実現するには、Adobe PDF Embed API を使用します。
統合を完了するには、次の手順を実行します。
複数の PDF ドキュメントを表示するカスタムコンポーネントの作成
PDF ドキュメントのサイクルを切り替えるカスタムコンポーネント（pdf-carousel） が作成されました。
クライアントライブラリ
Adobe PDF Embed API を使用してPDFを表示するクライアントライブラリが作成されました。 表示する PDFは、pdf-carousel コンポーネントで指定します。
アダプティブフォームの作成
いくつかのタブ（このサンプルでは 3 つ）を使用してアダプティブフォームを作成します
最初の 2 つのタブにアダプティブフォームのコンポーネントを追加します
3 番目のタブに pdf カルーセルコンポーネントを追加します
pdf-carousel コンポーネントを設定します（下のスクリーンショットを参照）
Embed PDF API キー - PDF の埋め込みに使用できるキーです。このキーは、localhost でのみ機能します。独自のキーを作成して他のドメインに関連付けることができます。
PDF ドキュメントを指定 - カルーセルに表示する PDF ドキュメントを指定します。
サンプルのサーバーへのデプロイ
ローカルサーバーでこれをテストするには、次の手順に従います。
- パッケージマネージャーを使用して、クライアントライブラリをローカルの AEM インスタンスに読み込みます。
- パッケージマネージャーを使用して、PDF カルーセルコンポーネントをローカルの AEM インスタンスに読み込みます。
- パッケージマネージャーを使用して、ローカルの AEM インスタンスにアダプティブフォームを読み込みます。
- アセットファイルのアップロードリンクを使用して、表示するサンプルの PDF をローカルの AEM インスタンスに読み込みます。
- アダプティブフォームをプレビューします
- 「レビュー」タブにドキュメントへのタブを付けます。 カルーセルコンポーネントに 3 つの PDF ドキュメントが表示されます。
recommendation-more-help
8de24117-1378-413c-a581-01e660b7163e