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

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

はじめに introduction

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

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

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

コンテンツの編集 editing-content

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

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

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

選択するコンテンツによって、異なるインプレース編集オプションが使用されたり、 プロパティパネルのコンテンツに関する追加情報やオプションが使用されたりする場合があります。

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

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

コンテンツを編集

薄い青色のアウトラインは、選択を示す濃い青色のアウトラインに変わり、カーソルが表示されます。変更を行ったら、Enter キーまたは Return キーを押すか、テキストボックスの外側を選択して、変更を保存します。

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

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

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

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

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

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

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

コンテキストメニュー context-menu

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

リッチテキストコンテキストメニュー

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

プロパティパネル properties-rail

プロパティパネルには、選択したテキストの項目が表示されます。 エントリをタップすると、テキストを編集するための大きいキャンバスを表示するダイアログが開きます。

リッチテキスト編集ダイアログ

変更を破棄または保存するには、それぞれ「キャンセル」または「完了」をタップまたはクリックします。

メディアの編集 edit-media

プロパティの詳細は、 プロパティパネルに表示されます。

メディアの編集

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

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

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

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

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

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

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

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

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

TIP
コンテンツフラグメントエディターで選択したコンテンツフラグメントを編集するには、ホットキー e を使用します。

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

NOTE
ユニバーサルエディターでは、モデルに基づいてコンテンツフラグメントフィールドを検証し、正規表現パターンや一意性制約などのデータ整合性ルールを適用できます。
これにより、コンテンツを公開する前に、特定のビジネス要件が満たされます。

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

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

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

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

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

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

コンテナ内のコンポーネントの複製 duplicating-components

  1. コンテンツツリーまたはエディターを使用して、コンテナ内のコンポーネントを選択します。

  2. 次に、プロパティパネルの「複製」アイコンを選択します。

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

  3. コンポーネントが複製され、選択したコンポーネントの下に挿入されます。

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

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

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

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

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

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

    コンポーネントの削除

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

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

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

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

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

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

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

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

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

コンテンツツリーとエディターの両方で、コンポーネントの順序が変更されます。

NOTE
ソースコンテナとターゲットコンテナの間に別の コンポーネントフィルターが設定されている場合、コンポーネントをコンテナ間で移動することはできません。

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

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

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

その他のリソース additional-resources

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

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

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

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

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

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

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

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