Couleur de Rubrique

Publié le : 9 juin 2012 – Dernière modification le 8 juillet 2022 – par chankalan – 67 commentaires

1
2
3
4
5
21 votes

Le plugin Couleur de rubrique est maintenant adapté à SPIP3 et SPIP4.

Il permet d’attribuer une couleur par rubrique de façon très simple : un bloc est ajouté sur la page rubrique de l’administration de votre site, qui vous permet de déterminer une couleur, de la modifier et de la supprimer.

Importante modification par rapport à la version SPIP 2

Rq : la documentation du plugin pour SPIP 2 est toujours accessible sur le site de l’auteur du plugin : https://23forward.com/Le-plugin-PB-Couleur-Rubrique

Le plugin ne gère plus lui-même l’installation de la librairie Farbtastic pour l’affichage de la roue chromatique, mais il délègue ce travail au plugin Palette. Donc il fonctionne par défaut sans la roue chromatique : il suffit simplement d’ajouter le plugin Palette à votre site pour que la roue chromatique soit fonctionnelle.

Les squelettes sont saufs !

Le fonctionnement est identique aux précédentes versions, la page d’explication est toujours valide : http://www.paris-beyrouth.org/tutoriaux-spip/article/le-plugin-pb-couleur-rubrique
Le fonctionnement : une fois la couleur déterminée sur la page de la rubrique (côté administration de votre site), la couleur est ensuite utilisable dans les squelettes de cette manière : [(#ID_RUBRIQUE|couleur_rubrique)]
qui renvoi le code hexadécimal de la couleur enregistrée pour la rubrique sans le dièse.

Pour l’utiliser dans l’attribut style d’une balise, par exemple, à l’intérieur d’une boucle où id_rubrique existe, il faut donc écrire :

<div[ style="background:#(#ID_RUBRIQUE|couleur_rubrique);"]></div>

Pour utiliser la couleur du secteur quelle que soit la rubrique dans laquelle on se trouve, le filtre |couleur_secteur est disponible :

<div[ style="background:#(#ID_RUBRIQUE|couleur_secteur);"]></div>

(version 2.2.1 du plugin)

On retrouve la fonction de choix de couleur pour le site entier sur la page ?exec=rubriques (SPIP 3). Pour l’utiliser quelle que soit la rubrique dans laquelle on se trouve, le filtre |couleur_site est disponible :

<div[ style="background:#(#ID_RUBRIQUE|couleur_site);"]></div>

(version 2.3.0 du plugin)

Avec tout ça on peut déduire les conditions suivantes :

[(#SET{couleur_site,[#(#ID_RUBRIQUE|couleur_site)]})]
[(#SET{couleur_secteur,[#(#ID_RUBRIQUE|couleur_secteur)]})]
[(#SET{couleur_rubrique,[#(#ID_RUBRIQUE|couleur_rubrique)]})]

<div style="background:[(#GET{couleur_site}|sinon{#GET{couleur_secteur}}|sinon{#GET{couleur_rubrique}})];">
...
</div>

Les couleurs sont intactes !

Le passage d’un site SPIP 2.1.14 en SPIP3, puis l’ajout de ce cette version de Couleur rubrique a bien fonctionné.

+ configuration

Une page de configuration est ajoutée :

  • pour interdire/autoriser le changement de couleur sur toutes les rubriques. Quoi qu’il en soit, la couleur de la rubrique et son code hexadécimal s’affiche sur la page rubrique de l’espace privé.
  • pour ne choisir une couleur que sur les secteurs (les sous-rubriques n’auront pas de couleur) - version 2.2.0 du plugin

La page de configuration se retrouve depuis la page des plugins actifs, la petite icône d’outils « tournevis et clé à molette » en bout de ligne...

Discussion

5 ans 1 an 3 mois Sans limite
par date
Filtrer

4 discussions

  • 1
    pipol

    J’ai testé en 4.2, et cela semble fonctionner, peu être le plugin pourrait il être mis à jour.

    Répondre à ce message

  • 14
    mirobolus

    Bonjour, et merci pour cette chouette fonction.
    J’ai découvert chez mon client que les couleurs des rubriques ne sont pas affichées sous IE10. Quelqu’un a-t-il rencontré ce problème ?
    Merci pour votre aide.

    • chankalan

      Bonjour,
      il s’agit du formulaire de choix de couleur dans l’espace privé ?
      Sur une interface large ou normal ?

    • mirobolus

      Merci chankalan. Il s’agit des couleurs des rubriques sur le site public. Je suis sous Spip 3.0.8 avec la dernière version du plugin. Mes couleurs sont externalisées dans un fichier jeux_couleurs.css.html comportant ceci :

      #HTTP_HEADER{Content-type: text/css}
[(#SET{couleur,[#(#ID_RUBRIQUE|couleur_rubrique
|sinon{[(#ID_RUBRIQUE|couleur_secteur)]}
|sinon{[(#ID_RUBRIQUE|couleur_site)]}
|sinon{[(#ID_RUBRIQUE|couleur_secteur)]})]
})]

<BOUCLE_monarticle(ARTICLES) {id_article}>
<BOUCLE_sarubrique(RUBRIQUES) {id_rubrique}>
[(#SET{couleur,[#(#ID_RUBRIQUE|couleur_rubrique
|sinon{[(#ID_RUBRIQUE|couleur_secteur)]}
|sinon{[(#ID_RUBRIQUE|couleur_site)]})]
})]
	<BOUCLE_sarubriqueaelle(RUBRIQUES) {id_rubrique}>
    [(#SET{couleur,[#(#ID_RUBRIQUE|couleur_rubrique
    |sinon{[(#ID_RUBRIQUE|couleur_secteur)]}
    |sinon{[(#ID_RUBRIQUE|couleur_site)]})]
    })]
    </BOUCLE_sarubriqueaelle>

</BOUCLE_sarubrique>
</BOUCLE_monarticle>

.babbin{background-color: [(#GET{couleur})];}

ul.ssRub li {border-left: 10px solid [(#GET{couleur})] !important; }	

.nav li ul .babbin {background-color: [(#GET{couleur})] !important;} 

h1,.h1, #central h2,#central .h2 { color: [(#GET{couleur})] !important;}

.block-title {border-bottom: 6px solid [(#GET{couleur})]; color: [(#GET{couleur})] !important;} 

#central a, #central a:link, #central a:visited {color: [(#GET{couleur})];}

      Tout fonctionne parfaitement sur tous les navigateurs sauf sur IE10 : aucune couleur pilotée par le plugin n’apparait (dans les articles, les rubriques, sur les titres et dans le menu...).

    • chankalan

      c’est plutôt étonnant qu’IE 10 ne sache pas gérer les css comme les autres... ce ne serait pas un soucis sur le poste uniquement ? un problème de cache ?
      Le feuille de style est bien présente à partir du poste en question, avec les bonnes couleurs ?

    • mirobolus

      Je viens de faire vérifier sur un pc familial avec Windows 8 : on voit bien les couleurs. Il s’agit donc visiblement d’un problème chez le client. Quelle piste puis-je lui donner ? Est-ce qu’une fonction est désactivée ou bloquée par IE10 ? Pourtant chez lui, le diaporama fonctionne, le calendrier et les fonctions ajax aussi. Mystère...
      En tout cas merci : je me suis un peu précipitée, j’aurais dû contrôler avant de lancer ma question... Sorry.

    • mirobolus

      Quelques années après, je reviens sur ce message. Pas possible de voir les couleurs de rubriques sous IE sur de nombreux ordis, et aujourd’hui je retente pour un nouveau projet : Sur Microsoft Edge, voici le message dans la console : « HTTP403 : ACCÈS INTERDIT. Le serveur a compris la requête, mais il refuse de l’exécuter. (XHR) : GET - http://xxxxxxxxxx.fr/spip.php?page=css%2Fjeux_couleurs.css&id_rubrique=16 »
      Une idée ? Merci

    • chankalan

      Pas moins étrange... la feuille de style est bien insérée dans le head et elle comporte le bon entête ?
      cf https://contrib.spip.net/Couleur-d-Objet#cssdynamique

    • mirobolus

      Je te remercie pour ta réponse. La feuille de style, nommée jeux_couleurs.css.html et rangée dans le dossier /css, comporte cet entête :
      #HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15}

      Et elle est appelée dans le head ainsi :

      [<link rel="stylesheet" href="(#URL_PAGE{css/jeux_couleurs.css}|parametre_url{id_rubrique, #ID_RUBRIQUE})" type="text/css" media="projection, screen, tv" />]

      Tout fonctionne très bien sur Firefox mais pas sur tous les navigateurs. Même Chrome d’ailleurs, je viens d’essayer, y compris sur mon tél. http://www.ile-aux-enfants-83.fr

    • chankalan

      Est-ce que tu peux tester avec le contenu de la feuille directement dans une balise <style type="text/css">... </style>, sans l’entête ?

    • mirobolus

      Je viens de faire ceci :

      Test 1- intégration de ce code dans rubrique.html

      <style type="text/css">
[(#SET{couleur,#ffff00})]
h1,.h1, #central h2,#central .h2 { color: [(#GET{couleur})] !important;}
</style>

      => Firefox : ok ; Chrome : ok ; Edge : ok

      Test 2- Remplacement de ce code par ma boucle, toujours dans rubrique.html :

      <style type="text/css">
[(#SET{couleur,[#(#ID_RUBRIQUE|couleur_rubrique
|sinon{[(#ID_RUBRIQUE|couleur_secteur)]}
|sinon{[(#ID_RUBRIQUE|couleur_site)]}
|sinon{[(#ID_RUBRIQUE|couleur_secteur)]})]
})]

<BOUCLE_monarticle(ARTICLES) {id_article}>
<BOUCLE_sarubrique(RUBRIQUES) {id_rubrique}>
[(#SET{couleur,[#(#ID_RUBRIQUE|couleur_rubrique
|sinon{[(#ID_RUBRIQUE|couleur_secteur)]}
|sinon{[(#ID_RUBRIQUE|couleur_site)]})]
})]
	<BOUCLE_sarubriqueaelle(RUBRIQUES) {id_rubrique}>
    [(#SET{couleur,[#(#ID_RUBRIQUE|couleur_rubrique
    |sinon{[(#ID_RUBRIQUE|couleur_secteur)]}
    |sinon{[(#ID_RUBRIQUE|couleur_site)]})]
    })]
    </BOUCLE_sarubriqueaelle>

</BOUCLE_sarubrique>
</BOUCLE_monarticle>

      (...)

      => Firefox : ok ; Chrome : ok ; Edge : ok

      3- Appel de la feuille de style jeux_couleurs.css.html dans le head comme ceci :
      [<link rel="stylesheet" href="(#URL_PAGE{css/jeux_couleurs.css}|parametre_url{id_rubrique, #ID_RUBRIQUE})" type="text/css" media="projection, screen, tv" />]
      et avec le code suivant :

      #HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15}

[(#SET{couleur,#ffff00})]
h1,.h1, #central h2,#central .h2 { color: [(#GET{couleur})] !important;}

      => Firefox : ok ; Chrome : KO ; Edge : KO

    • chankalan

      Personnellement je n’ai jamais appelé une feuille css différente à chaque page de rubrique...
      Je mets dans le squelette une classe par exemple couleur#ID_RUBRIQUE là où je la souhaite, de manière à la cibler dans une seule feuille de style, en bouclant sur toutes les rubriques et en appliquant la règle :
      [.couleur#ID_RUBRIQUE { background-color:#(#ID_RUBRIQUE|couleur_rubrique); }]

      Ça permet de générer une seule feuille de style contenant toutes les couleurs pour toutes les rubriques.
      ...

    • mirobolus

      Le pb réside en fait dans l’appel de la feuille de style.
      Si on intègre les règles dans les squelettes, tout fonctionne super bien sur tous les navigateurs. Mais dès qu’on appelle la feuille css dynamique comme ça : [<link rel="stylesheet" href="(#URL_PAGE{css/jeux_couleurs.css}|parametre_url{id_rubrique, #ID_RUBRIQUE})" type="text/css" media="projection, screen, tv" />], ça ne fonctionne plus sous Edge et Chrome, mais ça marche parfaitement sous Firefox.
      C’est dommage parce que le but est bel et bien de n’avoir qu’une feuille de styles qui aurait géré les couleurs variables quel que soit l’objet éditorial appelant.
      En tout cas merci de t’être penché sur ce curieux problème.

    • chankalan

      De rien, mais donc il ne faut pas qu’elle soit appelée avec un parametre_url, car ça change le contenu de la feuille à chaque fois, ce qui est dommage pour une feuille de style qui devrait se mettre en cache dans les navigateurs... et ça coince apparemment avec certains... si tu suis l’exemple que je te donne plus haut ça roule tout seul ;o)

    • Loiseau2nuit

      X métros après la bataille ^^

      @Chankalan :
      Oh P*t41n ! MERCI !!!!
      Cette discussion m’a permis de débuguer un autre soucis pas directement lié à pb_couleur_rubrique mais qui trainait depuis quelques temps dans la cssdyn de ZKTX !
      (en fait je bouclais mes RUBRIQUES sur {id_rubrique} alors qu’avec {tout} de suite ça marche vachement mieux ^^)
      Merci ! Merci ! Merci ! :D

      @Mirobolus
      pour ton soucis, as tu tenté ton appel de CSS avec #CSS (au lieu de #URL_PAGE) et sans paramètre_url ? Car du moment que ta décla CSS est bien dans une boucle, logiquement le contexte se récupère tout seul.

    • JLuc

      Une page située dans un sous dossier n’est pas accessible autrement que par un administrateur du site identifié sur le site, ou via un INCLURE.
      Ça irait peut être mieux si tu déplaçais ta css à la racine si tu continues à l’appeler comme ça
      Mais ce n’est pas efficace de procéder ainsi. Il faut plutôt utiliser la balise #PRODUIRE https://www.spip.net/fr_article5505.html
      L’exemple donné est : <link rel="stylesheet" type="text/css" href="#PRODUIRE{fond=css/macss.css,couleur=ffffff}" />
      Tu n’auras pas de mal à l’adapter.

    Répondre à ce message

  • 1
    lebardix

    Merci pour ce plugin bien pratique

    Je rencontre un warning php

    Notice: Array to string conversion in /srv/data/web/vhosts/wn0.plandecuques.fr/htdocs/tmp/cache/skel/html_9385feee4e46561614b45a27aa82e01f.php on line 212

    et le code php correspondant

    <section class="wrapper style5">
   <div class="cartouche clearfix" style="background-color:' .
(($t1 = strval(couleur_secteur($Pile[$SP]['id_rubrique'])))!=='' ?
		('#' . $t1) :
		'') .
'">

    lors de l’affichage d’une « Page Unique » sans doute parce qu’il n’y a pas de couleur associée à une non-rubrique ...
    peut-etre prévoir une option pour utiliser la couleur du site ...

    Merci

    • chankalan

      Bonjour,
      merci du retour, mais est-ce possible aussi de savoir la version de PHP utilisée ?
      Il n’y a pas d’autres plugins actifs en même temps ?
      Sinon il y a le plugin « Couleur d’objet » qui intègre le même système de couleur mais pour n’importe quel objet de SPIP, dont les rubriques... Couleur d’Objet

    Répondre à ce message

  • 2
    Stéphane Santon

    Bonjour,
    Puisque ce plugin est dédié aux rubriques (contrairement à couleur_objet), n’y a-t-il pas un filtre couleur_branche (un peu comme couleur_secteur) qui remonterait la hiérarchie jusqu’à trouver la couleur de rubrique la plus proche ?
    Merci

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom