Pas d’accès SQL
Ce plugin permet de choisir une couleur pour chaque rubrique du site, au travers d’une roue chromatique accessible dans l’espace privé.
[SPIP 2.0] Ce plugin répond à un besoin extrêmement fréquent (en tout cas pour moi) de la manière la plus simple possible : il s’agit de pouvoir indiquer une couleur différente pour chaque rubrique (en général : pour les grands secteurs du site).
Jusqu’à présent, je m’en sortais en ajoutant un champ #EXTRA aux rubriques : solution parfaitement fonctionnelle, mais pas très amusante au niveau de l’interface...
Une fois activé, ce plugin ne demande aucune configuration supplémentaire. Il ajoute simplement un pavé supplémentaire dans la colonne de gauche des pages des rubriques (naviguer) :
La roue chromatique permet de sélectionner directement la couleur. La valeur hexadécimale de cette couleur apparaît alors dans une case juste en dessous.
On peut modifier la couleur de deux façons :
— visuellement, en cliquant et glissant dans la roue chromatique ; la valeur hexadécimale est immédiatement reportée dans le champ texte en dessous ;
— en modifiant directement la valeur hexadécimale dans le champ texte (par exemple pour recopier une valeur récupérée depuis Photoshop ou The Gimp) ; la roue chromatique change immédiatement.
Une fois la couleur correctement sélectionnée, il suffit de cliquer « Enregistrer ». (Cette fonction n’est pas AJAX : enregistrer provoque le rechargement de la page.)
Pour récupérer la couleur d’une rubrique, il suffit d’indiquer dans le squelette :
On peut utiliser, évidemment, cette fonction :
— dans les feuilles de style,
— dans les filtres d’images (par exemple coloriser une image en gris 50% avec image_sepia) et d’images typographiques (fixer la couleur de l’image typo).
Il faut bien noter que ce filtre retourne la valeur hexadécimale sans le dièse qui accompagne habituellement de telles valeurs. En effet, les filtres d’image, les filtres typo et les filtres de couleurs de SPIP fonctionnent sans le dièse.
Si l’on veut utiliser cette fonction pour régler les CSS, il faut donc penser à ajouter le dièse. Ce qui donne par exemple :
Par défaut, une rubrique n’a pas de couleur. Dans ce cas, le pavé de la roue chromatique apparaît plié. Quand une rubrique est dotée d’une couleur, le pavé apparaît déplié.
Une fois qu’on a fixé une couleur à une rubrique, on peut la supprimer en cliquant, sous la roue chromatique, sur « Supprimer la couleur ».
Si une rubrique n’a pas de couleur, le filtre couleur_rubrique ne retourne rien (chaîne vide). Cela permet d’utiliser toutes les subtilités habituelles des filtres SPIP : ajouter un filtre |sinon pour indiquer une couleur par défaut, ou jouer avec les éléments conditionnels des balises.
L’intérêt de cette fonction est, évidemment, de ne pas avoir à fixer une couleur pour toutes les rubriques et sous-rubriques du site. Le cas typique consiste à fixer des couleurs pour les secteurs du site, les sous-rubriques héritant de la couleur du secteur dans lequel elles se trouvent.
Ce plugin ne propose pas de fonction pour qu’une sous-rubrique « hérite » de la couleur d’une rubrique parente. Cependant, cela se réalise facilement avec une boucle :
(Vraiment, j’adore les boucles de SPIP : il y a toujours des bidouilles sympathiques à trouver pour éviter de coder en PHP.)
Note : en règle générale, lorsqu’on commence à jouer avec des couleurs, je recommande fortement d’utiliser les variables SPIP avec #GET, cela rend le code beaucoup plus facile à maintenir. C’est d’ailleurs ce que nous faisons pour les feuilles de style de la dist.
J’ai déjà vu quelques outils pour choisir des couleurs dans SPIP, et tous permettent de sélectionner plusieurs couleurs. Autant dire que j’ai préféré prendre le contre-pied avec ce plugin : ici, on ne peut attribuer qu’une seule couleur à une rubrique.
Pourquoi ?
— D’abord parce que je suis un adepte forcené de la technologie KISS. C’est-à-dire : « Keep it simple, stupid ! ». Je pense que plus une fonction est simple, plus elle sera utile. L’interface doit être évidente.
— Parce que, dans tous les sites sur lesquels je suis intervenu, le besoin est de changer une seule couleur pour chaque rubrique. D’abord par besoin de cohérence : généralement la charte de couleur est globalement fixe, et une seule couleur change. Ensuite, si j’ai besoin de plus de couleurs, je les calcule automatiquement à partir de ma couleur de base.
Exemple type : je souhaite écrire du texte dans un pavé dont le fond est la couleur. Inutile de régler la couleur du texte (contraste maximum) à la main, il suffit de faire :
Ainsi, si la couleur du fond est foncée, le texte apparaîtra en blanc ; si la couleur est claire, le texte apparaîtra en noir.
1.5 : La fonction pb_couleur_rubrique devient couleur_rubrique. La roue chromatique est désormais présente à la racine du site, permettant de sélectionner la « couleur principale du site », que l’on récupère avec :
1.6 : L’extension jQuery Farbtastic devient une librairie, de façon à faciliter le partage avec d’autres plugins. Pour permettre l’installation automatique, penser à créer un dossier </lib à la racine du site.
Une autre méthode pour trouver la couleur de façon récursive, sans faire appel à des variables : passer par un modèle rubrique_couleur.html, qui s’appelle lui-même dans le contexte de la rubrique parente si la rubrique en cours n’a pas de couleur.
<BOUCLE_rubrique(RUBRIQUES) {id_rubrique}>
<BOUCLE_couleur(RUBRIQUES){id_rubrique}>[(#ID_RUBRIQUE|couleur_rubrique)]</BOUCLE_couleur>
<BOUCLE_parent(RUBRIQUES){id_enfant}>[(#MODELE{rubrique_couleur})]</BOUCLE_parent>
[(#EVAL{0}|couleur_rubrique)]
<//B_parent>
<//B_couleur>
</BOUCLE_rubrique>L’avantage d’utiliser un modèle est qu’on peut aussi utiliser l’info dans les articles : <rubrique2|couleur>.
On peut bien sûr imaginer une variante de modèle article_couleur.html.
Note : Malheureusement, il faut mettre 2 boucles sur id_rubrique, sinon on ne peut pas sélectionner la couleur en-dehors de la boucle ’couleur’. (mais si quelqu’un voit une façon plus astucieuse de faire...)
Bug : Quand un auteur est administrateur d’une ou plusieurs rubriques (mais pas admin du site), il ne peut pas modifier la couleur des rubriques qu’il administre.
Oui, c’est exprès. Idéalement, j’aurais préféré réserver carrément au webmestre du site (id_webmestre), mais là ça devenait beaucoup trop contraignant à l’usage.
L’idée, c’est que changer les couleurs des rubriques est une tâche qui doit être réservée au webmestre, de façon à conserver la cohérence graphique du site.
Je ne suis pas forcément d’accord : la couleur d’une rubrique n’est qu’un champ, rien n’oblige le webmaster à en tenir compte systématiquement dans la CSS et les squelettes. (par exemple il peut choisir de ne tenir compte dynamiquement que de la couleur "racine"). Par contre, inversement j’imagine des situations où ça aurait du sens de permettre aux admins de rubrique de définir une couleur associée à leur rubrique : ensuite libre au webmaster d’intégrer cette couleur de façon discrète et/ou de la transformer via les filtres (pastel, foncer, etc.) pour qu’elle s’intègre au site de façon harmonieuse.
Peut-être qu’un compromis serait de laisser ou pas cette possibilité via une option de configuration ?
OUPS ! Je me suis trompé d’endroit pour poser ma question.
Alors voici, Est-ce que ce merveilleux plugin fonctionne avec la version 1.9.2 ?
Nope : comme indiqué en haut de page, c’est conçu pour SPIP 2.0.
Salut Petebowling,
Hé bien, tu es sur la bonne voie ! « a8f74a » est bien ta couleur. En code hexadécimal, tel qu’il est utilisé par le HTML et les feuilles de style.
Par exemple :
devrait te colorer ton titre.
Évidemment, il est bien plus conseillé d’utiliser cette fonction directement dans les feuilles de style CSS :
Tu as plusieurs possibilités.
Une solution en HTML : tu t’arranges pour afficher l’image, et par dessus l’image (tu fais du position absolute) tu balances un div qui ne contient rien ayant pour background-color ta couleur (évidemment, il faut donner une hauteur et une largeur à ce div pour qu’il s’affiche), et tu rends ce div semi-transparent (avec opacity et filter:alpha). Là, c’est juste de la bidouille HTML. L’avantage, c’est que tu peux animer le div semi-transparent avec jQuery, pour faire de zolis effets de dévoilement de l’image.
Une solution avec les filtres graphiques de SPIP.
Sauf erreur, ça donnerait quelque chose comme ça :
bonjour
est ce que quelqun aurait une adresse de site ou un tutorial ou simplement du temps pour mexpliquer :
quand on dit"Pour récu pé rer la cou leur d’une rubri que, il suf fit d’indi quer dans le sque lette :
[(#ID_RUBRIQUE|couleur_rubrique)]"
dans quel fichier dois-je le placer ?? spip ou ahuntsic qui est le squelette que jutilise
ai-je besoin d’un logiciel particulier pour lire ce type de fichiers ??
URGENT merci davance
je suis dans la même situation, ou est ce qu’il faut mettre cette boucle ?
Cordialement
Oui, c’était un manque flagrant. Je viens d’uploader une version 1.5 du plugin sur la zone, qui permet désormais de choisir la « couleur principale du site ».
