Les thèmes de Dotclear sont livrés avec une série de fichiers *.html qui sont appelés en fonction du contexte (plus d'explications sur la doc) rangés dans un sous-répertoire tpl du répertoire du thème.

Le contenu d'une page consiste en l'imbrication de boîtes un peu à la manière des matriochkas. Les feuilles de style viendront ensuite donner forme à l'aspect qu'elle offrira mais à moins que vous ne modifiez le contenu des fichiers *.html elles seront toujours structurées sur le même modèle. Je vous propose aujourd'hui le schéma général de toutes les pages du blog. Quelques explications complémentaires figurent après l'image.

radiographie générale

Le « contexte » de <body class="contexte"> n'existe dans aucune page : c'est un mot générique. Dans le fichier home.html, ce sera dc-home ; dans le fichier categories.html, ce sera dc-categories, etc.

point-1.jpg La partie comprise entre <head> et </head> n'est pas affichée dans le blog : elle sert à donner des instructions au navigateur et des informations sur la page : quelle panoplie de caractères utiliser (on appelle ça le codage ou l'encodage des caractères ; les métadonnées, le titre de la fenêtre, la feuille de style à utiliser et encore tout un tas de trucs. Si vous n'y connaissez rien n'y touchez jamais vous ne vous en porterez (et votre blog avec) que mieux.

point-2.jpg Comme d'autres parties de la page, cette partie contient systématiquement la même chose. Pour ne pas avoir à le réinscrire dans chaque fichier de contexte on fait appel à un fichier du thème reconnaissable à l'underscore (trait de soulignement) qui précède leur nom. Ici les templates indiquent {{tpl:include src="_top.html"}}. Ce fichier _top.html contient la div top et le prélude.

point-3.jpg Cette partie est celle qui va varier complètement d'un contexte à l'autre : à l'accueil par exemple on aura une liste de billets dans le content, dans les pages de billet seul le billet, les commentaires et le formulaire de commentaires, etc. Des radiographies spécifiques à chacun des contextes pour cette partie suivront dans les jours qui viennent.

point-4.jpg Ici viennent s'insérer les deux modules bandeau de navigation et bandeau d'extra dont vous aurez décidé de la composition grâce au panneau « widgets de présentation » de votre espace d'administration (en savoir plus).

point-5.jpg Comme pour le top et le prélude, l'élément footer est considéré a priori comme récurrent à l'identique sur toutes les pages du blog. On passe ici aussi par l'insertion du fichier _footer.html dans les différents fichiers de contexte.