使用 Universal Editor 編寫內容

了解內容作者使用 Universal Editor 建立內容有多簡單和直覺。

簡介

Universal Editor 支援在任意實作中編輯任何方面的內容，以便提供卓越的體驗、提高內容速度並提供最先進的開發人員體驗。

為此，Universal Editor 為內容作者提供直觀的 UI，只需要最基本的培訓就能立即進入狀況並開始編輯內容。本文件說明了 Universal Editor 的編寫體驗。

準備應用程式

為了使用 Universal Editor 編寫應用程式的內容，應用程式必須由開發人員進行檢測以支援編輯器。

登入

應用程式依照指示使用通用編輯器後，請登入通用編輯器。 您需要Adobe ID才能登入和 擁有通用編輯器的存取權。

登入後，請在位置列中輸入您要編輯的頁面 URL。這樣一來，您就可以開始編輯內容，例如文字內容或媒體內容。

了解 UI

UI 分為五個主要區域。

• Experience Cloud 標頭
• Universal Editor 標頭
• 模式邊欄
• 編輯器
• 屬性邊欄

Experience Cloud 標頭

Experience Cloud 標頭會始終顯示在畫面頂端。這是一個錨點，說明您在 Experience Cloud 中的位置，並幫助您導覽到其他 Experience Cloud 應用程式。

Experience Manager

選取標頭左側的 Adobe Experience Cloud 連結，導覽至 Experience Manager 解決方案的根目錄，以存取 Cloud Manager、Cloud Acceleration Manager 和 Software Distribution 等工具。

組織

這將顯示您目前登入的組織。如果您的Adobe ID與多個組織相關聯，請選取以切換至其他組織。

解決方案

點選或按一下解決方案切換器可讓您快速跳轉到其他 Experience Cloud 解決方案。

說明

說明圖示可快速存取學習和支援資源。

通知

此圖示會標有目前已指派之未完成的通知數量。

使用者屬性

選取代表您的使用者的圖示，以存取您的使用者設定。 如果您沒有設定使用者圖片，則會隨機分配圖示。

Universal Editor 標頭

Universal Editor 標頭始終顯示在畫面頂端，就在 Experience Cloud 標頭下方。它可讓您快速存取，以導覽到另一個頁面進行編輯和發佈目前的頁面。

首頁按鈕

首頁按鈕可帶您回到通用編輯器的起始頁

在開始頁面上，您可以輸入要用通用編輯器編輯的網站URL。

位置列

位置列會顯示您正在編輯頁面的網址。選取「 」即可輸入其他頁面要編輯的位址。

驗證標題設定

如果您需要設定驗證密碼，請選取驗證標題設定圖示。

模擬器設定

選取模擬圖示以定義Universal Editor呈現頁面的方式。

點選或按一下模擬圖示即可顯示選項。

依預設，編輯器會在案頭版面配置中開啟，其中高度和寬度會由瀏覽器自動定義。

您也可以選擇在 Universal Editor 中模擬行動裝置：

• 定義其方向
• 定義寬度和高度
• 變更方向

開啟應用程式預覽

選取開啟應用程式預覽圖示，即可使用自己的瀏覽器標籤開啟您目前正在編輯的頁面，無須使用編輯器即可預覽您的內容。

發佈

選取「發佈」按鈕，讓您可以發佈內容的變更供讀者即時使用。

模式邊欄

模式邊欄就在home按鈕的下方，而且一律會沿著編輯器的左側顯示。 它可讓您在不同使用模式之間輕鬆切換編輯器。

預覽模式

在預覽模式下，在編輯器中呈現的頁面就是發佈服務所顯示的樣子。這可讓內容作者按一下連結等方式來導覽內容。

元件模式

在元件模式中，內容作者可以選取要編輯的元件，包括：

• 在原處編輯純文字。
• 編輯RTF文字 「屬性」邊欄中顯示的其他格式選項。
• 編輯媒體內容
• 編輯內容片段

選取元件時，其內容的詳細資訊會顯示在 屬性邊欄。 根據內容型別，您可以在就地或屬性邊欄中編輯。

編輯器

編輯器會佔據大部分視窗，而且是位置列中指定之頁面的呈現位置。

• 如果編輯器在 元件模式， 內容將可供編輯，但您無法關注連結。
• 如果編輯器在預覽模式，內容即為可瀏覽，而且您可以點選連結，但無法編輯內容。

屬性邊欄

屬性邊欄一律會沿著編輯器的右側顯示。 視其模式而定，可能會顯示在內容或頁面內容之階層中選取的元件詳細資訊。

屬性模式

在屬性模式下，邊欄會顯示編輯器中目前選取的元件屬性。這是載入頁面時屬性邊欄的預設模式。

依您所選取的元件類型而定，可在屬性邊欄中顯示和修改詳細資料。

請注意，並非所有元件都有可以顯示和/或編輯的詳細資料。

內容樹模式

在內容樹模式下，邊欄會顯示頁面內容的階層。

在內容樹中選取一個項目時，編輯器會捲動到該內容並予以選取。

編輯

當在 元件模式， 所選元件的編輯選項會顯示在「屬性」邊欄中。 在屬性邊欄中，您可以編輯選取的元件。 如果選取的元件是內容片段，您也可以選取「編輯」按鈕。

