L'objectif de cet article est de permettre qu'une feuille de style spécifique à une catégorie (ou pourquoi pas une pour chaque catégorie) soit appelée lorsqu'un article de cette même rubrique est affiché à l'écran ou lorsque le vistiteur a demandé l'affichage de tous les billets d'une catégorie particulière.

Envie de faire ça ? Zou !

Donner une présentation spécifique à une catégorie, voire à chaque catégorie nécessite les étapes suivantes :

Créer un thème complet :

Pour pouvoir varier les feuilles de styles selon les catégories, vous devrez modifier plusieurs fichiers ; il est préférable (voire impératif à moins d’aimer prendre des risques) de créer son propre thème en dupliquant le dossier default (avec tous les fichiers qu’il comprend) contenu dans le dossier themes, puis de procéder aux modifications du fichier desc.xml ainsi que la procédure est déjà décrite dans ce billet ici.

Une feuille de style spécifique

Vous devrez créer une feuille de styles pour chaque rubrique à laquelle vous souhaitez voir appliqué un style particulier. Cette feuille de style n’a pas besoin de reprendre tous les éléments, elle doit seulement comporter les paramètres qui diffèrent de la feuille de style générale.
Important : Ces feuilles de style doivent s’appeler exactement comme le nom URLisé, y compris en tenant compte des majuscules[1]. Exemple : la feuille de styles de la rubrique DotClear devra s’appeler DotClear.css, celle de la rubrique Dotclear... Dotclear.css (bravo ! j’ai bien vu que vous aviez tous deviné la réponse, je suis fière de vous !).

Si aucune feuille de style ne porte le nom de la rubrique, c’est le style de la feuille de style générale qui s’appliquera.

Les fichiers à modifier :

  • Le fichier prepend.php
  • Le fichier template.php
prepend.php

Ouvrez le fichier prepend.php de votre thème personnalisé : nous allons y créer une fonction qui attribue à une rubrique la feuille de styles portant son nom.

Après ces quatre lignes :

# Ajout des fichiers du template pour le cache
$mod_files[] = dirname(__FILE__).'/list.php'; 
$mod_files[] = dirname(__FILE__).'/post.php'; 
$mod_files[] = dirname(__FILE__).'/form.php';

Copier les lignes suivantes :

function dcCatCSS($string = '<link rel="stylesheet" type="text/css" href="%s" />') {
   if ($GLOBALS['cat_id'] || $GLOBALS['mode'] == 'post') {
       $cssName = ($GLOBALS['cat_id']) ? $GLOBALS['cat_id'] : $GLOBALS['news']->arry_data[0]['cat_libelle_url'];
    } else {
       $cssName = 'style';
   }
   $cssFullName = $GLOBALS['theme_uri'].dc_theme.'/'.$cssName.'.css';
   printf ($string,$cssFullName);
}
template.php

Ensuite il faudra indiquer dans la source de votre page où trouver les feuilles de style. Ouvrez le fichier template.php de votre thème. Chercher les lignes :

<link rel="stylesheet" type="text/css"
href="<?php dcInfo('theme'); ?>/style.css" media="screen" />

et ajouter juste en dessous cette ligne :

<?php dcCatCSS(); ?>

Voilà, il ne vous reste plus qu'à faire fonctionner votre imagination pour inventer quoi faire de cette fanfreluche. Amusez-vous bien et, comme d'habitude, n'hésitez pas à proposer des améliorations - sur la forme ou sur le fond - de ce tutoriel dans les commentaires.

Notes

[1] Le nom URLisé est celui adopté pour nommer la catégorie dans l'adresse URL. Par exemple pour ce site, la rubrique Paillettes et fanfreluches a pour nom URLisé Paillettes-et-fanfreluches.