Basé sur le code d’Arnaud Bosquet voici la procédure pour mettre en place un défilement infini sur les listes d’articles.
Installer le plugin
Installer le plugin à l’aide de l’archive zip ci-joint.
Le plugin utilise le pipeline jquery_plugins pour insérer un script javascript dans l’entête des pages.
Modifications à faire sur les squelettes
Pour faire fonctionner le javascript fourni Il faut ajouter quelques élements (principalement des attributs) aux squelettes.
Voici en exemple une boucle qui liste les 5 derniers articles de la rubrique en cours de consultation, classés du plus récent au plus ancien :
<B_articles>
<div class="liste articles" id="rub-#ID_RUBRIQUE">
#ANCRE_PAGINATION
<h2 class="h2"><:articles_rubrique:></h2>
[<noscript><p class="pagination">(#PAGINATION{page})</p></noscript>]
<div class="nb_com"><BOUCLE_totarticles(ARTICLES){id_rubrique}> </BOUCLE_totarticles>#TOTAL_BOUCLE</B_totarticles></div>
<ul class="liste-items">
<BOUCLE_articles(ARTICLES){id_rubrique} {!par date} {pagination 5}>
#INCLURE{fond=inclure/article-resume,id_article,compteur=#COMPTEUR_BOUCLE}
</BOUCLE_articles>
<li class="loadmore">Chargement en cours...</li>
</ul>
</div>
</B_articles>
Cette boucle est à placer dans le squelette rubrique.html (ou contenu/rubrique.html si vous utilisez le plugin zpip).
La boucle ci-dessus appelle un fichier inclure/article-resume.html (fourni avec zpip) qui contient :
<BOUCLE_articles(ARTICLES) {id_article} {statut?}>
<li class="item hentry[ num-(#ENV{compteur})]"[ id="art-(#ENV{compteur})"] >
<h3 class="h3 entry-title"><a href="#URL_ARTICLE" rel="bookmark">[(#LOGO_ARTICLE_RUBRIQUE||image_reduire{150,100})]#TITRE</a></h3>
<div class="info-publi">[<abbr class="published" title="[(#DATE|date_iso)]">(#DATE|affdate_jourcourt)</abbr>][<span class="sep">, </span><span class="auteurs"><:par_auteur:> (#LESAUTEURS)</span>]</div>
[<div class="#EDIT{intro} introduction entry-content">(#INTRODUCTION)</div>]
<div class="meta-publi">
<a class="lire-la-suite" href="#URL_ARTICLE"><:zpip:lire_la_suite:><span class="lire-la-suite-titre"><:zpip:lire_la_suite_de:> <em>#TITRE</em></span></a>
<BOUCLE_nb_commentaires(FORUMS) {id_article}{plat} /> [(#TOTAL_BOUCLE|oui)
<span class="sep">|</span>
<a[ href="(#URL_ARTICLE|ancre_url{forum})"] class="nb_commentaires">[(#TOTAL_BOUCLE)] [(#TOTAL_BOUCLE|=={1}|?{<:zpip:commentaire:>,<:zpip:commentaires:>})]</a>
]
<//B_nb_commentaires>
</div>
</li>
</BOUCLE_articles>
Et le SEO dans tout ça...
Le contenu de la liste d’article est chargé dynamiquement lorsque l’internaute défile la page. Au chargement de la page seuls 5 articles sont affichés, donc un robot d’indexation verra uniquement ces 5 articles. Pour leur donner du contenu à indexer, la balise noscript est utilisée. Si javascript n’est pas activé alors on affiche la pagination standard de Spip.
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 : |