La coquette se passe des class="spip"

Lorsque vous affichez le code source d’une page réalisée avec SPIP, vous découvrez une floppée de class="spip". Kezako ? Ces sélecteurs CSS sont associés au code généré par SPIP, notamment aux « raccourcis SPIP », mais aussi aux formulaires et aux images, logos et documents, ceci afin de permettre leur personnalisation via CSS, comme l’explique cet article de la documentation : « SPIP et les feuilles de style ».

Cependant ces bienveillants sélecteurs ne sont pas tous utiles. D’aucuns se demandent même s’ils servent vraiment à quelque chose, suggérant de les supprimer tous, sans autre forme de procès (voir le billet « class="spip" »).

J’ai profité de la refonte de mon site pour tester leur nécessité. Diagnostic ? Oui, SPIP souffre un peu de « classite aïgue » [1]. Oui, les class="spip" sur les paragraphes, les intertitres, le gras, l’italique, etc. sont effectivement superflues, puisqu’on peut styler ces éléments autrement, en se servant de l’héritage. Par contre, tout n’est pas à jeter : essayez donc de vous passer de spip_documents ou de forml !

Dans le souhait d’alléger le code de mes pages, de le rendre propre et coquet, je n’ai gardé que le strict minimum de sélecteurs que j’ai préféré renommer, la recrudescence de spip_machin et spip_truc semblant quelque peu mégalomaniaque.

J’ai donc bricolé un filtre qui, passé sur chaque balise SPIP, supprime ou renomme les sélecteurs du code généré :

<?php

// La coquette se passe des class="spip" !
// Cf.: http://romy.tetue.net/spip.php?article415
function coquette($letexte) {
        $letexte = str_replace('i class="spip"', 'i', $letexte);
        $letexte = str_replace('strong class="spip"', 'strong', $letexte);
        $letexte = str_replace('p class="spip"', 'p', $letexte);
        $letexte = str_replace('p class="spip_note"', 'p', $letexte);
        $letexte = str_replace('h3 class="spip"', 'h3', $letexte);
        $letexte = str_replace('hr class="spip"', 'hr', $letexte);
        $letexte = str_replace('class="thumb spip_logo"', '', $letexte);
        $letexte = str_replace('class=\'thumb spip_logo\'', '', $letexte);
        $letexte = str_replace('blockquote class="spip"', 'blockquote', $letexte);
        $letexte = str_replace('<code class="spip_code"', '<code', $letexte);
        $letexte = str_replace('<code class=\'spip_code\'', '<code', $letexte);
        $letexte = str_replace('<form action="/" method="get"><div><textarea', '<textarea', $letexte);
        $letexte = str_replace('</textarea></div></form>', '</textarea>', $letexte);
        $letexte = str_replace(' class=""', '', $letexte);
        // Ensuite je renomme :
        $letexte = str_replace('external', 'out', $letexte);
        $letexte = str_replace('external', 'out', $letexte);
        $letexte = str_replace('external', 'out', $letexte);
        $letexte = str_replace('spip_note', 'note', $letexte);
        $letexte = str_replace('spip_cadre', 'cadre', $letexte);
return $letexte;
}

?>

1. Copiez ce code dans votre fichier mes_fonctions.php ;
2. Appliquez ce filtre aux balises SPIP de votre choix, de cette façon : [(#TEXTE|coquette)] ;
3. Côté CSS, voici les sélecteurs à utiliser, les nouveaux étant signalés en gras dans la colonne centrale :