Ajouter la pagination au dessus ET en dessous d'une liste

Posté le: mar 20/11/2018 - 08:31 Par: rcowebdev
Pager top

Alors s'il y a des trucs que je n'aime pas entre autres choses : la pagination "infinie" (à savoir le chargement des articles au scrolling de la page typiquement le fil d'actualités de Facebook, ou celui de LinkedIn, tout ca, qui fonctionne tant que le navigateur ne grignote pas l'ensemble de la RAM qui lui est attribué) exécrable pour le SEO (mais les sites nommés s'en fichent un peu puisqu'il faut être connecté) mais même pour l'expérience utilisateur - c'est subjectif hein ... - mais il y a aussi la pagination qui ne se trouve qu'en bas de page alors que ca ne coûte pas grand chose de la mettre dans la partie top et bottom d'une liste.

On va mettre en place le second cas de suite.

Pour se faire, on le devine, il va falloir toucher au thème et surcharger un de ses templates et pour les views du type taxonomy/term/X, il s'agit de celui-ci

views-view.html.twig 

On peut trouver ce fichier à plusieurs endroits; en effet si le thème courant surcharge déjà le dit fichier ou si non Drupal 8 va le piocher un cran au dessus; dans mon cas, le thème par défaut (c'est la même pratique pour l'ensemble de ces fichiers de templating ce qui rend la surcharge simple et rapide).

Donc pour mon thème - Nexus à l'heure où j'écris cet article - j'ai crée l'aborescence suivante

/root
-- themes
---- nexus
------ templates
--------- views
----------- views-view.html.twig

views-view.html.twig

{#
/**
 * @file
 * Theme override for main view template.
 *
 * Available variables:
 * - attributes: Remaining HTML attributes for the element.
 * - css_name: A css-safe version of the view name.
 * - css_class: The user-specified classes names, if any.
 * - header: The optional header.
 * - footer: The optional footer.
 * - rows: The results of the view query, if any.
 * - empty: The content to display if there are no rows.
 * - pager: The optional pager next/prev links to display.
 * - exposed: Exposed widget form/info to display.
 * - feed_icons: Optional feed icons to display.
 * - more: An optional link to the next page of results.
 * - title: Title of the view, only used when displaying in the admin preview.
 * - title_prefix: Additional output populated by modules, intended to be
 *   displayed in front of the view title.
 * - title_suffix: Additional output populated by modules, intended to be
 *   displayed after the view title.
 * - attachment_before: An optional attachment view to be displayed before the
 *   view content.
 * - attachment_after: An optional attachment view to be displayed after the
 *   view content.
 * - dom_id: Unique id for every view being printed to give unique class for
 *   Javascript.
 *
 * @see template_preprocess_views_view()
 */
#}
{%
  set classes = [
    dom_id ? 'js-view-dom-id-' ~ dom_id,
  ]
%}
<div{{ attributes.addClass(classes) }}>
  {{ title_prefix }}
  {{ title }}
  {{ title_suffix }}

  {% if header %}
    <header>
      {{ header }}
    </header>
  {% endif %}
  {#
  /** HERE **/
  #}
  {{ pager }}

  {{ exposed }}
  {{ attachment_before }}

  {{ rows }}
  {{ empty }}
  {{ pager }}

  {{ attachment_after }}
  {{ more }}

  {% if footer %}
    <footer>
      {{ footer }}
    </footer>
  {% endif %}

  {{ feed_icons }}
</div>

views-view.html.twig va automatiquement - après vidage du cache - surcharger le fichier par défaut core/themes/stable/templates/views/views-view.html.twig

Et là, miracle, j'ai ma pagination en haut de la page en plus de l'avoir en bas

Pager top

Bon, j'avoue que c'est un peu un caprice, mais ca permet de voir encore une fois comment la surcharge de thème fonctionne et puis je trouve cette fonctionnalité de "pagination top" pratique :p

Mots clés
Drupal 8
Theme
Twig