C’est l’occasion d’utiliser le critère {ajax}
qui permet exactement ceci lors de l’appel d’une inclusion.
La doc de SPIP est comme d’habitude très claire et très précise.
Lien
- ajax pour les inclure sur spip.net
Prenons l’exemple d’une page d’accueil où sont affichés les 5 derniers billets. Nous allons ajouter un lien « Billets plus anciens » au dessous du 5e billet, qui déclenchera l’affichage de 5 billets supplémentaires.
Sur le squelette sommaire.html
, la boucle qui affiche les 5 derniers articles se présente ainsi :
<BOUCLE_recents(ARTICLES){!par date}{0,5}>
<h1><a href="#URL_ARTICLE">[(#TITRE|supprimer_numero)]</a></h1>
...
</BOUCLE_recents>
Tout d’abord déplaçons cette boucle sur un squelette inclus inc-recentposts.html
Sur sommaire.html
, le squelette est inclus avec
<INCLURE{fond=inc-recentposts}{env}{nb=#ENV{nb,5}}{ajax}>
La variable nb
sert à donner le nombre d’articles à afficher [1], par défaut égal à 5, le critère {ajax}
indique que seul le fichier inclus devra être rafraîchi lorsqu’on clique un lien portant la classe ajax
.
Dans le fichier inclus, le critère d’itération de la boucle principale doit donc être modifié pour afficher les nb
premiers articles et non les 5 premiers.
<BOUCLE_recents(ARTICLES){!par date}{0,#ENV{nb}}>
<h1><a href="#URL_ARTICLE">[(#TITRE|supprimer_numero)]</a></h1>
...
</BOUCLE_recents>
Au bas de la boucle, ajoutons un lien ajaxé qui déclenche le rafraîchissement du squelette inclus en incrémentant nb de 5.
<p><a class="ajax" href="[(#SELF|parametre_url{nb,[(#ENV{nb}|plus{5})]})]">Billets plus anciens</a><p>
A ce stade ça fonctionne, mais au moment du rafraichissement le focus revient sur le haut du fichier inclus, la page remonte au premier billet. Pour plus de lisibilité, il vaut mieux que la page reste où elle est.
Utilisons une ancre, nommée #more
, placée sur le dernier élément affiché avant ajout, soit le nb-5e post.
Pour ajouter cette ancre, l’affichage du détail des posts devient :
<BOUCLE_recents(ARTICLES){!par date}{0,#ENV{nb}}>
<h1[ (#COMPTEUR_BOUCLE|plus{5}|=={#ENV{nb}}|?{id,""})="more"]><a href="#URL_ARTICLE">[(#TITRE|supprimer_numero)]</a></h1>
...
</BOUCLE_recents>
L’appel ajaxé des billets supplémentaires devient donc :
<p><a class="ajax" href="[(#SELF|parametre_url{nb,[(#ENV{nb}|plus{5})]})#more]">Billets plus anciens</a><p>
Et voilà !
Exemple sur cette page : http://another.teacher.free.fr/
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 : |