Changements de l’intégration graphique de la version 1.3 du plugin
- On peut « exposer » des mots-clés,
- l’habillage du nuage est maintenant géré par un fichier
nuage.css
surchargeable pour faciliter la vie des infographistes. - le différenciation graphique de l’importance des mots les uns par rapport aux autres se fait par classe css.
Explications
Dans le modèle par défaut de ce plugin, si on lui fournit un identifiant d’article en paramètre, on va collecter les mots-clés associés à cet article pour les « colorer » différemment des autres mots-clés du nuage en leur ajoutant la classe « on » qui, dans le cadre standard de SPIP est utilisée via la balise #EXPOSE. On peut ainsi trouver une certaine unité graphique sur le site.
La logique du nuage est d’imbriquer des balises html comme suit :
ul > li > a > span
Pour différencier la présentation du nuage des autres listes de type ul dans le site, on définit une classe « nuage » dans le fichier de feuilles de style nuage.css
de la façon suivante :
-
ul.nuage
: Le nuage est une liste non-ordonnée de class « nuage », -
ul.nuage li
: chaque mots-clés est entièrement inclus dans un des éléments de cette liste non-ordonnée (<li>...</li>
), -
ul.nuage a
: chaque élément de liste contient un lien cliquable, l’habilllage de ce lien n’est pas définit par défaut, -
ul.nuage a.on
: les mots-clés exposé peuvent être habillé d’une manière particulière, ce n’est pas le cas par défaut, et on bénéficie de l’habillage standard des éléments exposé de SPIP que cette class définit dans les feuilles de styles distribuées avec le logiciel, -
ul.nuage span.frequence
: afin de fournir un nuage accessible, et ainsi restituer l’information pour des interfaces ne tenant pas compte de l’effet visuel du plugin, on affiche aussi un rapport numérique entre chaque mot-clé et le mot-clé le plus important. Ce texte est "caché" pour les navigateurs "graphiques" les plus courants grâce à la définition de la classe « frequence ». [1]
Personnalisation
Pour modifier l’aspect graphique du nuage sur votre site, copiez ce fichier dans votre dossier squelettes/
et faites vos modifications.
Par exemple, le code suivant affiche le nuage dans un fond noir, les liens sont blancs et les mots-clés « exposés » sont en rouge :
/*nuage de mot-cle*/
ul.nuage {
/*ajout perso */
background: black;
/*fin ajout perso */
margin:0;
padding: 0;
list-style: none;
}
/*chaque mot-cle, element de liste*/
ul.nuage li {
display: inline;
white-space: nowrap;
}
/*chaque mot-cle, lien*/
ul.nuage li a {
/*rien par defaut*/
/*ajout perso */
color: white;
/*fin ajout perso */
}
/*mot-cle expose*/
ul.nuage li a.on {
/*rien par defaut*/
/*ajout perso */
color: red;
/*fin ajout perso */
}
/*frequence accessible et cachee*/
ul.nuage li a span.frequence {
display: block;
float: left;
height: 0;
overflow: auto;
width: 0;
}
Ce fichier est chargé automatiquement dans l’entête de tous squelettes intégrant la balise #INSERT_HEAD. Dans le cas contraire (pas de balise #INSERT_HEAD), deux solutions :
- ajouter un lien manuellement dans vos squelettes :
<link rel="stylesheet" href="#CHEMIN{nuage.css}" type="text/css" media="all" />
, - ajouter ces définitions de style dans vos propres fichiers css.
Différenciation des mots-clés les uns par rapport aux autres - Janvier 2008
Le plugin propose une dizaine de classes CSS, notées .nuage0
à .nuage10
, afin de personnaliser, comme ci-dessus, la distinction entre les mots selon leur fréquence. Par défaut, elles changent la taille (de 0.9em à 1.9em). Mais on peut les changer puisque le style ne dépend plus du calcul, mais d’une feuille de style. Ces classes s’appliquent aux liens.
-
ul.nuage a.nuage0
: la classe des mots-clés les moins fréquents du nuage. -
ul.nuage a.nuage10
: la classe des mots-clés les plus fréquents du nuage.
Voir la revue Politique à titre d’exemple d’application.
Aucune discussion
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 : |