从模板创建站点

了解如何使用站点模板快速创建新的 AEM 站点。

迄今为止的故事

在 AEM 快速站点创建历程的上一个文档了解 Cloud Manager 和快速站点创建工作流中,您已了解 Cloud Manager 以及它如何将新的快速站点创建流程联系起来,您现在应:

  • 了解 AEM Sites 和 Cloud Manager 如何协作来推动前端开发
  • 了解如何在不具有 AEM 知识的情况下将前端自定义步骤与 AEM 完全分离开来。

本文基于这些基础之上,因此您可以执行第一个配置步骤并从模板创建一个新站点,之后您可以使用前端工具对其进行自定义。

目标

本文档有助于您了解如何使用站点模板快速创建新的 AEM 站点。阅读本文档后,您应:

  • 了解如何获取 AEM 站点模板。
  • 了解如何使用模板创建新站点。
  • 了解如何从新站点下载模板以提供给前端开发人员。

负责角色

此历程的这一部分适用于 AEM 管理员。

站点模板

站点模板是一种将基本站点内容组合成方便且可重用的包的方法。站点模板通常包含基本站点内容和结构以及站点样式信息,以便快速启动新站点。实际结构如下:

  • files:包含 UI 套件、XD 文件和可能的其他文件的文件夹
  • previews:包含站点模板的屏幕截图的文件夹
  • site:为从此模板创建的每个站点复制的内容的内容包,例如页面模板、页面等
  • theme:用于修改站点外观的模板主题的来源,包括 CSS、JavaScript 等

模板具有强大的功能,它们可重用,这使得内容作者能够快速创建站点。由于您可以在 AEM 安装中使用多个模板,因此可以灵活地满足各种业务需求。

注意

不要将站点模板与页面模板混淆。此处描述的站点模板定义了站点的整体结构。页面模板定义了单个页面的结构和初始内容。

获取站点模板

最简单的入门方法是从其 GitHub 存储库下载最新版本的 AEM 标准站点模板。

下载后,您可以像上传任何其他包一样将它上传到您的 AEM 环境。如果您想了解有关此主题的更多信息,请参阅“其他资源”部分,了解有关如何使用包的详细信息。

小贴士

可以自定义 AEM 标准站点模板以满足您的项目需求,并且可以消除进一步自定义的需要。但这个主题超出了此历程的范围。有关更多信息,请参阅标准站点模板的 GitHub 文档。

小贴士

您也可以选择在项目工作流中从来源构建模板。但这个主题超出了此历程的范围。有关更多信息,请参阅标准站点模板的 GitHub 文档。

安装站点模板

使用模板创建新站点是非常轻松的。

  1. 登录您的 AEM 创作环境并导航到站点控制台

    • https://<your-author-environment>.adobeaemcloud.com/sites.html/content
  2. 点按或单击屏幕右上方的​创建,然后从下拉菜单中选择​从模板创建站点

    从模板创建新站点

  3. 在创建站点向导中,点按或单击左栏顶部的​导入

    站点创建向导

  4. 在文件浏览器中,找到之前下载的模板并点按或单击​上传

  5. 上传模板后,该模板将显示在可用模板列表中。点按或单击模板以将其选定(它还在右栏中显示有关模板的信息),然后点按或单击​下一步

    选择模板

  6. 为站点提供标题。可以提供站点名称,也可以从标题生成站点名称(如果被忽略)。

    • 站点标题显示在浏览器标题栏中。
    • 站点名称会成为 URL 的一部分。
  7. 点按或单击​创建,将从站点模板创建新站点。

    新站点的详细信息

  8. 在显示的确认对话框中,点按或单击​完成

    “成功”对话框

  9. 在站点控制台中,新站点是可见的,并且可以导航以探索其由模板定义的基本结构。

    新站点结构

内容作者现在可以开始创作。

是否需要进一步自定义?

站点模板非常强大且灵活,可以为一个项目创建任意数量的模板,从而轻松创建站点变体。根据对您使用的站点模板执行的自定义级别,您甚至可能不需要额外的前端自定义。

  • 如果您的站点不需要额外的自定义,恭喜您!您的历程到此结束!
  • 如果您仍需要额外的前端自定义,或者您只是想了解整个流程以防将来需要进行自定义,请继续阅读。

示例页面

如果您确实需要额外的前端自定义,请记住,前端开发人员可能不熟悉您的内容的详细信息。因此,最好是为开发人员提供典型内容,在自定义主题时,该内容可以用作参考基础。一个典型示例是站点主语言的主页。

  1. 在站点浏览器中,导航到站点主语言的主页,再点按或单击页面以将其选定,然后点按或单击菜单栏中的​编辑

    典型主页

  2. 在编辑器中,选择工具栏中的​页面信息​按钮,然后选择​以发布的形式查看

    编辑主页

  3. 在打开的选项卡中,从地址栏中复制内容的路径。它类似于 /content/<your-site>/en/home.html?wcmmode=disabled

    主页

  4. 保存路径以便稍后提供给前端开发人员。

下载主题

现已创建站点,可以下载模板生成的站点主题,并将它提供给前端开发人员进行自定义。

  1. 在站点控制台上,显示​站点​边栏。

    显示站点边栏

  2. 点按或单击新站点的根,然后点按或单击站点边栏中的​下载主题源

    下载主题源

您的下载文件中现已拥有主题源文件的副本。

设置代理用户

为了让前端开发人员使用您站点中的实际 AEM 内容预览自定义项,您必须设置代理用户。

  1. 在 AEM 中,从主导航转至​工具 -> 安全性 -> 用户

  2. 在用户管理控制台中,点按或单击​创建

    用户管理控制台

  3. 在​创建新用户​窗口中,您必须至少提供:

    • ID – 记下此值,因为您必须将它提供给前端开发人员。
    • 密码 – 将此值安全地保存在密码库中,因为您必须将它提供给前端开发人员。

    新用户详细信息

  4. 在​​选项卡上,将代理用户添加到 contributors 组。

    • 键入 contributors 一词会触发 AEM 的自动完成功能,以便轻松选择组。

    添加到组

  5. 点按或单击​保存并关闭

您现在已完成配置。内容作者现在可以开始在站点上创建内容,为历程的下一步中的前端自定义做准备。

下一步

现在您已完成 AEM 快速站点创建历程的这一部分,您应:

  • 了解如何获取 AEM 站点模板。
  • 了解如何使用模板创建新站点。
  • 了解如何从新站点下载模板以提供给前端开发人员。

在此知识的基础上继续您的 AEM 快速站点创建历程,接下来查看文档设置您的管道,其中您将创建前端管道来管理站点主题的自定义。

其他资源

我们建议您查看文档设置管道来继续快速站点创建历程的下一部分,以下是一些其他可选资源,这些资源对本文档中提到的一些概念进行了更深入的探究,但并非继续此历程所必需的。

  • AEM 标准站点模板 – 这是 AEM 标准站点模板的 GitHub 存储库。
  • 创建和组织页面 – 如果您希望在从模板创建 AEM 站点后进一步对其进行自定义,可参考本指南以详细了解如何管理 AEM 站点的页面。
  • 如何使用包 – 可使用包导入和导出存储库内容。本文档说明了在 AEM 6.5 中使用包的方式,此方式也适用于 AEMaaCS。
  • 站点管理文档 – 查看有关站点创建的技术文档,了解有关快速站点创建工具的功能的更多详细信息。

在此页面上