Experience Manager as a Cloud Serviceのコンテンツフラグメントエディター拡張機能を使用して、日付と時刻のフィールドに現在の時刻を入力します
Adobe Experience Manager as a Cloud Serviceでは、作成者が新しいコンテンツフラグメントエディターでコンテンツフラグメントを作成または編集する際に、コンテンツフラグメントモデルの標準日付/時刻 フィールドが空のままになります。 従来のエディターでは、これらのフィールドには現在のシステム時間が事前に入力されていましたが、新しいエディターではフィールドが空のままになり、作成者は手動で値を入力する必要があります。 この変更は、デフォルトの時間値に依存するオーサリングワークフローに影響します。 フィールドに自動的に入力するには、コンテンツフラグメントエディターUI拡張性フレームワークを使用してカスタムフィールドを実装し、フィールド値が空の現在の時間を設定します。 これを修正するには、カスタムフィールド拡張機能を作成、デプロイ、テストします。
説明 description
環境
- Adobe Experience Manager as a Cloud Service(コンテンツフラグメントエディターUIの拡張性がサポートされています)
問題/症状
- コンテンツフラグメントの日付/時刻フィールドは、新しいエディターではデフォルトで空です。
- 作成者は、現在の時間を手動で入力する必要があります。
原因
新しいコンテンツフラグメントエディターでは、デフォルトで日付/時刻フィールドが自動入力されません。 この動作を復元するには、拡張性フレームワークを使用してカスタムフィールドを実装する必要があります。
解決策 resolution
現在の時間を自動的に入力するには、次の手順に従います。
-
Adobe App Builder CLIをインストールして更新します。
npm install -g @adobe/aio-cliを実行します。aio plugins:updateを実行します。
-
エディターテンプレートを使用して、コンテンツフラグメントエディター拡張機能プロジェクトを初期化します。
aio app init --template @adobe/aem-cf-editor-ui-ext-tplを実行します。
-
カスタム日付/時刻フィールド React コンポーネントを実装します。
- カスタムフィールドを登録するには、カスタムフィールド APIを使用します。
- コンポーネントで、フィールド値が空かどうかを確認します。 その場合は、現在のシステム時間に設定します。
- 例:
"’
import { useEffect }から’react’;
export default function CustomDateTimeField ({ value, onChange }) {
useEffect () => {
if (!value) {
onChange (new Date ().toISOString ());
}, [ value, onChange]);
//////ここで日時の入力をレンダリングし、手動での上書きを許可します
}}
"
– 拡張性フレームワークを使用して、日付/時刻プロパティのカスタムフィールドとしてこのコンポーネントを登録します。
4. App Builder拡張機能の標準デプロイメント手順に従って、拡張機能をAEM環境にデプロイします。
5. 拡張機能をテストします。
– 新しいエディターでコンテンツフラグメントを開きます。
– 日付/時刻フィールドを追加または編集し、現在のシステム時刻で自動入力されていることを確認します。
– 必要に応じて、作成者が値を変更できることを確認します。