文档AEM as a Cloud Service用户指南

站点主题 site-themes

Last update: Wed Jul 19 2023 00:00:00 GMT+0000 (Coordinated Universal Time)

创建对象：

  • Admin

了解如何使用 AEM 站点主题来自定义站点的样式和设计。

概述 overview

AEM 站点主题是一个包，其中包含的 CSS、JavaScript 和静态资源定义了 AEM 站点样式并符合 AEM 站点主题结构。

使用 AEM 站点模板创建的站点允许轻松下载、自定义和重新部署主题。

NOTE
不应混淆 AEM 站点主题与 AEM 站点模板。AEM 站点主题仅包含 AEM 站点的样式信息。AEM 站点模板定义站点结构和初始内容，并包含 AEM 站点主题，以便快速创建站点。

使用站点主题 using-themes

通过两种不同的方式使用站点主题：

  • 在创建站点时，它们用作站点模板的一部分来定义样式。
  • 它们是在基于站点模板创建站点后下载的，因此，前端开发人员可以进一步自定义样式。
TIP
可以在快速站点创建历程中找到从模板创建站点并自定义其主题的过程的端到端描述。

站点主题结构 structure

站点主题只是带有逻辑结构的包，它清楚地反映了包内容的目的。站点主题具有以下典型的前端项目结构。

  • src/main.ts：JS & CSS 主题的主要入口点
  • src/site：应用于整个站点的 JS & CSS 文件
  • src/components：特定于 AEM 组件的 JS & CSS 文件
  • src/resources：图标、徽标和字体等静态文件

标准站点主题 standard-site-theme

Adobe 提供了一个最佳实践参考主题，您可以基于此主题创建自己的主题。标准站点主题可在 GitHub 上找到。

开发站点主题 developing-themes

Adobe 提供 AEM 站点主题生成器作为一组用于创建新站点主题的脚本。

GitHub 上提供了 AEM 站点主题生成器与使用文档。需要前端开发经验才能自定义主题。

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab