Nous allons présenter, ici, la structure d'un thème PHPBoost 5.0.
Nous avons pris pour exemple le thème de base.
De plus au niveau de l'architecture globale, les thèmes se situent dans le dossier /templates/
Un thème est composé de plusieurs types de fichiers :
Le répertoire d'un thème est constitué de la manière suivante :
On retrouve à la racine du thème les fichiers
body.tpl,
config.ini et
frame.tpl.
Le fichier body.tpl
Le fichier
body.tpl contient les éléments de la balise html <body> qui encadre le code html.
On y retrouve l'architecture même du site web avec le positionnement des éléments tels que l'en-tête, la colonne de gauche, le contenu central ou le pied de page. Si vous souhaitez positionner les éléments d'une manière différente, c'est le fichier à modifier.
Le fichier
config.ini permet d'afficher des informations sur le thème et de lui attribuer une configuration par défaut qui sera appliquée lorsque celui-ci sera installé.
L'article
Fichier de configuration d'un thème config.ini détaille le contenu du fichier afin de vous permettre de le modifier simplement.
Sur les thèmes officiels autres que celui de base, vous trouverez une dernière ligne qui permet de surveiller les mises à jour pour le thème.
Le fichier
frame.tpl contient la partie structurante de la page html. Il contient la balise d'en-tête HTML <head>.
La modification de ce fichier n'est nécessaire que si vous souhaitez ajouter un nouveau fichier css ou du code javascript sur l'ensemble du site.
Le répertoire images contient les images du thème qui ne sont pas associées à un fichier CSS.
Par défaut, le répertoire ne contient que l'image
no_avatar.png.
Le répertoire lang contient un répertoire par langue.
Par défaut, celui-ci contient un répertoire
english et
french.
Chaque répertoire ne contient qu'un seul fichier
desc.ini.
Le fichier desc.ini contient les éléments identifiants le thème que l'on retrouve dans l'administration des thèmes du panneau d'administration. On y retrouve le nom du thème
name, la description
desc et les couleurs principales
main_color.
La valeur de name peut être différente du nom du répertoire.
Code TEXT : name="Base"
desc="The PHPBoost official theme."
main_color="White, Blue"
Le répertoire thème contient les différents fichiers CSS du thème ainsi que les images associées à ce thème.
Chaque thème est constitué des 7 fichiers CSS suivant :
Vous retrouverez le contenu de chaque fichier dans l'article associé à chaque fichier.
Le répertoire images du sous dossier
theme, contient les images appelées par les fichiers CSS ou TPL du thème.
Pour le thème de base on y trouve :
La grande différence avec les versions 4.0 et antérieures est la quantité d'images. L'utilisation de la librairie Font-Awesome a permis de réduire considérablement le nombre d'image dans un thème et donc la taille. Si néanmoins vous souhaitez revenir à des images, lisez l'article suivant
Remplacer les icones FontAwesome par des images pour voir un exemple de modification.
Ce répertoire n'est pas obligatoire, il est nécessaire uniquement lorsque vous souhaitez appliquer des modifications au design d'un module de façon spécifique à un thème.
S'il existe, son contenu serait le suivant :
Il contient un répertoire par module.
Le nom du répertoire doit être identique au module que l'on souhaite surcharger. Les fichiers contenus dans ce répertoire remplacent les fichiers des modules.
Chaque répertoire de module peut contenir le ou les fichiers .tpl ou .css que l'on souhaite remplacer.
Pour en savoir plus sur la personnalisation d'un thème, vous pouvez consulter
cet article.
Il est préférable de modifier un thème que de modifier le module. Cela permet notamment de faciliter les mises à jours des modules.