ユニバーサルエディターを使用したコンテンツのオーサリング authoring

コンテンツ作成者がユニバーサルエディターを使用してコンテンツを作成する際に、簡単で直感的な方法を説明します。

はじめに introduction

ユニバーサルエディターを使用すると、あらゆる実装、あらゆるコンテンツ、あらゆる側面を編集できるため、優れたエクスペリエンスを提供し、コンテンツベロシティを向上させ、最新のデベロッパーエクスペリエンスを提供できます。

これを行うために、ユニバーサルエディターはコンテンツ作成者に、最小限のトレーニングで簡単にコンテンツの編集を開始できる直感的な UI を提供します。このドキュメントでは、ユニバーサルエディターのオーサリングエクスペリエンスについて説明します。

NOTE
このドキュメントは、ユニバーサルエディターへのアクセスと操作の方法を既に熟知していることを前提としています。 そうでない場合は、ドキュメント ユニバーサルエディターへのアクセスとナビゲートを参照してください。
TIP
ユニバーサルエディターについて詳しくは、ユニバーサルエディターの概要ドキュメントを参照してください。

コンテンツの編集 editing-content

コンテンツの編集はシンプルで直感的です。エディターでコンテンツにマウスカーソルを重ねると、編集可能なコンテンツが青いボックスでハイライト表示されます。

編集可能コンテンツが青いボックスでハイライト表示される

TIP
デフォルトでは、コンテンツをタップまたはクリックすると、そのコンテンツが編集用に選択されます。リンクをたどってコンテンツを移動する場合は、プレビューモードに切り替えます。

選択したコンテンツに応じて、異なるインプレース編集オプションが設定されている場合や、プロパティパネルにコンテンツの追加情報やオプションが表示される場合があります。

プレーンテキストの編集 edit-plain-text

コンポーネントをダブルクリックまたはダブルタップすると、その場でテキストを編集できます。

コンテンツを編集

Enter キーまたは Return キーを押すか、テキストボックスの外側を選択して、変更を保存します。

テキストコンポーネントを選択すると、その詳細が プロパティパネルに表示されます。 パネル内のテキストを編集することもできます。

プロパティパネルでのテキストの編集

また、テキストの詳細はプロパティパネルで確認できます。フォーカスがプロパティパネルの編集されたフィールドを離れると、変更は自動的に保存されます。

リッチテキストの編集 edit-rich-text

コンポーネントをダブルクリックまたはダブルタップすると、その場でテキストを編集できます。

リッチテキストコンポーネントの編集

利便性のために、テキストの書式設定オプションと詳細は、2 か所で利用できます。

  • コンテキストメニュー ​は、リッチテキストブロック上で開き、コンテキスト内の基本的な書式設定オプションを提供します。スペースの都合上、一部のオプションが省略記号ボタンの後ろに隠れている場合があります。
  • プロパティパネル ​には、使用可能なすべての書式設定オプションがテキストと共に表示されます。

フォーカスが編集されたフィールドを離れると、変更は自動的に保存されます。

メディアの編集 edit-media

その詳細は、 プロパティパネルで確認できます。

メディアの編集

  1. プロパティパネルで、選択した画像のプレビューをタップまたはクリックします。
  2. アセットセレクターウィンドウが開き、アセットを選択できます。
  3. 選択して、新しいアセットを選択します。
  4. 選択」を選択して、アセットが置き換えられたプロパティパネルに戻ります。

変更はコンテンツに自動的に保存されます。

コンテンツフラグメントの編集 edit-content-fragment

コンテンツフラグメントを選択すると、その詳細を プロパティパネルで編集できます。

コンテンツフラグメントの編集

選択したコンテンツフラグメントのコンテンツモデルで定義されたフィールドが、プロパティパネルに表示され編集可能になります。

コンテンツフラグメントに関連するフィールドを選択した場合、コンポーネントパネルにコンテンツフラグメントが読み込まれ、フィールドが自動的にスクロールされます。

フォーカスがプロパティパネルの編集されたフィールドを離れると、変更は自動的に保存されます。

コンテンツフラグメントエディターでコンテンツフラグメントを編集する場合は、代わりに、プロパティパネルの 編集ボタンをクリックします。

