使用 Universal Editor 创作内容 authoring

了解内容作者使用 Universal Editor 创建内容是多么轻松和直观。

简介 introduction

Universal Editor 支持在任意实施中编辑任何内容的任何方面,以提供卓越的体验,提升内容速度并提供最先进的开发人员体验。

为此,Universal Editor 为内容作者提供了一个直观的 UI,只需少量培训即可开始编辑内容。本文档介绍了 Universal Editor 的创作体验。

TIP
有关 Universal Editor 的更详细介绍,请参阅文档 Universal Editor 简介

准备应用程序 prepare-app

要使用 Universal Editor 为应用程序创作内容,应用程序必须由开发人员进行检测以支持编辑器。

TIP
请参阅 AEM Universal Editor 快速入门,查看有关如何配置 AEM 应用程序以使用 Universal Editor 的示例。

访问通用编辑器 accessing

一旦检测到应用程序可以使用通用编辑器,就可以在AEMas a Cloud Service内直接访问通用编辑器,而无需访问AEM。

在AEMas a Cloud Service中访问 accessing-aem

  1. 登录您的AEMas a Cloud Service创作实例。
  2. 使用 站点 控制台 导航到为与要编辑的通用编辑器一起使用而创建的页面。
  3. 编辑页面。
  4. 将打开通用编辑器以编辑选定的页面。
NOTE
在中编辑页面时 站点 控制台, 控制台将打开与页面对应的编辑器 模板: 本文档中描述的通用编辑器,或者 页面编辑器。

直接访问 accessing-directly

  1. 登录通用编辑器。 您需要Adobe ID才能登录和 有权访问通用编辑器。

  2. 登录后,将要编辑的页面的 URL 输入到地址栏中,这样您就可以开始编辑内容,例如文本内容媒体内容

了解 UI ui

UI分为以下几个主要区域。

Universal Editor UI

Experience Cloud 标题 experience-cloud-header

Experience Cloud 标题始终显示在屏幕顶部。它是一个锚点,可让您知道您在 Experience Cloud 中的位置,并帮助您导航到其他 Experience Cloud 应用程序。

Experience Cloud 标题

Experience Manager experience-manager

选择标题左侧的 Adobe Experience Cloud 链接可导航到 Experience Manager 解决方案的根来访问工具,例如 Cloud ManagerCloud Acceleration ManagerSoftware Distribution

“全局导航”按钮

组织 organization

这将显示您当前登录的组织。如果您的Adobe ID与多个组织关联,请选择切换到其他组织。

组织指示器

解决方案 solutions

点按或单击解决方案切换器可快速跳转到其他 Experience Cloud 解决方案。

解决方案切换器

帮助 help

可使用帮助图标快速访问学习和支持资源。

帮助

通知 notifications

此图标带有一个标记,显示当前分配的未完成通知的数量。

通知

用户属性 user-properties

选择代表您的用户的图标以访问您的用户设置。 如果您尚未配置用户图片,系统会随机分配一个图标。

用户属性

通用编辑器工具栏 universal-editor-toolbar

Universal Editor工具栏始终显示在屏幕顶部的正下方 Experience Cloud标头。它为您提供了快速访问权限,以便导航到另一个页面进行编辑以及发布当前页面。

通用编辑器工具栏

“主页”按钮 home-button

使用主页按钮可返回到通用编辑器的起始页

汉堡菜单

在起始页上,您可以输入要用通用编辑器编辑的站点的URL。

起始页

NOTE
要使用通用编辑器编辑的任何页面必须 用于支持通用编辑器。

位置栏 location-bar

位置栏为您显示正在编辑的页面的位置。选择可输入另一个要编辑的页面的地址。

位置栏

TIP
使用热键 L 可打开地址栏。
NOTE
要使用通用编辑器编辑的任何页面必须 用于支持通用编辑器。

身份验证标头设置 authentication-settings

如果需要,请选择身份验证标头设置图标 设置自定义身份验证标头,用于本地开发。

“身份验证标题设置”按钮

模拟器设置 emulator

