ARTICLES SUIVANT/PRÉCÉDENT
ARTICLES SUIVANT/PRÉCÉDENT
| Partager
Techniques SPIP

Vous trouverez ici des trucs et astuces destinés aux développeurs de sites sous SPIP.

La majorité de ces trucs est consacrée aux filtres graphiques introduits dans SPIP 1.9. Il y a là en effet un vaste champ d’expérimentation pour les webmestres et les graphistes.

Chaque truc est suivi d’un forum auquel nous vous invitons à participer.

N.B. La présence de ces trucs et astuces sur notre site professionnel est destinée à faire connaître notre activité de création de sites sous SPIP. Vous pouvez librement utiliser les morceaux de code fournis ici dans vos propres squelettes. Vous pouvez reprendre ces exemples sur votre site ou dans les forums d’un autre site ; dans ce cas, nous vous demandons simplement d’avoir la courtoisie de référencer la page d’où est tiré le code repris.

XML

[SPIP 1.9.1] Afficher l’article précédent et l’article suivant peut se révéler assez compliqué dès lors que l’on adopte un ordre de présentation des articles un peu chiadé. Par exemple, présenter les articles par titre numéroté, ou par titre s’il n’y a pas de numéro.

Voici ce que je voulais obtenir pour le site du Centre de recherche du Château de Versailles :

Longtemps j’ai utilisé du PHP pour réaliser ces affichages. Mais, avec l’arrivée des filtres de test (|==, |?{}...) dans la version 1.8 et les balises permettant de gérer des « variables » (#SET et #GET), le langage de squelettes se rapproche de plus en plus d’un véritable langage de programmation (ou d’un langage de macro-commandes, à la manière de TEX), puisqu’il est désormais possible de gérer des variables et de réaliser des tests conditionnels sur ces variables [1]. Cela permet de ne plus utiliser de PHP, ni dans le squelette lui-même, ni dans mes_fonctions.php.

Voici le code que j’ai réalisé pour obtenir une flèche vers l’article précédent, une flèche pour l’article suivant, et au centre la position de l’article dans la liste.

  1. <div class="prec-suiv">
  2. [(#SET{select_precedent,0})]
  3. [(#SET{select_suivant,0})]
  4.  
  5. <BOUCLE_meme_rubrique(ARTICLES){id_rubrique}{par num titre, titre}>
  6.         [(#GET{select_suivant}|=={1}|?{" ",""})
  7.                 [(#SET{suivant,#URL_ARTICLE})]
  8.                 [(#SET{select_suivant,0})]
  9.         ]
  10.        
  11.         [(#EXPOSE|=={on}|?{" ",""})
  12.                 [(#SET{numero,#COMPTEUR_BOUCLE})]
  13.                 [(#SET{select_precedent,1})]
  14.                 [(#SET{select_suivant,1})]
  15.         ]
  16.        
  17.        
  18.         [(#GET{select_precedent}|=={0}|?{" ",""})
  19.                 [(#SET{precedent,#URL_ARTICLE})]
  20.         ]
  21.        
  22. </BOUCLE_meme_rubrique>
  23.  
  24.         <BOUCLE_test_nombre(ARTICLES){id_rubrique}{1,1}>
  25.         [<a href="(#GET{precedent})"><img src="#CHEMIN{imgs/fleche-precedent.gif}" alt="&lt;" style="vertical-align:bottom;" /></a>]
  26.         [(#GET{numero})/#_meme_rubrique:TOTAL_BOUCLE]
  27.         [<a href="(#GET{suivant})"><img src="#CHEMIN{imgs/fleche-suivant.gif}" alt="&gt;" style="vertical-align:bottom;" /></a>]
  28.         </BOUCLE_test_nombre>
  29. </B_meme_rubrique>
  30. </div>
Télécharger

Si l’on souhaite choisir un autre ordre de présentation des articles, c’est dans les critères de la BOUCLE_meme_rubrique qu’il faut intervenir.

Ici, je fixe dans les variables precedent et suivant directement les URL des articles ; si l’on veut une présentation plus complète, il suffit d’y conserver l’#ID_ARTICLE plutôt que l’URL, et au moment de l’affichage, faire une petite boucle sélectionnant cet identifiant et afficher exactement ce que l’on veut (titre de l’article, sous-titre, auteurs, logo...).

[1] On peut penser qu’il manquerait, pour être un véritable langage de macro-commandes, la définition des fonctions ou de macros directement dans le système de balises SPIP ; mais on peut tout aussi bien considérer que l’utilisation de « noisettes » permet de définir de telles macro-commandes ; et les boucles récursives (réutilisation d’une boucle déjà définie) est également proche d’une logique de macro-commandes.

Novembre 2008
Articles suivant/précédent

Dorian avait proposé une autre solution il y a bien longtemps ici : Article Précédent / Article Suivant (SPIP-Contrib)

je ne sais pas laquelle est la meilleure :
- reboucler sur tous les articles
- utiliser le tri SQL pour trouver le prochain article

De plus, je ne suis pas certain que la méthode proposé sur spip-contrib permet d’utiliser par num titre

Novembre 2008
Articles suivant/précédent
ARNO* (arno chez rezo.net)

Si je ne me trompe pas, l’article que tu indiques donnes deux fonctionnements : classement par date, classement par titre. L’idée ici, c’est de pouvoir fonctionner avec réellement n’importe quel classement d’articles.

Novembre 2008
Articles suivant/précédent
karim (kbelkacem chez gmail.com)

Hi Arno* !!! Excellent, je maitrîse pas encore la technique des #GET et #SET et dieu sait si c’est puissant. Il manque des exemples concrets dans la planète SPIP, BRAVO pour le site que tu mentionnes en exemple aussi, super navigation !!! très fluide.

@bientôt sur la toile.

Mai 2009
Articles suivant/précédent
Voldor (voldor chez club.fr)

Bonjour,

Je voudrais à la place des flèches avoir les logos des articles précédents et suivants et en insérant la balise LOGO à la place de l’image des flèches, je n’arrive qu’à retourner des deux côtés le logo de l’article en cours...

Pouvez-vous m’aider ?

Mile mercis par avance !

Un vieux mécano amateur toujours néophyte...

Juillet 2009
Articles suivant/précédent
flypix (flypix chez freesurf.fr)

Salut,

Je suis parvenu à implémenter cette fonctionnalité sans problèmes. Bravo et merci.

Cependant, étant plutôt nouveau sur spip, la subtilité qui fait apparaitre ou disparaitre les fleches m’échappe.

Mes flèches sont des background-image des href. En fait je souhaiterais simplement changer la class css des href plutôt que de les faire disparaitre lorsqu’il n’y pas d’article suivant ou précédent.

Pourriez-vous m’éclairer, me mettre sur la piste ?

Merci.

Juillet 2009
Articles suivant/précédent
ARNO* (arno chez rezo.net)

@flypix : la boucle stocke l’URL de l’article suivant et de l’article précédent dans des variables :
— [(#GET{precedent})>]
— [(#GET{suivant})>]

S’il n’y a pas de précédent ou de suivant, ces variables sont vides. C’est donc en jouant sur les crochets (option avant, option après) qu’on ajoute ou non les éléments de navigation (puisque, si la variable est vide, on n’affiche pas ce qui se trouve à l’intérieur des crochets (et à l’extérieur des parenthèses).

C’est avec cela que vous pouvez jouer pour modifier le code.

Votre message :
Un message, un commentaire ?

(Pour créer des paragraphes, laissez simplement des lignes vides.)

Qui êtes-vous ? (optionnel)