Temas del sitio site-themes
Descubra cómo se pueden utilizar los temas del sitio de AEM para personalizar el estilo y el diseño del sitio.
Información general overview
Un tema del sitio de AEM es un paquete que contiene CSS, JavaScript y recursos estáticos que definen el estilo del sitio de AEM y cumplen la estructura de un tema de sitio de AEM.
Los sitios creados con plantillas de sitio de AEM permiten descargar, personalizar y redistribuir fácilmente los temas.
Uso de temas del sitio using-themes
Los temas del sitio se utilizan de dos formas:
- Se emplean como parte de una plantilla del sitio para definir el estilo cuando se crea un sitio.
- Se descargan después de crear un sitio basado en una plantilla del sitio, para que un desarrollador front-end pueda personalizar aún más el estilo.
Estructura del tema del sitio structure
Los temas del sitio no son más que paquetes con una estructura lógica que refleja con claridad el propósito del contenido del paquete. Para un proyecto front-end típico, Adobe recomienda la siguiente estructura para un tema del sitio:
src/theme.ts: el punto de entrada principal del tema de JS y CSSsrc/site: archivos JS y CSS que se aplican a todo el sitiosrc/components: archivos JS y CSS específicos de componentes de AEMsrc/resources: archivos estáticos como iconos, logotipos y fuentes
Según las necesidades específicas del proyecto, la estructura del tema puede variar siempre que se conserve el punto de entrada principal src/theme.ts.
Tema estándar del sitio standard-site-theme
Adobe proporciona un tema de referencia de prácticas recomendadas que puede usar como base para crear su propio tema. El tema estándar del sitio está disponible en GitHub.
Desarrollo de temas del sitio developing-themes
Adobe proporciona un Generador de temas del sitio de AEM como un conjunto de scripts para la creación de nuevos temas del sitio.
El Generador de temas del sitio de AEM está disponible junto con la documentación de uso en GitHub. Para personalizar el tema, se necesita una experiencia de desarrollo front-end.