Fonctionnalités
Permet d’afficher un bloc coloré dans le texte d’un article SPIP, à la place du code hexadécimal d’une couleur. Par exemple, si on veut afficher en clair à quoi correspond le code #ffcc00
, il suffit d’activer ce plugin, d’écrire le code de la couleur dans le texte, et la couleur apparaîtra.
Exemple pour la couleur #EF5522
: #EF5522
Autre exemple : #ff00ff ceci est le violet de Clèm.
Exemple avec un tableau de couleurs (exemple type d’utilisation pour échanger à propos des couleurs, avec un client ou un prestataire) représentant tout ou partie d’une charte web :
Élément | Couleur | Code |
---|---|---|
fond nav | bleu-vert | #034F4F |
Article survolé | orange foncé | #CFE25D |
Article non survolé | orange pale | #CDEB8B |
rubrique N1 non survolé | bleu foncé | #2C3449 |
rubrique N+1 non survolé | bleu-vert moyen | #259993 |
rubrique survolé | bleu-vert pale | #45AFA7 |
Fonctionnement
Seulement 2 fichiers dans le plugin :
- plugin.xml
- colorscope_pipelines.php
Le fichier plugin.xml appelle le pipeline « post_typo » :
<pipeline>
<nom>post_typo</nom>
<inclure>colorscope_pipelines.php</inclure>
</pipeline>
Le fichier colorscope_pipelines.php contient la fonction qui recherche le pattern « un dièse suivi de 6 caractères qui peuvent etre un chiffre ou des lettres comprises entre a et f en minuscules ou majuscules » et qui le remplace par un bloc de 90x20 avec en background la couleur souhaitée :
function colorscope_post_typo($texte) {
$motif = '<span class="base64" title="PGNvZGUgY2xhc3M9InNwaXBfY29kZSBzcGlwX2NvZGVfaW5saW5lIiBkaXI9Imx0ciI+KCNbYS1mQS1GMC05XXs2fSk8L2NvZGU+"></span>';
$texte = preg_replace($motif, '<span style="display:inline-block;text-align:center;width:90px;height:20px;background-color:$1;color:white">$1</span>', $texte);
return $texte;
}
Installation :
Installation classique par téléchargement du zip.
Utilité ?
Remplace le code hexa d’une couleur (exemple le code #2f5e35) par une image (exemple : #2f5e35), forcément plus explicite... Sert lorsqu’on discute via des articles SPIP, de maquettes graphiques, évite les copies d’écran pour de tous petits exemples d’images...
Evolutions ?
Pouvoir mettre le code de la couleur, à l’intérieur de l’image, en noir ou en blanc en fonction de la luminance de la couleur. J’ai déja trouvé la fonction permettant de trouver la luminance en fonction de la couleur RVB :
$luminance = 0.2126*$r + 0.7152*$v + 0.0722*$b;
Reste à « découper » la couleur trouvée en ses 3 composantes, puis à décider si le texte sera marqué en noir ou en blanc selon que la luminance sera plus grande ou moins grande que 50%... => fait, merci Arno* !
Pouvoir régler, avec cfg, le style de l’image générée : alignement vertical, autre dispay que inline-block, autres dimensions...
Nota : la révision [44675] corrige un défaut d’affichage des balise colorscope dans l’interface privée, faisant interpréter deux fois les 6 caractères placés derriere un #. Désormais le style du bloc est défini avec un parametre color exprimé en décimal plutot qu’en hexa.
Discussions par date d’activité
Une discussion
Bonjour
J’ai essayé ce plugin sur un spip 3.2.1 en changeant les bornes de compatibilité mais il ne fonctionne pas bien : page blanche à l’affichage de l’article.
La version rajoutée ici en Zip seul (notée 0.5.0) est définie pour [3.00 ;3.2+) mais aussi compatible 2.1 !
+ reste à faire : les codes courts
#123
ne sont pas interprétés !je ne vois pas de version 0.5.0
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 :
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.
Suivre les commentaires : |