Ce soir, j’ai bricolé un squelette mot.html pour SpipClear. Le but du squelette est d’afficher la liste des articles attachés à un mot clé d’un groupe défini (dans mon cas le groupe "tags").

Pour commencer, j’ai décortiqué les squelettes de SpipClear pour comprendre leur fonctionnement basé sur des inclusions conditionnelles. Je ne comprenais pas très bien des portions de codes comme celle-ci dans layout.html :

[(#RECHERCHE|?{' ',''})
<INCLURE{fond=search}{id_secteur}{recherche}{debut_liste}>]
[(#ENV{id_article}|?{' ',''})<INCLURE{fond=post}{id_article}>]

Un petit tour sur spip.net pour revoir le fonctionnement des filtres de test. Puis la lecture de l’article "Filtres de test - Qui a dit impossible ?" sur cent20.net m’ont permis de comprendre le truc.

Fichier mot.html

J’ai donc créé un fichier mot.html calqué sur article.html :

<BOUCLE_mot(MOTS){id_mot}><INCLURE{fond=layout}
{id_mot}
{id_secteur=1}
{id_rubrique=1}
{date}
{recherche}></BOUCLE_mot>

L’id du secteur et de la rubrique sont indiqués en dûr pour l’instant car un mot n’a pas d’id_secteur associé. En indiquent id_rubrique=1 dans ce squelette, on évite une erreur dans le cas où une recherche est lancée depuis une page mot.html (voir SpipClear : Correctif problème moteur de rechercehe).

Fichier layout.html

Dans le fichier layout.html (fichier central de SpipClear), j’ai modifié le contenu de la div "content" à la ligne 35 :

<div id="content">
        [(#RECHERCHE|?{'',' '})
                [(#ENV{id_article}|?{'',' '})
                [(#ENV{id_mot}|?{'',' '})
                <INCLURE{fond=list}{id_rubrique}{archives}{debut_liste}{home}>
                ]
                ]
        ]
        [(#RECHERCHE|?{' ',''})
        <INCLURE{fond=search}{id_secteur}{recherche}{debut_liste}>]
        [(#ENV{id_article}|?{' ',''})<INCLURE{fond=post}{id_article}>]
        [(#ENV{id_mot}|?{' ',''})<INCLURE{fond=tag}{id_mot}>]
</div>

Traduction de l’inclusion dans le fichier layout.html :

[(#RECHERCHE|?{'',' '})
        [(#ENV{id_article}|?{'',' '})
                [(#ENV{id_mot}|?{'',' '})
                <INCLURE{fond=list}{id_rubrique}{archives}{debut_liste}{home}>
                ]
        ]
]

Si #RECHERCHE n’est pas vide on "ignore" le bloc de code (pas d’inclure).

Si #RECHERCHE est vide on passe au test suivant.

Si #ENV{id_article} n’est pas vide on ignore le bloc.

Si #ENV{id_article} est vide on passe au test suivant.

Si #ENV{id_mot} n’est pas vide on ignore le bloc.

Et pour finir si #ENV{id_mot} est vide on fait l’inclure.

Fichier tag.html

Code du squelette tag.html appelé par layout.html :

<BOUCLE_tag(MOTS) {id_mot} {doublons}>
<div class="cartouche">
[(#LOGO_MOT||image_reduire{200,200})]
<h1 id="tag-titre">#TITRE</h1>
</div>
<B_articles_tag>
<div id="tag-articles">
        #ANCRE_PAGINATION
        <ul>
                <BOUCLE_articles_tag(ARTICLES) {id_mot} {par popularite}{inverse} {pagination 10}>
                <li>
                <h2 id="p#ID_ARTICLE" class="post-title"><a href="#URL_ARTICLE">#TITRE</a></h2>
                <p class="post-info">
                <B_auteurs><:par_auteur|ucfirst:> <BOUCLE_auteurs(AUTEURS){id_article}{", "}>#NOM</BOUCLE_auteurs>, </B_auteurs>
                [(#DATE|affdate_long)]
                <span>::</span>
                <BOUCLE_categorie(RUBRIQUES){id_rubrique}><a href="#URL_RUBRIQUE">#TITRE</a></BOUCLE_categorie>
                </p>
                </BOUCLE_articles_tag>
        </ul>
        [<p class="pagination">(#PAGINATION)</p>]
</div>
</B_articles_tag>
</BOUCLE_tag>

Ensuite, il suffit de styler la liste des articles située dans la div tag-articles.

Fichier post.html

Pour finir il faut modifier le fichier post.html afin d’afficher la liste des tags associées à un article lors de son affichage. Il suffit d’insérer ce code à la ligne 10 du fichier :

<B_mots><p id="post-tags"><BOUCLE_mots(MOTS){id_article}{" | "}><a href="#URL_MOT">#TITRE</a></BOUCLE_mots></p></B_mots>

Pour habiller la liste des tags vous pouvez utiliser une des images du paquet d’icônes disponibles sur le site de Mark James.

Nuage de mots clés

Vous pouvez aussi afficher une liste des tags du site dans un nuage (tag cloud) à l’aide du plugin Nuage de mots clés. L’article suivant indique comment insérer ce nuage dans la barre latérale de SpipClear.

À lire : Plugin nuage de mots clés pour Spip.