选择模拟图标以定义通用编辑器呈现页面的方式。

“模拟器”图标

点按或单击模拟图标将显示选项。

模拟选项

默认情况下,编辑器会在桌面布局中打开,其中高度和宽度由浏览器自动定义。

您还可选择模拟移动设备并在 Universal Editor 中:

  • 定义其方向
  • 定义宽度和高度
  • 更改方向

预览模式 preview-mode

在预览模式中,编辑器中呈现的页面与在您发布的服务上看到的一样。这允许内容作者通过单击链接等来导航内容。

预览模式

TIP
使用热键 P 在预览模式之间切换。

打开应用程序预览 open-app-preview

选择打开应用程序预览图标可在自身浏览器选项卡中打开您当前编辑的页面,无需编辑即可预览您的内容。

打开应用程序预览

TIP
使用热键 O(字母 O)可打开应用程序预览。

发布 publish

选择“发布”按钮,以便将更改发布到实时内容以供读者使用。

“发布”按钮

TIP
有关使用 Universal Editor 发布内容的更多信息,请参阅文档使用 Universal Editor 发布内容

编辑器 editor

编辑器占据窗口的大部分区域,并在其中呈现在地址栏中指定的页面。

编辑器

如果编辑器处于预览模式下,则可在内容中导航并可访问链接,但无法编辑内容。

属性边栏 properties-rail

属性边栏始终位于编辑器的右侧。 根据其模式的不同,它可显示在内容中选择的某个组件或页面内容的层次结构的详细信息。

属性边栏

属性模式 properties-mode

在属性模式中,边栏显示当前在编辑器中选择的组件的属性。这是加载页面时属性边栏的默认模式。

属性模式

根据选择的组件类型,可以在属性边栏中显示和修改详细信息。

组件详细信息

并非所有组件都具有可以显示和/或编辑的详细信息。

TIP
使用热键 D 可切换到属性模式。

内容树模式 content-tree-mode

在内容树模式中,边栏显示页面内容的层次结构。

内容树模式

在内容树中选择某个项目时,编辑器将滚动到该内容并将其选定。

内容树

TIP
使用热键 F 可切换到内容树模式。
编辑 edit

编辑时,所选组件的选项会显示在属性边栏中,您可以在此处编辑所选组件。 如果选定的组件是内容片段,您还可以选择编辑按钮。

“编辑”图标

点按或单击“编辑”按钮将在一个新的选项卡中打开内容片段编辑器。这将允许您访问内容片段编辑器的全部功能以编辑关联的内容片段。

根据工作流的需求,您可能需要在通用编辑器中或直接在内容片段编辑器中编辑内容片段。

TIP
使用热键 E 可编辑所选组件。
添加 add

如果在内容树或编辑器中选择了容器组件,则属性边栏上会显示添加选项。

添加图标

点击或单击“添加”按钮将打开一个可用组件的下拉菜单添加到选定的容器。

添加上下文菜单

TIP
使用热键A将组件添加到选定的容器组件。
删除 delete

如果在内容树或编辑器中选择容器组件中的组件,则属性边栏上会显示删除选项。

“删除”图标

点击或单击删除按钮删除该组件。

TIP
使用热键 Shift+Backspace 从容器中删除选定的组件。

编辑内容 editing-content

编辑内容是简单而直观的。将鼠标悬停在编辑器中的内容上时,可编辑内容会以蓝色框突出显示。

可编辑内容用蓝色框突出显示

TIP
默认情况下,点击或单击内容会选择进行编辑。 如果要通过以下链接导航内容,请切换到 预览模式。

根据您选择的内容,您可能有不同的就地编辑选项,并且您可能会在中为内容提供其他信息和选项。 属性边栏。

编辑纯文本 edit-plain-text

您可以通过双击或双击组件就地编辑文本。

编辑内容

按Enter/Return键或选择文本框外部以保存更改。

当您选择选择文本组件时,其详细信息将显示在属性边栏中。 您还可以编辑边栏中的文本。

编辑属性边栏中的文本

