ユニバーサルエディターへのアクセスと操作 navigating

ユニバーサルエディターへのアクセスと操作の基本について説明します。

はじめに introduction

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

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

アプリを準備する prepare-app

ユニバーサルエディターを使用してアプリのコンテンツを作成するには、エディターをサポートするために、デベロッパーがアプリを実装する必要があります。

ユニバーサルエディターへのアクセス accessing

アプリをユニバーサルエディターと連携するように実装すると、ユニバーサルエディターでは、AEM as a Cloud Service 内からアクセスすることも、AEM にアクセスせずに直接アクセスすることもできます。

AEM as a Cloud Service 内でのアクセス accessing-aem

直接アクセス accessing-directly

UI について ui

UI は以下の主なエリアに分かれています。

Experience Cloud ヘッダー experience-cloud-header

Experience Cloud ヘッダーは、常に画面の上部に表示されます。Experience Cloud 内の位置を示し、他の Experience Cloud アプリへの移動に役立つアンカーです。

Experience Manager experience-manager

ヘッダーの左側にある Adobe Experience Cloud リンクを選択して Experience Manager ソリューションのルートに移動し、Cloud Manager、Cloud Acceleration Manager およびソフトウェア配布といったツールにアクセスします。

組織 organization

現在ログインしている組織が表示されます。Adobe ID が複数の組織に関連付けられている場合、別の組織に切り替えるには、選択します。

ソリューション solutions

ソリューション切り替えボタンをタップまたはクリックすると、他の Experience Cloud ソリューションに素早くジャンプすることができます。

ヘルプ help

ヘルプアイコンを使用すると、学習リソースやサポートリソースに素早くアクセスできます。

通知 notifications

このアイコンには、現在割り当てられている未完了の通知の数を示すバッジが付きます。

ユーザープロパティ user-properties

ユーザー設定にアクセスするには、ユーザーを表すアイコンを選択します。ユーザー画像が設定されていない場合、アイコンがランダムに割り当てられます。

ユニバーサルエディターのツールバー universal-editor-toolbar

ユニバーサルエディターのツールバーは、常に画面の上部、Experience Cloud ヘッダーのすぐ下に表示されます。このツールを使用すると、別のページに素早くアクセスして編集したり、現在のページを公開したりできます。

「ホーム」ボタン home-button

「ホーム」ボタンをクリックすると、ユニバーサルエディターの開始ページに戻ります。

開始ページで、ユニバーサルエディターで編集するサイトの URL を入力できます。

ロケーションバー location-bar

ロケーションバーに、編集中のページのアドレスが表示されます。別のページを編集するには、選択してアドレスを入力します。

認証ヘッダーの設定 authentication-settings

ローカル開発目的でカスタム認証ヘッダーを設定する必要がある場合は、認証ヘッダー設定アイコンを選択します。

エミュレーターの設定 emulator

エミュレーションアイコンを選択して、ユニバーサルエディターによるページのレンダリング方法を定義します。

エミュレーションアイコンをタップまたはクリックすると、オプションが表示されます。

デフォルトでは、エディターはデスクトップレイアウトで開き、高さと幅はブラウザーで自動的に定義されます。

また、ユニバーサルエディター内でモバイルデバイスをエミュレートすることもできます。

プレビューモード preview-mode

プレビューモードでは、ページは、公開されたサービスで表示されるとおりに、エディターでレンダリングされます。これにより、コンテンツ作成者は、リンクをクリックするなどしてコンテンツ内を移動できます。

アプリのプレビューを開く open-app-preview

「アプリのプレビューを開く」アイコンを選択すると、現在編集中のページをエディターなしで独自のブラウザーで開いて、内容をプレビューできます。

公開 publish

「公開」ボタンを選択すると、コンテンツへの変更がライブで公開され、読者が使用できるようにになります。

省略記号 ellipsis

省略記号ボタンを使用すると、その他の標準オプションにアクセスできます。

例えば、ページを非公開にする機能（つまり、「公開」ボタンのアクションを元に戻す）には、省略記号ボタンからアクセスできます。

その他のボタン additional-toolbar-buttons

ユニバーサルエディターには、カスタマイズ可能で拡張性の高いオーサリングエクスペリエンスが用意されています。ツールバーにその他のボタンを表示する場合は、ユニバーサルエディターが拡張されています。

エディター editor

エディターはウィンドウのほとんどを占め、そこにロケーションバーで指定したページがレンダリングされます。

エディターがプレビューモードの場合、コンテンツに移動し、リンクをたどることはできますが、コンテンツを編集することはできません。

プロパティパネル properties-rail

プロパティパネルは、常にエディターの右側に表示されます。 モードに応じて、コンテンツ内で選択されたコンポーネントの詳細またはページコンテンツの階層を表示できます。

プロパティモード properties-mode

プロパティモードでは、エディターで現在選択されているコンポーネントのプロパティがパネルに表示されます。 これは、ページが読み込まれたときのプロパティパネルのデフォルトモードです。

選択するコンポーネントのタイプに応じて、詳細をプロパティパネルに表示して変更できます。

表示や編集が可能な詳細が含まれていないコンポーネントもあります。

コンテンツツリーモード content-tree-mode

コンテンツツリーモードでは、パネルにページコンテンツの階層が表示されます。

コンテンツツリー内の項目を選択する場合、エディターはそのコンテンツまでスクロールして選択します。

CF エディターで開く edit

編集時、選択したコンポーネントのオプションがプロパティパネルに表示され、選択したコンポーネントを編集できます。 選択したコンポーネントがコンテンツフラグメントの場合は、「CF エディターで開く」ボタンを選択することもできます。

「CF エディターで開く」ボタンをタップまたはクリックすると、コンテンツフラグメントエディターが新しいタブで開きます。これにより、コンテンツフラグメントエディターを最大限に活用して、関連するコンテンツフラグメントを編集できます。

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

追加 add

コンテンツツリーまたはエディターでコンテナコンポーネントを選択すると、プロパティパネルに「追加」オプションが表示されます。

「追加」ボタンをタップまたはクリックすると、使用できるコンポーネントのドロップダウンメニューが開き、選択したコンテナに を追加します。

複製 duplicate

コンテンツツリーまたはエディターでコンテナコンポーネント内のコンポーネントを選択すると、「複製」オプションがプロパティパネルに表示されます。

「複製」ボタンをタップまたはクリック 選択したコンポーネントを複製

削除 delete

コンテンツツリーまたはエディターでコンテナコンポーネント内のコンポーネントを選択すると、削除オプションがプロパティパネルに表示されます。

「削除」ボタンをタップまたはクリックすると はコンポーネントを削除します。

その他のボタン additional-properties-rail-buttons

ユニバーサルエディターには、カスタマイズ可能で拡張性の高いオーサリングエクスペリエンスが用意されています。プロパティパネルに追加のボタンが表示される場合は、ユニバーサルエディターが拡張されています。

次の手順 next-steps

ユニバーサルエディターにアクセスして操作する方法について理解したので、これを使用してコンテンツを作成する準備が整いました。