La Gestion des Ancres et Paginations

 Qu’est-ce qu’une ancre ?

Votre navigateur peut interpréter certains clics sur des liens <a href="{url_page}#{ancre}" de la page chargée, comme des repositionnements internes pour atteindre rapidement la position ancre de la page url_page..

 Pour cela, il faudrait générer le code HTML suivant,

• pour le lien : <a href="{url_page}#{ancre}"
• et pour positionner l’ancre : <a name="{ancre}"/>,
  mais nous verrons aussi l’utilisation directe de l’attribut CSS id=.

Notez que cette facilité est souvent utilisée dans les pages longues [1] pour Remonter (sans préciser qu’il s’agit du début de la page..), ce qui correspond de la façon la plus simple à :
<a href="#" title="Retour au début de la page.">Remonter.</a>.

 Raccourcis d’édition

En bon rédacteur de SPIP, vous savez déjà utiliser le raccourci d’article (écrire [->art33] pour créer un lien vers l’article 33) ! Vous pourrez facilement renvoyer à un endroit spécifique d’un article, en complétant ce raccourci de la façon suivante : [->art33#ancre], qui génèrera le code HTML attendu décrit ci-dessus.
Mais si vous voulez que ce lien soit efficace, vous n’aurez garde d’oublier de préciser dans le texte de l’article visé, la position de l’ancre nommée, en rajoutant le raccourci standard SPIP à l’endroit visé : taper[definition_ancre<-] [2] .
Par exemple, dans le texte de cet article, on utilisera plusieurs fois le raccourci de retour à l’ancre qui génère <a name="definition_ancre"></a> : voyez !

 Sommaire de page article

Cette facilité de saut rapide vers des ancrages nommés dans la page Web, est désormais utilisée dans ce site par la génération d’un sommaire dans les articles.

Celui-ci est construit grâce à la détection des Titres Principaux [3] dans le corps de l’article, par la lame Sommaire du CS, ou le plugin simple correspondant, qui insère le code HTML d’une ancre nommée dans le contenu affiché.
Parallèlement, le squelette de l’article comprend (ici à la suite de #CHAPO) la balise spécifique #CS_SOMMAIRE pour intégrer un sommaire généré, simple liste de liens vers les ancres détectées...

 Table des matières dans le squelette

Mais vous pourriez vouloir créer une table des matières plus complexe, par exemple avec le lien vers le début des rubriques et articles intégrés dans une page complète d’édition [4] de votre site.

Imaginons d’utiliser comme nom d’ancre, le numéro d’article ou de rubrique : en préfixant le numéro d’id ( #ID_RUBRIQUE ou #ID_ARTICLE ) d’une lettre pour éviter de confondre article et rubrique de meme numéro, il faudrait -pour aller au début local de la rubrique 33- donc générer dans votre boucle de parcours des rubriques quelque chose comme :
 <a href="?page=livre#R33" [ title="(#INTRODUCTION|textebrut)"] >[(#TITRE)]</a>
Pas de problèmes, me direz-vous :

• on utilise la balise #URL_PAGE#SELF pour récupérer l’accès à la page courante,
• on rajoute les caractères "#", "R", et "#ID_RUBRIQUE"
• ne vous laissez pas perturber par l’attribut "[ title="(#INTRODUCTION|textebrut)"]" juste utile pour montrer une bulle d’explication introductive au contenu de la rubrique ciblée....
  et : çà marche pas !!

Pourquoi ? Vous retrouvez bien un lien généré dans votre source de page résultant [5] :

 : et le dièse, et le R ?

• le squelette a sans doute généré " ?page=livre#R33", ce que SPIP a interprété en reconnaissant le dièse marqueur de début d’une balise nommée en Majuscules.... #R non trouvée !

Plutôt que d’utiliser une minuscule (ce qui n’activerait pas le compilateur SPIP), ou |concat{#} en un inutilement compliqué <a href="[(#SELF|concat{'#'}|concat{R#ID_RUBRIQUE})]", il serait préférable d’utiliser le filtre dédié dans la liste !
Et voila :
  <li><a href="[(#SELF|ancre_url{r#ID_RUBRIQUE})]"[ title="(#INTRODUCTION|textebrut)"] >...

 Génération des ancres avec retour

Quant à la génération de l’ancre nommée dans la boucle des rubriques affichant le texte complet, avec retour au sommaire, voici comment l’intégrer :
 vous pourriez générer pareillement l’instruction <a name=" ...."></a> [6],
 mais il est presque plus simple d’utiliser l’identification implicite de l’attribut id= :
(<a href="#" id="r#ID_RUBRIQUE" title="Retour au début de la page.">Up</a>)
 et remplacer automatiquement le lien de remontée par une flèche standard dans SPIP par une classe CSS, telle que magiquement surchargée à l’exemple du Couteau Suisse :

 Boucle d’édition de contenu d’une rubrique ancrée

Vous pouvez utiliser la boucle ci-dessous, dans un contexte de Rubrique [7] du secteur voulu.

 Et la Pagination ...

Notez d’abord que la pagination correspond à une approche différente : au lieu de proposer des déplacements rapides dans la page avec le système d’ancres décrit ci-dessus, la pagination dans une boucle vous automatise le déplacement entre plusieurs pages d’un même squelette, sans avoir a écrire autre chose qu’une balise pour l’affichage des liens, et un critère supplémentaire dans la boucle.

Pour cela, il suffit de rajouter deux éléments dans la boucle concernée :
 un critère {pagination} dans l’entete de boucle,
 une balise de champ #PAGINATION à afficher dans la boucle,
et c’est tout !

Enfin, vous trouverez divers plugins pour améliorer les déplacements dans la page, importants en termes d’accessibilité pour les mal-voyants, par exemple les scripts qui permettent de 1) masquer le "Aller au contenu", "Aller à la rechercher" etc, et 2) de faire des menus déroulants qui marche à la fois à la souris et au clavier : utilisés par l’espace privé de SPIP, s’ils sont génériques, cela permettrait diffuser des "bonnes pratiques" complémentaires et simples à mettre en œuvre....