[AEM Sites]{class="badge positive" title="適用於AEM Sites)。"}
使用 Universal Editor 編寫內容 authoring
了解內容作者使用 Universal Editor 建立內容有多簡單和直覺。
簡介 introduction
通用編輯器可讓您編輯任何實作中任何內容的任何方面,因此您可以提供卓越的體驗並提高內容速度。
為此,Universal Editor 為內容作者提供直觀的 UI,只需要最基本的培訓就能立即進入狀況並開始編輯內容。本文件說明了 Universal Editor 的編寫體驗。
編輯內容 editing-content
編輯內容很簡單又直覺。當您將滑鼠移至編輯器中的內容上時,可編輯的內容會以淺藍色外框和徽章反白顯示。
輕觸或按一下反白的內容即會選取,而薄的淺藍色外框會變成具有徽章的深藍色外框。
根據您選取的內容,您可能有不同的就地編輯選項,以及屬性面板中內容的其他資訊和選項。
內容功能表 context-menu
每一段可編輯內容都標示其內容型別。
您可以按一下此徽章,以快速存取包含編輯動作的內容功能表。 以滑鼠右鍵按一下未選取的可編輯專案會自動選取它,也會開啟內容功能表。
編輯純文字 edit-plain-text
您可以按兩下或點兩下元件,就地編輯文字。
薄的淺藍色外框會變成深藍色外框來指示選取範圍,並且會出現游標。 進行變更,然後按下Enter/Return或在文字方塊外選取,以儲存變更。
當您選取文字元件時,其詳細資訊會顯示在屬性面板中。您也可以在面板中編輯文字。
此外,「屬性」面板中也提供您文字的詳細資料。 一旦焦點離開屬性面板中已編輯的欄位,變更會自動儲存。
編輯 RTF 文字 edit-rich-text
您可以按兩下或點兩下元件,就地編輯文字。
為方便起見,您可在兩個位置找到文字的格式選項和詳細資訊。
RTF內容功能表 rich-text-context-menu
隨即在RTF區塊上方開啟上下文功能表,提供上下文中的基本格式選項。 由於空間限制,某些選項可能會隱藏在省略符號按鈕後面。
一旦焦點離開已編輯的欄位,變更會自動儲存。
屬性面板 properties-rail
屬性面板會顯示所選RTF元件的專案。
屬性面板中的
模型編輯器 modal-editor
點選屬性面板中的專案以開啟模式編輯器,此編輯器提供較大的畫布以編輯RTF文字。
點選或按一下「取消」或「完成」,分別捨棄或儲存變更。 您也可以按下ESC鍵以儲存變更並關閉對話方塊。
RTF格式選項 formatting-options
通用編輯器的RTF編輯器(RTE)可讓作者套用標準文字格式。 下列選項可供使用。
-
段落樣式
- 段落,h1-h6,代碼
-
粗體
-
斜體
-
加底線
-
刪除線
-
文字色彩
- 開啟調色盤,您可在其中選取顏色或指定十六進位值
- 僅適用於模型編輯器,不適用於相關資訊環境
-
上標
-
下標
-
專案符號清單
- 使用Tab鍵以縮排,並使用Shift+Tab鍵以縮排。
-
排序清單
- 使用Tab鍵以縮排,並使用Shift+Tab鍵以縮排。
-
連結
- 指定URL或使用內容瀏覽器在AEM中選取路徑。
-
取消連結
- 從選取的文字移除連結。
-
影像
- 指定URL或使用資產選擇器從AEM中選取資產。
-
表格
- 使用下拉式清單,插入所選欄和列數的新表格,或插入和移除新欄/列。
-
對齊方式
- 靠左對齊
- 置中對齊
- 靠右對齊
- 對齊對齊
-
從右至左
-
從左至右
-
縮排
-
凸排
-
貼上成文字
- 在貼入通用編輯器之前,從剪貼簿上的文字移除格式。
-
特殊字元
- 在文字中插入特殊字元。
-
移除所有格式
- 從選取的文字移除所有格式選項。
依您的後端而定,預設可用的選項可能有所不同。 RTE可設定為根據作者需求隱藏選項或顯示其他選項。 如需詳細資訊,請參閱檔案為通用編輯器設定RTE。
編輯媒體 edit-media
您可以在屬性面板中檢視其詳細資料。
- 在屬性面板中,點選或按一下所選影像的預覽。
- 資產選擇器視窗會開啟,讓您可選取資產。
- 選取「 」以選取新資產。
- 選取 選取 以返回取代資產的屬性面板。
變更會自動儲存到您的內容中。
編輯內容片段 edit-content-fragment
如果您選取內容片段,您可以在屬性面板中編輯其詳細資料。
在所選內容片段的內容模型中定義的欄位會在屬性面板中顯示和編輯。
如果您選取與內容片段相關的欄位,內容片段會載入元件面板中,且欄位會自動捲動到。
一旦焦點離開屬性面板中已編輯的欄位,變更會自動儲存。
如果您想改用內容片段編輯器編輯您的內容片段,請點選或按一下屬性面板中的在CF編輯器中開啟按鈕。
e在內容片段編輯器中編輯選取的內容片段。根據工作流程的需求,您可能會想要在通用編輯器中或直接在內容片段編輯器中編輯內容片段。
新增元件到容器中 adding-components
-
在內容樹狀結構或編輯器中選取容器元件。
-
然後,您可以:
-
在屬性面板中選取 新增 圖示。
-
在內容功能表中選取 新增 選項。
-
-
元件選取器對話方塊隨即開啟。
- 使用左欄以依類別篩選元件,或使用搜尋以依名稱篩選。
- 按一下右側欄中的元件名稱,可將其插入容器中。
- 如果容器中只允許一個元件,則會自動插入該元件。
- 按一下選擇器外部以取消元件插入。
該元件會被插入到容器中並可在編輯器中對其進行編輯。
a 將元件新增到選取的容器中。在容器中複製元件 duplicating-components
-
使用內容樹狀結構或編輯器選取容器中的元件。
-
然後,您可以:
-
在屬性面板中選取 複製 圖示。
-
從內容功能表選取 複製 選項。
-
元件會複製並插入選取元件的下方。
從容器中刪除元件 deleting-components
-
在內容樹狀結構的容器中或在編輯器中選取元件。
-
然後,您可以:
-
在屬性面板中選取 刪除 圖示。
-
選取內容功能表中的 刪除 選項。
-
選取的元件已刪除。
Shift+Backspace 從容器中刪除選取的元件。重新排序和移動元件 reordering-components
您可以使用前後關聯選單或內容樹來移動和重新排序元件。
使用快顯選單移動元件 move-context-menu
-
以滑鼠右鍵按一下元件,或按一下所選元件的徽章,以開啟內容功能表。
-
選取所需的移動選項。
- 移至頂端
- 上移
- 下移
- 移至底部
元件會在編輯器和內容樹中移動。
Command-U或Shift-Command-U分別向上或向上移動。使用快速鍵
Command-J或Shift-Command-J分別向下移動或移至底部。使用內容樹重新排序元件 reorder-content-tree
-
如果尚未處於內容樹狀結構模式,請切換至該模式。
-
在內容樹或編輯器中選取容器元件。
-
選取容器的>形箭號圖示,展開內容樹狀結構中的內容。
-
拖曳容器內的元件旁的手柄圖示證明您可以將它們重新排序。拖曳元件,在容器內將它們重新排序。
-
拖曳的元件在內容樹狀結構中會呈現灰色,而您的插入點會以藍線表示。 將元件鬆開並放在新位置中。
元件會在內容樹和編輯器中重新排序。
還原與重做 undo-redo
選取「復原」或「重做」按鈕,以復原或重做編輯器中上次的編輯。
- 還原和取消復原的執行範圍包括:在內容中完成的編輯、透過屬性面板完成的編輯,以及新增 (複製)、移動及刪除區塊。
- 還原和取消復原僅限於目前瀏覽器工作階段。
Command-Z或Shift-Command-Z來復原或重做。複製並貼上 copy-paste
您可以複製並貼上容器內的元件。只有在目標容器未設定篩選器,或篩選器允許貼上元件時,才可以執行此操作。
如果標籤已經開啟,複製和貼上可在相同的瀏覽器標籤上或瀏覽器標籤之間。 您不能複製專案然後開啟新的瀏覽器標籤以貼上。
-
在編輯器或內容樹中選取元件。
-
然後,您可以:
- 按一下 屬性面板中的 複製圖示。
- 在內容功能表中選取 複製 選項。
- 按一下 屬性面板中的 複製圖示。
-
選取您要貼上複製元件的元件after。
-
然後,您可以:
- 在屬性面板中,點選或按一下「貼上」。
從面板
- 在內容功能表中選取貼上。
從內容功能表貼上
- 在屬性面板中,點選或按一下「貼上」。
複製的元件會在 之後貼上 選取的元件。
Command-C或Command-V來複製或貼上。預覽內容 previewing-content
內容編輯完成後,您通常會希望瀏覽其內容,以查看它在其他頁面內容中的樣子。在預覽模式中,您可以點選連結,像讀者一樣瀏覽您的內容。內容在編輯器中呈現的樣子就是將會發佈的樣子。
在預覽模式中,點選或按一下內容的反應就像對內容的讀者一樣。 若要選取要編輯的內容,請切換出預覽模式。
編輯元件繼承 inheritance
繼承是可連結內容的機制,如此一來變更一個會自動變更另一個。
使用通用編輯器,您只需更新內容即可取消內容的繼承。 編輯器會自動停用該頁面上作者所做所有變更的繼承,以確保在從Blueprint同步更新時保留修改的內容。
如果您的程式已啟用AEM多網站管理(MSM)擴充功能,您就有額外的工具列選項可檢視和變更通用編輯器中個別元件的繼承狀態。
如需有關使用通用編輯器繼承如何運作的詳細資訊,請參閱通用編輯器中的內容繼承。
選用的工具列功能 toolbar-options
其他功能可作為通用編輯器的擴充功能使用,協助您進一步管理頁面和內容。 這些擴充功能必須由系統管理員在程式中啟用,您才能在通用編輯器工具列中以內容作者身分看到它們。
繼承 inheritance-extension
AEM多網站管理(MSM)擴充功能會顯示所選元件的目前繼承狀態,並可讓您中斷或復原繼承。
「通用編輯器」工具列中的 已安裝繼承 圖示顯示,所選元件的繼承仍然有效。
點選或按一下圖示以中斷所選元件的繼承。 如果您編輯元件,繼承會自動中斷。
繼承中斷圖示顯示所選元件的繼承已中斷。
點選或按一下圖示,以恢復所選元件的繼承。 您需要重新載入頁面以重新整理內容,才能顯示繼承的內容。
如需如何啟用此擴充功能的詳細資訊,請參閱Extension Manager檔案。
存取頁面屬性 page-properties
AEM頁面屬性擴充功能可讓您快速存取目前編輯之頁面的頁面屬性視窗。
在通用編輯器工具列中點選或按一下 頁面屬性 圖示,以在新的瀏覽器標籤中開啟頁面的頁面屬性。
如需如何啟用此擴充功能的詳細資訊,請參閱Extension Manager檔案。
存取網站主控台 sites-console
AEM網站管理擴充功能可讓您快速存取AEM的網站主控台中正在編輯的頁面,讓您在主控台中導覽網站樹狀結構或執行頁面層級的動作。
點選或按一下圖示,在新的瀏覽器標籤中開啟「網站主控台」,並導覽至目前位於編輯器中的頁面。
如需如何啟用此擴充功能的詳細資訊,請參閱Extension Manager檔案。
鎖定和解鎖頁面 locking-pages
AEM頁面鎖定擴充功能會在編輯器中顯示頁面的目前鎖定狀態,並可讓您鎖定或解除鎖定頁面。
通用編輯器工具列中的 解除鎖定 圖示顯示編輯器中目前沒有鎖定頁面。
點選或按一下圖示以鎖定頁面。
通用編輯器工具列中的 已鎖定 圖示顯示編輯器中目前的頁面已鎖定。 將滑鼠停留在圖示上,就會顯示工具提示,指出鎖定頁面的使用者。
如果您是鎖定頁面的使用者,請點選或按一下圖示以解除鎖定頁面。
如需如何啟用此擴充功能的詳細資訊,請參閱Extension Manager檔案。
工作流程 workflows
AEM工作流程擴充功能可讓您在目前編輯器的頁面上啟動工作流程。
在Universal Editor工具列中點選或按一下 工作流程 圖示,以開啟 啟動工作流程 強制回應視窗。 此視窗會列出您可以套用工作流程的可能內容。
- 在 工作流程模型 下拉式清單中,選取要套用的工作流程。
- 在 名稱 欄位中提供工作流程的說明。
- 在要包含在工作流程 清單中的 內容中,使用核取方塊來定義要包含在工作流程中的內容。
- 點選或按一下 開始工作流程 以開始工作流程,或點選或按一下 關閉 以中止。
如需如何啟用此擴充功能的詳細資訊,請參閱Extension Manager檔案。
開發人員登入 developer-login
AEM Universal Editor Dev Login Extension對於在本機開發的開發人員很有用,可讓您以方便的方式驗證本機AEM SDK以進行測試。
在Universal Editor工具列中,點選或按一下 開發人員登入 圖示,提供您的本機登入認證,以登入您本機的AEM SDK。
如需如何啟用此擴充功能的詳細資訊,請參閱Extension Manager檔案。
選用的屬性面板功能 properties-panel-options
其他功能可作為通用編輯器的擴充功能使用,協助您進一步管理頁面內容。 這些擴充功能必須由系統管理員在程式中啟用,您才能在通用編輯器屬性面板中以內容作者身分看到它們。
產生變化版本 generate-variations
產生變數擴充功能可讓您使用產生式人工智慧(AI),直接在屬性面板中建立內容的變數。
在Universal Editor屬性面板中,點選或按一下 產生變化 圖示,以接收建議並建立變化。 請參閱檔案產生變數 — 整合在AEM編輯器中,以取得有關產生變數如何運作的詳細資訊。
如需如何啟用此擴充功能的詳細資訊,請參閱Extension Manager檔案。
其他資源 additional-resources
若要瞭解如何使用通用編輯器發佈內容,請參閱本檔案。
- 使用通用編輯器發佈內容 - 了解通用編輯器如何發佈內容,以及您的應用程式如何處理已發佈的內容。
若要了解更多關於通用編輯器的技術細節,請參閱這些開發人員文件。
- 通用編輯器簡介 — 瞭解通用編輯器如何在任何實作中啟用編輯任何內容的任何方面,以便您提供卓越的體驗並提高內容速度。
- AEM 中 Universal Editor 快速入門 - 了解如何存取 Universal Editor,以及如何開始檢測您的第一個 AEM 應用程式以使用它。
- Universal Editor 架構 - 了解 Universal Editor 的架構,以及資料如何在其服務和階層之間流動。
- 屬性和類型 - 了解 Universal Editor 需要的資料屬性和類型。
- Universal Editor 驗證 - 了解 Universal Editor 如何進行驗證。