Les templates contrôlent l'apparence d'un site Joomla : la mise en page, les couleurs, les positions de modules et tous les autres éléments visuels sont définis par le template qui lui est assigné. Joomla est livré avec deux templates, Atum pour l'administration et Cassiopeia pour le frontal, et chacun peut être personnalisé ou remplacé.

Cette section couvre les bases du fonctionnement des templates, les moyens de personnaliser Cassiopeia et de s'appuyer dessus en toute sécurité, le remplacement de son image de marque par défaut, et quelques astuces pratiques pour varier l'apparence d'un site d'une page à l'autre.

Premiers pas avec les templates

Ce qu'est un template et comment commencer à façonner l'apparence de Cassiopeia à l'aide de ses paramètres intégrés.

  • Les bases des templates – Ce qu'est un template Joomla, les deux templates avec lesquels chaque site démarre (Atum pour l'administration, Cassiopeia pour le frontal), et les options de personnalisation couvertes ailleurs dans cette section.
  • Personnalisation de Cassiopeia – Utiliser les options de style intégrées de Cassiopeia et un fichier CSS personnalisé pour modifier l'image de marque, les couleurs et la mise en page sans modifier directement le code du template.

Personnalisation des templates

Des moyens de modifier le rendu et la structure d'un template au-delà de ses paramètres intégrés, depuis la redéfinition du rendu d'une extension jusqu'à la construction d'un template qui survit aux mises à jour.

  • Surcharges de template – Copier et modifier les fichiers de sortie d'une extension pour changer son balisage, avec une surcharge du module de connexion comme exemple pratique.
  • Mises en page de template – Créer des mises en page alternatives pour les modules, composants, catégories et liens de menu afin que différentes instances puissent avoir une apparence différente.
  • Templates enfants – Construire un template qui hérite de Cassiopeia et ne surcharge que les fichiers modifiés, afin que les mises à jour du template n'écrasent pas vos personnalisations.
  • Le fichier templateDetails.xml de Cassiopeia – Le fichier XML qui définit les métadonnées d'un template, les positions de modules, la prise en charge des langues et les paramètres configurables.

Image de marque et icônes

Remplacer les icônes et le logo par défaut fournis avec Joomla pour correspondre à l'image de marque de votre site.

  • Favicons – Créer et installer la petite icône affichée dans les onglets du navigateur, aux formats SVG et ICO attendus par Joomla.
  • Logos SVG de template – Concevoir un logo vectoriel personnalisé dans Inkscape et configurer Joomla pour utiliser un fichier SVG comme graphique de marque du site.
  • Icônes standards – Utiliser le jeu d'icônes Font Awesome intégré à Cassiopeia et Atum, et trouver le nom d'une icône dans la bibliothèque complète.

Astuces sur les templates

Des techniques pratiques pour varier l'apparence d'un site d'une page à l'autre plutôt que sur l'ensemble du site.

  • Changer de template – Définir le style de template par défaut d'un site et en assigner un différent à des pages spécifiques via les liens de menu.
  • Page d'accueil dans un style différent – Donner à la page d'accueil son propre style à l'aide d'assignations de modules, de styles personnalisés, de surcharges ou d'un template enfant.
  • Styles de modules et de menus – Ajouter des classes CSS personnalisées à des modules ou liens de menu individuels et les styliser dans le fichier user.css.