Experience Manager as a Cloud Serviceのコンテンツフラグメントエディター拡張機能を使用して、日付と時刻のフィールドに現在の時刻を入力します

Adobe Experience Manager as a Cloud Serviceでは、作成者が新しいコンテンツフラグメントエディターでコンテンツフラグメントを作成または編集する際に、コンテンツフラグメントモデルの標準日付/時刻 フィールドが空のままになります。 従来のエディターでは、これらのフィールドには現在のシステム時間が事前に入力されていましたが、新しいエディターではフィールドが空のままになり、作成者は手動で値を入力する必要があります。 この変更は、デフォルトの時間値に依存するオーサリングワークフローに影響します。 フィールドに自動的に入力するには、コンテンツフラグメントエディターUI拡張性フレームワークを使用してカスタムフィールドを実装し、フィールド値が空の現在の時間を設定します。 これを修正するには、カスタムフィールド拡張機能を作成、デプロイ、テストします。

説明 description

環境

  • Adobe Experience Manager as a Cloud Service(コンテンツフラグメントエディターUIの拡張性がサポートされています)

問題/症状

  • コンテンツフラグメントの日付/時刻フィールドは、新しいエディターではデフォルトで空です。
  • 作成者は、現在の時間を手動で入力する必要があります。

原因

新しいコンテンツフラグメントエディターでは、デフォルトで日付/時刻フィールドが自動入力されません。 この動作を復元するには、拡張性フレームワークを使用してカスタムフィールドを実装する必要があります。

解決策 resolution

現在の時間を自動的に入力するには、次の手順に従います。

  1. Adobe App Builder CLIをインストールして更新します。

    • npm install -g @adobe/aio-cliを実行します。
    • aio plugins:updateを実行します。
  2. エディターテンプレートを使用して、コンテンツフラグメントエディター拡張機能プロジェクトを初期化します。

    • aio app init --template @adobe/aem-cf-editor-ui-ext-tplを実行します。
  3. カスタム日付/時刻フィールド 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. 拡張機能をテストします。
– 新しいエディターでコンテンツフラグメントを開きます。
– 日付/時刻フィールドを追加または編集し、現在のシステム時刻で自動入力されていることを確認します。
– 必要に応じて、作成者が値を変更できることを確認します。

関連トピックス

recommendation-more-help
experience-cloud-kcs-help-kbarticles