Creer un Theme

Introduction

Le CMS 299Ko permet l'utilisation de thèmes personnalisés pour modifier l'apparence du site. Il supporte également les thèmes enfants, qui permettent de surcharger certains fichiers d'un thème parent sans le modifier directement.


Création d'un Thème

Pour créer un thème, suivez ces étapes :

  1. Créez un dossier dans theme/ avec le nom de votre thème.
  2. Ajoutez un fichier infos.json pour définir les métadonnées du thème :
{
    "name": "Nom du Thème",
    "version": "1.0",
    "authorEmail": "email@exemple.com",
    "authorWebsite": "https://exemple.com",
    "parentName": ""
}
  1. Créez les fichiers essentiels :
    • layout.tpl : Structure principale du thème
    • styles.css : Feuille de style du thème
    • scripts.js (optionnel) : Fichier JavaScript du thème
    • infos.json : Informations sur votre thème

Exemple de structure :

/theme/
  /mon-theme/
    - infos.json
    - layout.tpl
    - styles.css
    - scripts.js
    /template/
      - core.404.tpl
        - blog.list.tpl

Modifier un Thème

Pour modifier un thème existant, vous pouvez :

  • Modifier directement les fichiers dans son dossier
  • Ajouter ou supprimer des templates dans template/
  • Modifier styles.css et scripts.js

Création d'un Thème Enfant

Un thème enfant permet d'hériter d'un thème parent tout en pouvant surcharger certains fichiers.

1. Création du dossier

Créez un dossier dans theme/, comme pour un thème normal.

2. Définition du parent dans infos.json

Ajoutez le nom du thème parent dans parentName :

{
    "name": "Mon Thème Enfant",
    "version": "1.0",
    "authorEmail": "email@exemple.com",
    "authorWebsite": "https://exemple.com",
    "parentName": "mon-theme-parent"
}

3. Ajouter des fichiers personnalisés

Vous pouvez :

  • Ajouter un styles.css pour modifier le design
  • Ajouter layout.tpl pour modifier la structure
  • Créer des fichiers dans template/ pour surcharger ceux par défaut

Exemple de surcharge de la page d'erreur 404.tpl :

/themes/
  /mon-theme-enfant/
    - infos.json
    - styles.css
    /template/
      - core.404.tpl (modifié par rapport au parent)

Chargement des Fichiers dans un Thème

La classe Theme gère le chargement des fichiers de la manière suivante :

  • getLayout(): Retourne le chemin de layout.tpl en vérifiant d'abord dans le thème enfant, puis dans le parent.
  • getCoreTemplatePath($templateName): Cherche un template dans template/core.$templateName.tpl du thème enfant, puis dans le parent si n'est pas trouvé.
  • getPluginTemplatePath($pluginName, $templateName): Cherche un template de plugin dans template/$pluginName.$templateName.tpl.
  • getCSSLinks(): Charge styles.css du ou des thèmes parents et du thème actif.
  • getJSLinks(): Charge scripts.js du thème enfant ou du parent.

Ainsi, un thème enfant surcharge uniquement les fichiers qu'il redéfinit, et le reste est chargé depuis le parent.


Mises à jour

Si vous souhaitez modifier un thème existant, sachez qu'il vaut mieux créer un thème enfant de celui-ci, et de modifier les quelques éléments voulus. Chaque mise à jour du thème par son auteur effacera inévitablement vos modifications si vous utilisez un thème existant, alors n'attendez pas pour créer le votre.


Conclusion

Avec ce système, vous pouvez facilement créer et personnaliser des thèmes tout en gardant une structure modulaire et réutilisable. Un thème enfant permet de modifier un thème existant sans le modifier directement, facilitant ainsi les mises à jour et la maintenance.

This page was last edited on 2025-03-31 19:02

Powered by Wiki|Docs

This page was last edited on 2025-03-31 19:02

Max Koder | 299Ko CMS
GPL v3

Powered by Wiki|Docs