此外,可在属性边栏中找到有关文本的详细信息。 一旦焦点离开属性边栏中已编辑的字段,更改将自动保存。

编辑富文本 edit-rich-text

您可以通过双击或双击组件就地编辑文本。

编辑富文本组件

为方便起见,文本上的格式选项和详细信息可在两个位置使用。

  • 上下文菜单 会在富文本块上方打开,并在上下文中提供基本的格式选项。 由于空间限制,某些选项可能隐藏在省略号按钮后面。
  • 属性边栏 显示所有可用的格式选项以及文本。

一旦焦点离开已编辑的字段,更改将自动保存。

编辑媒体 edit-media

您可以在属性边栏中查看其详细信息。

编辑媒体

  1. 点按或单击属性边栏中选定图像的预览。
  2. 资源选择器窗口会打开,以供您选择资源。
  3. 选择以选择新资源。
  4. 选择 选择 以返回到替换资产的属性边栏。

更改将会自动保存到您的内容中。

编辑内容片段 edit-content-fragment

如果您选择 内容片段, 您可以在属性边栏中编辑其详细信息。

编辑内容片段

在选定内容片段的内容模型中定义的字段在属性边栏中显示和可编辑。

如果您选择与内容片段相关的字段,则内容片段会加载到组件边栏中,并且会自动滚动到该字段。

一旦焦点离开属性边栏中已编辑的字段,更改将自动保存。

如果您想在 内容片段编辑器 相反,请单击 编辑按钮 在模式边栏中。

根据工作流的需求,您可能需要在通用编辑器中或直接在内容片段编辑器中编辑内容片段。

向容器添加组件 adding-components

  1. 在内容树或编辑器中选择一个容器组件。

  2. 然后,在属性边栏中选择添加图标。

    选择要添加到容器的组件

该组件被插入到容器中并可以在编辑器中进行编辑。

TIP
使用热键 A 可将组件添加到选定容器。

从容器中删除组件 deleting-components

  1. 在内容树或编辑器中选择一个容器组件。

  2. 选择容器的V形图标以在内容树中展开其内容。

  3. 然后,在内容树中,选择容器内的一个组件。

  4. 在属性边栏中选择删除图标。

    删除组件

选定的组件已删除。

TIP
使用热键 Shift+Backspace 可从容器中删除选定组件。

对容器中的组件重新排序 reordering-components

  1. 在内容树或编辑器中选择一个容器组件。

  2. 如果尚未进入内容树模式,切换到它。

  3. 选择容器的V形图标以在内容树中展开其内容。

  4. 拖动容器内组件旁边的手柄图标表明您可以重新排列它们。拖动组件以对它们在容器内重新排序。

    重新排序组件

  5. 拖动的组件在组件树中变成灰色,而插入点由蓝线表示。释放组件以将其放置在新位置。

组件在内容树和编辑器中重新排序

预览内容 previewing-content

编辑完内容后,您通常需要导航内容以查看它在其他页面内容中的外观。在预览模式中,您可以单击链接来像阅读器一样导航您的内容。内容在编辑器中呈现,就像它将要发布的那样。

在预览模式下,点按或单击内容的反应与对内容的读者一样。 如果要选择要编辑的内容,请切换出 预览模式。

其他资源 additional-resources

要了解如何使用通用编辑器发布内容,请参阅此文档。

要了解有关通用编辑器的技术详细信息的更多信息,请参阅这些开发人员文档。

  • Universal Editor 简介 – 了解 Universal Editor 如何支持在任意实施中编辑任何内容的任何方面,以提供卓越的体验,提升内容速度并提供最先进的开发人员体验。
  • AEM Universal Editor 快速入门– 了解如何获取 Universal Editor 访问权限以及如何对第一个 AEM 应用程序插桩以使用 Universal Editor。
  • Universal Editor 架构 – 了解 Universal Editor 的架构以及数据如何在其服务和层之间流动。
  • 属性和类型 – 了解 Universal Editor 所需的数据属性和类型。
  • Universal Editor 身份验证 – 了解 Universal Editor 如何进行身份验证。
recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab