Temas do site site-themes
Saiba como temas de site do AEM podem ser usados para personalizar o estilo e o design do site.
Visão geral overview
Um tema de site do AEM é um pacote que contém o CSS, o JavaScript e os recursos estáticos que definem o estilo do seu site do AEM e está em conformidade com a estrutura de um tema de site do AEM.
Os sites criados com modelos de site do AEM permitem fácil download, personalização e reimplantação dos temas.
Usar temas de site using-themes
Os temas de site são usados de duas maneiras diferentes:
- Eles são usados como parte de um modelo de site para definir o estilo durante a criação de um site.
- Eles são baixados depois de criar um site com base em um modelo de site, para que um desenvolvedor de front-end possa personalizar ainda mais o estilo.
Estrutura de tema do site structure
Os temas do site são pacotes com uma estrutura lógica que reflete claramente a finalidade do conteúdo do pacote. Para um projeto de front-end típico, o Adobe recomenda a seguinte estrutura para um tema de site:
src/theme.ts: o principal ponto de entrada do seu tema JS e CSSsrc/site: arquivos JS e CSS que se aplicam a todo o sitesrc/components: arquivos JS e CSS específicos para componentes do AEMsrc/resources: arquivos estáticos como ícones, logotipos e fontes
Dependendo das necessidades específicas do projeto, a estrutura do tema pode variar, desde que o ponto de entrada principal, src/theme.ts, seja preservado.
Tema do site padrão standard-site-theme
A Adobe fornece um tema de referência de práticas recomendadas que pode ser usado como base para a criação de seu próprio tema. O tema de site padrão está disponível no GitHub.
Desenvolver temas de site developing-themes
A Adobe fornece um Criador de temas de site do AEM como um conjunto de scripts para criar novos temas de site.
O Criador de temas de site do AEM está disponível junto com a documentação de uso no GitHub. É necessária experiência em desenvolvimento de front-end para personalizar o tema.