Os temas controlam a aparência de um site Joomla: a disposição (layout), as cores, as posições dos módulos e todos os demais elementos visuais são definidos pelo tema atribuído a ele. O Joomla vem com dois temas, o Atum para o administrador e o Cassiopeia para o site, e ambos podem ser personalizados ou substituídos.
Esta seção aborda o básico de como os temas funcionam, formas de personalizar o Cassiopeia e construir sobre ele com segurança, substituindo sua marca padrão, além de algumas dicas práticas para variar a aparência de um site de página para página.
Primeiros passos com temas
O que é um tema e como começar a moldar a aparência do Cassiopeia usando suas opções integradas.
- Noções básicas de temas – O que é um tema Joomla, os dois temas com os quais todo site começa (Atum para o administrador, Cassiopeia para o site) e as opções de personalização abordadas no restante desta seção.
- Personalização do Cassiopeia – Usando as opções de estilo integradas do Cassiopeia e um arquivo CSS personalizado para alterar a marca, as cores e a disposição (layout) sem editar diretamente o código do tema.
Personalizando temas
Formas de alterar a saída e a estrutura de um tema além de suas opções integradas, desde sobrescrever a forma como uma extensão é renderizada até construir um tema que sobrevive a atualizações.
- Sobreposições de tema – Copiando e modificando os arquivos de saída de uma extensão para alterar sua marcação, usando uma sobreposição do módulo de acesso como exemplo prático.
- Disposições (layouts) de tema – Criando disposições (layouts) alternativas para módulos, componentes, categorias e itens de menu, de modo que diferentes instâncias possam ter aparências diferentes.
- Temas filhos – Construindo um tema que herda do Cassiopeia e sobrescreve apenas os arquivos que você altera, para que as atualizações do tema não sobrescrevam suas personalizações.
- templateDetails.xml do Cassiopeia – O arquivo XML que define os metadados de um tema, as posições dos módulos, o suporte a idiomas e as opções configuráveis.
Marca e ícones
Substituindo os ícones e o logotipo padrão que acompanham o Joomla para combinar com a marca do seu site.
- Favicons – Criando e instalando o pequeno ícone exibido nas abas do navegador, nos formatos SVG e ICO esperados pelo Joomla.
- Logotipos SVG de tema – Projetando um logotipo vetorial personalizado no Inkscape e configurando o Joomla para usar um arquivo SVG como gráfico de marca do site.
- Ícones padrão – Usando o conjunto de ícones Font Awesome integrado ao Cassiopeia e ao Atum, e encontrando o nome de um ícone na biblioteca completa.
Dicas de tema
Técnicas práticas para variar a aparência de um site de página para página, em vez de em todo o site.
- Alternando temas – Definindo o estilo de tema padrão de um site e atribuindo um estilo diferente a páginas específicas por meio de itens de menu.
- Página inicial com um estilo diferente – Dando à página inicial uma aparência própria usando atribuições de módulos, estilos personalizados, sobreposições ou um tema filho.
- Estilos de módulos e menus – Adicionando classes CSS personalizadas a módulos ou itens de menu individuais e estilizando-os no arquivo user.css.