ワークフローのニーズに応じて、コンテンツフラグメントをユニバーサルエディターで編集することも、コンテンツフラグメントエディターで直接編集することもできます。

コンテナへのコンポーネントの追加 adding-components

  1. コンテンツツリーまたはエディターでコンテナコンポーネントを選択します。

  2. 次に、プロパティパネルで追加アイコンを選択します。

    コンテナに追加するコンポーネントの選択

コンポーネントがコンテナに挿入され、エディターで編集できます。

TIP
ホットキー A を使用して、選択したコンテナにコンポーネントを追加します。

コンテナからのコンポーネントの削除 deleting-components

  1. コンテンツツリーまたはエディターでコンテナコンポーネントを選択します。

  2. コンテナの山形アイコンを選択して、コンテンツツリーでコンテンツを展開します。

  3. 次に、コンテンツツリーで、コンテナ内のコンポーネントを選択します。

  4. プロパティパネルで削除アイコンを選択します。

    コンポーネントの削除

選択したコンポーネントが削除されました。

TIP
ホットキー Shift+Backspace を使用して、選択したコンポーネントをコンテナから削除します。

コンテナ内のコンポーネントの並べ替え reordering-components

  1. コンテンツツリーモードでない場合はそれに切り替えます。

  2. コンテンツツリーまたはエディターでコンテナコンポーネントを選択します。

  3. コンテナの山形アイコンを選択して、コンテンツツリーでコンテンツを展開します。

  4. コンテナ内のコンポーネントの横にあるハンドルアイコンをドラッグすると、それらを並べ替えることができます。コンポーネントをドラッグして、コンテナ内で並べ替えます。

    コンポーネントの並べ替え

  5. ドラッグしたコンポーネントはコンテンツツリーでグレーに変わり、挿入ポイントは青い線で表されます。 コンポーネントをリリースして、新しい場所に配置します。

コンポーネントは、コンテンツツリーおよびエディターの両方で並べ替えられます

コンテンツのプレビュー previewing-content

コンテンツの編集が完了したら、他のページのコンテンツでコンテンツがどのように表示されるかを確認するためにコンテンツ内を移動したい場合がよくあります。プレビューモードでリンクをクリックして、読者と同じようにコンテンツ内を移動できます。コンテンツは、公開されるときと同じように、エディターでレンダリングされます。

プレビューモードでは、コンテンツをタップまたはクリックすると、コンテンツの読者に対するように反応します。編集するコンテンツを選択する場合は、プレビューモードから切り替えます。

その他のリソース additional-resources

ユニバーサルエディターを使用してコンテンツを公開する方法については、このドキュメントを参照してください。

ユニバーサルエディターの技術的な詳細について詳しくは、次の開発者向けドキュメントを参照してください。

  • ユニバーサルエディターの概要 - ユニバーサルエディターを使用して、優れたエクスペリエンスを提供し、コンテンツベロシティを向上させ、最新のデベロッパーエクスペリエンスを提供するために、あらゆる実装、あらゆるコンテンツ、あらゆる側面の編集を可能にする方法を説明します。
  • AEM のユニバーサルエディターの概要 - ユニバーサルエディターへのアクセス権を取得する方法と、これを使用するために最初の AEM アプリのインストルメントを開始する方法について説明します。
  • ユニバーサルエディターのアーキテクチャ - ユニバーサルエディターのアーキテクチャと、そのサービスとレイヤー間でのデータのフローについて説明します。
  • 属性とタイプ - ユニバーサルエディターで必要なデータ属性とデータ型について説明します。
  • ユニバーサルエディターの認証 - ユニバーサルエディターの認証方法について説明します。

コンポーネントの継承の編集 inheritance

継承とは、コンテンツをリンクして、一方を変更すると他方が自動的に変更されるようなメカニズムです。

ユニバーサルエディターを使用すると、コンテンツを更新するだけで、コンテンツの継承をキャンセルできます。 エディターは、そのページの作成者によって行われたすべての変更の継承を自動的に無効にし、ブループリントから更新が同期されたときに変更されたコンテンツが保持されるようにします。

ユニバーサルエディターを使用した継承の仕組みについて詳しくは、ドキュメント ユニバーサルエディターでのコンテンツの継承を参照してください。

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab