AEM Assets View の UI 拡張機能の有効化 AEM-Assets-View-UI-Extensibility
AEM Assets View は UI 拡張機能をサポートしており、AEM Assets View の標準機能では満たされない特定のワークフローやビジネス要件に対して、カスタム UI コンポーネントを Assets View の UI に追加できます。AEM Assets View の UI 拡張機能により柔軟性が向上し、組織は特定のワークフローと要件に合わせてインターフェイスを調整できるようになります。
拡張機能は アセット レベル、フォルダー レベル、および コレクション レベルに追加できます。追加された拡張機能は、アセット、コレクション、または フォルダー の 詳細 ページの専用パネルに表示されます。
- AEM Assets View の UI 拡張機能は Assets Ultimate で使用できます。
- Assets view の UI 拡張機能へのアクセス権を取得するには、 Adobe カスタマーサポートケースを作成および送信してください。
- 詳細なフィードバックオプション を展開し、「問題を報告」をクリックすることで、ドキュメントに関するフィードバックを提供できます。
アセットビューへのアクセス add-UI-Extensibility-in-AEM-Assets-View
次の画像に示す手順に従って、Assets View にアクセスします。
Assets View での UI 拡張機能の表示 ui-extensibility-panel-assets-view
Assets View 内で、アセット、フォルダーまたはコレクションの 詳細 ページに移動します。詳細 ページの専用パネルには、追加された UI 拡張機能が表示されます。
拡張コンポーネントを追加するための前提条件 assets-view-ui-extensibility
Assets View UI に拡張コンポーネントを追加するには、次の要件を満たす必要があります。
- Assets View にアクセスします。
- Adobe app builder にアクセスします。
- 組織内に開発者またはシステム管理者の役割が存在する。詳しくは、このドキュメントを参照してください。
- Adobe IO command line tool (AIO CLI) がローカルマシンにインストールされている。このツールは、拡張プロジェクトの作成とデプロイに不可欠です。詳しくは、最初の App Builder アプリケーションの作成(アクセスには認証が必要)を参照してください。
- JavaScript、Node.js、React のテクノロジーを十分に理解している。
UI 拡張機能コンポーネントを Assets View に追加 ui-extensibility-in-assets-view
- UI 拡張機能と Adobe App Builder フレームワークに関する重要な情報については、 はじめにを参照してください。UI 拡張機能によって Adobe Experience Cloud services 内でカスタムロジックと UI の統合を可能にする方法と、UI 拡張機能を実装するためのアーキテクチャとワークフローについて説明します。
- ローカル環境の設定、ローカルプレビュー、公開、管理など、UI の拡張機能に関する一般的な情報については、ガイドを参照してください。
- AEM Assets View 用の UI 拡張機能の開発に必要な基本事項を理解するには、拡張機能の作成における一般的な概念を参照してください。
- Assets View インターフェイスにカスタムサイドパネルを追加します。ホストアプリケーション(Assets View)は、これらのパネルを管理して、切り替えやディープリンクなど、UI のインタラクションを処理します。拡張機能では、
aem/assets/details/1
拡張機能ポイントを使用して、パネル ID、タイトル、コンテンツ URL などのプロパティを指定するカスタムパネルを統合します。開発者は、getPanels()
メソッドでカスタムパネルを登録し、カスタムコンテンツを表示するルートを構築します。API リファレンスやコード例などの詳細な実装については、詳細ビューを参照してください。 - ローカル環境を設定し、最初の UI 拡張機能を作成して、Assets View で UI 拡張機能を開発するプロセスを直接体験してください。詳しくは、AEM Assets View 拡張機能の開発手順を参照してください。
- AIO CLI を使用してアプリケーションを設定し、基本的な拡張機能構造と必要なコードを生成します。詳しくは、 AEM Assets View のコード生成を参照してください。
- 拡張機能をローカルでテストして、想定どおりに動作することをデプロイメント前に確認します。完全に分離された環境または部分的に分離された環境で拡張機能を実行し、テスト用に拡張機能を AEM Assets View の本番環境に接続します。詳しくは、トラブルシューティング - AEM Assets View の拡張機能を参照してください。
アセットビューでのクイックアクションとアクションバーのカスタマイズ customize-quick-actions-and-actions-bar
アセットビューで 1 つ以上のアセットを選択したときに表示されるアクション(アクションバー)をカスタマイズできます。アセットビューを使用すると、アセットカードで「その他のオプション」(…)をクリックしたときに表示されるアクションをカスタマイズすることもできます。詳しくは、ビューを参照を参照してください。
アセットビューでカスタムダイアログを開く open-custom-dialogs-assets-view
アセットビューでは、選択したテキストでカスタムダイアログを開く機能も提供されます。テキストにリンクを追加することもできます。詳しくは、モーダル API を参照してください。