點選或按一下編輯按鈕將在新的索引標籤中開啟內容片段編輯器。這可讓您使用內容片段編輯器的全部功能來編輯關聯的內容片段。

根據工作流程的需求，您可能會想要在通用編輯器中或直接在內容片段編輯器中編輯內容片段。

新增

如果您在內容樹狀結構或編輯器中選取容器元件，「屬性」邊欄會出現「新增」選項。

點選或按一下「新增」按鈕即會開啟元件的下拉選單，可用於新增到選取的容器。

刪除

如果在內容樹狀結構或編輯器中選取容器元件內的元件，屬性邊欄會顯示刪除選項。

點選或按一下刪除按鈕刪除該元件。

編輯內容

編輯內容很簡單又直覺。在 元件模式，當您將游標移至編輯器中的內容時，可編輯的內容會以藍色方塊醒目提示。

根據您選取的內容，您可能有不同的就地編輯選項，而且您可能會為中的內容提供其他資訊和選項 屬性邊欄。

編輯純文字

如果您在 元件模式 並選取純文字元件，則按兩下或點選該元件即可就地編輯文字。

按下Enter/Return或在文字方塊外選取，以儲存變更。

當您選取選取文字元件時，其詳細資訊會顯示在「屬性」邊欄中。 您也可以在邊欄中編輯文字。

此外，屬性邊欄中也提供您文字的詳細資料。 一旦焦點離開屬性邊欄中已編輯的欄位，變更就會自動儲存。

編輯 RTF 文字

如果您在 元件模式 並選取RTF文字元件，按兩下或點選該元件即可就地編輯文字。

按下Enter/Return或在文字方塊外選取，以儲存變更。

此外，屬性邊欄中也有格式化選項和文字的詳細資訊。 一旦焦點離開屬性邊欄中已編輯的欄位，變更就會自動儲存。

編輯媒體

如果您在 元件模式 如果選取影像，即可在屬性邊欄中檢視其詳細資訊。

選取 取代 按鈕取代屬性邊欄中選取影像預覽下方的影像，以使用資產資料庫中的另一個影像取代。

1. 資產選擇器視窗會開啟，讓您可選取資產。
2. 選取「 」以選取新資產。
3. 選取 選取 以返回取代資產的屬性邊欄。

變更會自動儲存到您的內容中。

編輯內容片段

如果您在 元件模式 然後選取 內容片段， 您可以在「屬性」邊欄中編輯其詳細資料。

在選定內容片段的內容模型中定義的欄位會在屬性邊欄中顯示和編輯。

如果您選取與內容片段相關的欄位，則內容片段會載入到元件邊欄中，且會自動捲動到該欄位。

一旦焦點離開屬性邊欄中已編輯的欄位，變更就會自動儲存。

如果您想在 內容片段編輯器 請改為按一下 編輯按鈕 在模式邊欄中。

根據工作流程的需求，您可能會想要在通用編輯器中或直接在內容片段編輯器中編輯內容片段。

新增元件到容器中

1. 在內容樹或編輯器中選取容器元件。

2. 接著，在屬性邊欄中選取新增圖示。

   

該元件會被插入到容器中並可在編輯器中對其進行編輯。

從容器中刪除元件

1. 在內容樹或編輯器中選取容器元件。

2. 選取容器的>形箭號圖示，展開內容樹狀結構中的內容。

3. 然後，在內容樹中，選取容器內的元件。

4. 在屬性邊欄中選取刪除圖示。

   

選取的元件已刪除。

將容器中的元件重新排序

1. 在內容樹或編輯器中選取容器元件。

2. 如果尚未變成內容樹模式，切換至該模式。

3. 選取容器的>形箭號圖示，展開內容樹狀結構中的內容。

4. 拖曳容器內的元件旁的手柄圖示證明您可以將它們重新排序。拖曳元件，在容器內將它們重新排序。

   

5. 被拖曳的元件在元件樹中會變成灰色，而您的插入點則會以藍線表示。將元件鬆開並放在新位置中。

元件在內容樹和編輯器中都會重新排序

預覽內容

內容編輯完成後，您通常會希望瀏覽其內容，以查看它在其他頁面內容中的樣子。在預覽模式中，您可以點選連結，像讀者一樣瀏覽您的內容。內容在編輯器中呈現的樣子就是將會發佈的樣子。

請注意，在預覽模式下，點選或按一下內容的回應與內容讀者的回應一樣。如果您想要選取要編輯的內容，請切換至 元件模式。

其他資源

若要了解有關 Universal Editor 的詳細資訊，請參閱以下文件。

• Universal Editor 簡介 - 了解 Universal Editor 如何在任意實作中編輯任何方面的內容，以便提供卓越的體驗、提高內容速度並提供最先進的開發人員體驗。
• 使用 Universal Editor 發佈內容 - 了解 Universal Editor 如何發佈內容，和您的應用程式如何處理發佈的內容。
• AEM 中 Universal Editor 快速入門 - 了解如何存取 Universal Editor，以及如何開始檢測您的第一個 AEM 應用程式以使用它。
• Universal Editor 架構 - 了解 Universal Editor 的架構，以及資料如何在其服務和階層之間流動。
• 屬性和類型 - 了解 Universal Editor 需要的資料屬性和類型。
• Universal Editor 驗證 - 了解 Universal Editor 如何進行驗證。