Afficher ses mots clefs façon Tags

Une petite boucle , le filtre {alterner} et un peu de CSS , et hop on affiche les mots clefs façon Tag

L’objectif , afficher les mots clefs en faisant varier, la taille, l’épaisseur et la police du mot clefs d’un mot à l’autre. comme sur cette page

Deux autres contribs proposent aussi ce type d’affichage
-  une de booz : Afficher les mots-clés en faisant varier la taille de la police ;
-  une de mortimer : Un affichage fonction de l’importance relative dans le site.

La deuxième partie de ma contrib utilise les fonctions présentées dans la contrib de Mortimer. la première est indépendante et présente l’utilisation du filtre |alterner{..} pour obtenir l’affichage

Afficher les mots clefs façon Tags indépendamment de l’importance relative du mot clef

dans cette première partie, on réalise juste un affichage façon tag qui n’a pas la pertinence des tags, en effet, en général, la taillet et l’épaisseur d’un tag est fonction de l’importance relative du tag. Ici on a juste un affichage « look-like ».

2La boucle2

<BOUCLE_mots(MOTS){par titre}{','}>
                      <a href="#URL_MOT" class="tag_taille_[(#COMPTEUR_BOUCLE|alterner{'1','2','3'})] 
tag_epaisseur_[(#COMPTEUR_BOUCLE|alterner{'1','2','1,','3'})] 
tag_police_[(#COMPTEUR_BOUCLE|alterner{'3','2','1,','2','3'})]">#TITRE</a>

                      </BOUCLE_mots>

Le filtre {alterner} permet de sélectionner un style parmi :
-  tag_epaisseur_1, tag_epaisseur_2, tag_epaisseur_3
-  tag_taille_1, tag_taille_2, tag_taille_3
-  tag_police_1, tag_police_2, tag_police_3

2La feuille de style2
La feuille de style associée est la suivante :

.tag_police_1{	font-family : "Trebuchet MS", Tahoma, Arial, Helvetica, sans-serif;}

.tag_police_2{	font-family:  Tahoma, Arial, Helvetica, sans-serif,"Trebuchet MS";}

.tag_police_3{	font-family:  Arial, Helvetica, sans-serif,"Trebuchet MS",Tahoma;}

.tag_taille_1{	font-size: 110%;}

.tag_taille_2{	font-size: 130%;}

.tag_taille_3{	font-size: 90%;}

.tag_epaisseur_1{     font-weight:500;}

.tag_epaisseur_2{     font-weight:300;}

.tag_epaisseur_3{     font-weight:700;}

2Comment installer la contrib2
-  vous copiez les styles ci-dessus dans votre feuille de style en les adaptant à votre site ;
-  vous modifier votre boucle mots clefs en vous inspirant de celle ci-dessus

Prise en compte de l’importance du mots clefs

On se propose maintenant de faire varier la taille du mot clef en fonction de la fréquence d’utilsation du mot clef (en nombre d’articles associés).

Ici, nous aurons besoin d’utiliser des filtres spécifiques que nous placerons dans mes_fonctions.php3.

2La boucle2

<BOUCLE_GR_mots(GROUPES_MOTS){par titre}{'<br />'}>
<BOUCLE_max(MOTS){tout}{id_groupe}>
       <BOUCLE_max_art(ARTICLES) {id_mot}> </BOUCLE_max_art> [(#_max_art:TOTAL_BOUCLE|filtre_max{total_#ID_GROUPE}|noop)]  </B_max_art>
</BOUCLE_max>
<h3> [<strong>(#TITRE|supprimer_numero)</strong>]</h3>
<B_aff>
<p>
<BOUCLE_aff(MOTS){par titre}{id_groupe}{','}>
       <BOUCLE_aff_art(ARTICLES) {id_mot}> </BOUCLE_aff_art>
       <span class="tag_epaisseur_[(#_aff:COMPTEUR_BOUCLE|alterner{'1','2','3'})]">
       [<a href="#URL_MOT"  class="tag_taille_(#_aff_art:TOTAL_BOUCLE|filtre_max{total_#ID_GROUPE}|coef{#_aff_art:TOTAL_BOUCLE,4}|alterner{'1','2','3','4'})]" title='#_aff_art:TOTAL_BOUCLE article(s)'>#TITRE</a>
       </span>
       </B_aff_art>
</BOUCLE_aff>
</p>
</B_aff>
</BOUCLE_GR_mots>

Remarque, je décris ici, les boucles utilisées sur le site exemple, dans lequel j’ai choisi de faire une répartition par groupe de mots clefs et non pas sur tous les mots clefs.

-  La boucle englobante <BOUCLE_GR_mots(GROUPES_MOTS) ....> permet de scanner tous les mots clefs ;

-  La boucle <BOUCLE_max(MOTS) .....> est inspirée (fortement, c’est la meme) de la contrib de Mortimer, elle permet de déterminer le nombre maximum d’articles associés à un mot clef. Cette valeur est affectée via le filtre |filtre_max{..} à la variable total_#ID_GROUPE soit les variables total_1, total_2, total_3,....

-  La boucle <BOUCLE_aff(MOTS) ....> liste les mots clefs par groupe de mots clefs

-  La boucle <BOUCLE_aff_art(ARTICLES) {id_mot}> va déterminer pour chaque mot clef la taille des caractères du mots, au travers d’une classe spécifique définie par :

class="tag_taille_(#_aff_art:TOTAL_BOUCLE|filtre_max{total_#ID_GROUPE}|coef{#_aff_art:TOTAL_BOUCLE,4}|alterner{'1','2','3','4'})]"  

Le nom de la classe est calculé à partir du nombre d’article pour chaque mot clef #_aff_art:TOTAL_BOUCLE, ce nombre est passé en paramètre à la fonction coef{#_aff_art:TOTAL_BOUCLE,4} ainsi que filtre_max{total_#ID_GROUPE}, à partir de ces deux valeurs, la fonction coef retourne une valeur comprise entre 1 et 4 en fonction de l’importance du mot clef, cette valeur est utilisée dans le filtre |alterner, on obtient donc les classes suivantes : tag_taille_1, tag_taille_2, tag_taille_3 et tag_taille_4 que l’on doit définir dans la feuille de style.

2La feuille de style2

.tag_taille_1{
	font-size: 90%;
}
.tag_taille_2{
	font-size: 110%;
}
.tag_taille_3{
	font-size: 130%;
}
.tag_taille_4{
	font-size: 150%;
}

.tag_epaisseur_1{
     font-weight:300;
}

.tag_epaisseur_2{
     font-weight:500;
}
.tag_epaisseur_3{
     font-weight:600;
})]

La feuille de style est élémentaire et ne pose pas de pb, on y retrouve les différentes classes.

Remarque : dans la contrib, je vais aussi varier de manière alternée l’épaisseur du texte afin d’éviter d’avoir des mots clefs cote à cote avec la même typographie.

2Les fonctions2

Ces fonctions sont à placer dans mes_fonctions.php3. elles sont extraites de la contrib de Mortimer Un affichage fonction de l’importance relative dans le site.

Je vous laisse lire les commentaires de Mortimer pour en comprendre le fonctionnement.

<?php
/*
 *   +----------------------------------+
 *    Nom des Filtres :    noop, filtre_max, coef et repeat
 *   +----------------------------------+
 *    Date : 23 Mars 2005
 *    Auteur :  Pierre Andrews (mortimer.pa@free.fr)
 *   +-------------------------------------+
 *    Fonctions de ces filtres : ces filtres permettent
 *   de faire un affichage variant en fonction de l'importance
 *    de l'objet.  Vois la contrib pour plus d'informations.
 *   +-------------------------------------+
 *
 * Pour toute suggestion, remarque, proposition d'ajout
 * reportez-vous au forum de l'article :
 * http://www.spip_contrib.net/article.php3?id_article=879
*/

function noop($texte) {
  return '';
}

function filtre_max($texte, $id='tout') {
  static $max = array();
  if($max[$id] < $texte) {
    $max[$id] = $texte;
  }
  return $max[$id];
}

function coef($max,$nbr,$nbrMax=6) {
  return ceil(($nbr/$max*$nbrMax));
}

function repeat($nombre,$texte,$avant,$apres,$min = 0) {
  if($nombre > $min) {
    for($i=0;$i < $nombre;$i++) {
      $texte = $avant.$texte.$apres;
    }
    return $texte;
  } else
    return '';
}
?>

Nota : seule la fonction coef a été modifiée par rapport à celles de Mortimer.

2Installation de la contrib2
-  vous copiez dans votre squelette mot.html les boucles en les adaptant si nécessaire ;
-  vous copiez la feuille de style dans votre feuille de style ;
-  vous copiez les fonctions dans votre fichier mes_fonction.php3

A vous

Dernière modification de cette page le 14 novembre 2006

Discussion

3 discussions

Ajouter un commentaire

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