1

I'm trying to get the number of total "pager" pages with a view by using the views-mini-pager.html.twig. Here is my code so far...

{% if items.previous or items.next %}
<nav class="pagination" role="navigation">
            {% if items.previous %}
                {% if items.current %}
                    {% trans %}
                    <span class="page-number">Page {{ items.current }}</span>
                    {% endtrans %}
                {% endif %}
                    <a class="newer-posts" href="{{ items.previous.href }}"><span aria-hidden="true">←</span>{{ items.previous.text|default('‹‹'|t) }}</a>
            {% endif %}
            {% if items.next %}
                {% if items.current %}
                    {% if items.previous %}
                    {% else %}
                        {% trans %}
                        <span class="page-number">Page {{ items.current }}</span>
                        {% endtrans %}
                    {% endif %}
                {% endif %}
                <a class="older-posts" href="{{ items.next.href }}">{{ items.next.text|default('››'|t) }}<span aria-hidden="true">→</span></a>
            {% endif %}
    </nav>
{% endif %}

I want to have something like this

enter image description here

And currently, I can only get the current number page which ends up like this ...

enter image description here

I have searched for the variables inside of views-mini-pager.html.twig and I have not found the number of pages.

My question is...

  • How can I get the number of pages total? So I can display it at views-mini-pager.html.twig
    • For instance, if I view is divided into three pages I want to display "Page 1 of 3"
4

Mini Pager doesn't give you that information. It's designed to not execute a count query. It just knows that there's at least one additional result (because it actually queries 21 if you show 21).

  • Just out curiosity, Do you know if there is another setting that provides this information ? – itsdarrylnorris Jan 17 '16 at 9:48
  • 1
    Not directly I fear. The normal Full pager works with that information, that's basically the page ID in the "Last" link. It doesn't seem to be available directly in the template. See template_preprocess_pager(), $pager_max is what you're looking for, mor or less. Which in turn is in the $pager_total global (yeah, there are still some of those left in dark corners of D8 and pager is a very dark corner). So, implement your own preprocess, and then put it in $variables so you can use it in your template. – Berdir Jan 17 '16 at 20:22
0

Berdir is right: the full pager needs to be used. Three steps are involved to get the output you wanted:

  1. Switch the Views pager type to the full pager
  2. Implement a hook_preprocess_pager() function
/**
 * Implements hook_preprocess_HOOK().
 */
function MYTHEME_preprocess_pager(array &$variables) {
  // @see globals.api.php
  global $pager_total;
  $element = $variables['pager']['#element'];
  // Get the max page number for the current pager.
  $variables['pager_max'] = $pager_total[$element];
}
  1. Override the default pager template

Put something like this in pager.html.twig:

{#
/**
 * @file
 * Theme override to display a pager.
 *
 * @see template_preprocess_pager()
 */
#}
{% if items %}
  <nav class="pager" role="navigation" aria-labelledby="pagination-heading">
    <h4 id="pagination-heading" class="visually-hidden">{{ 'Pagination'|t }}</h4>
    <ul class="pager__items js-pager__items">
      {# Print previous item if we are not on the first page. #}
      {% if items.previous %}
        <li class="pager__item pager__item--previous">
          <a href="{{ items.previous.href }}" title="{{ 'Go to previous page'|t }}" rel="prev"{{ items.previous.attributes|without('href', 'title', 'rel') }}>
            <span class="visually-hidden">{{ 'Previous page'|t }}</span>
            <span aria-hidden="true">{{ items.previous.text|default('‹ Previous'|t) }}</span>
          </a>
        </li>
      {% endif %}
      {# Now generate the actual pager piece. #}
      {% for key, item in items.pages %}
        {% if current == key %}
          <li class="pager__item is-active">
            {% trans %}
              Page {{ current }} of {{ pager_max }}
            {% endtrans %}
          </li>
        {% endif %}
      {% endfor %}
      {# Print next item if we are not on the last page. #}
      {% if items.next %}
        <li class="pager__item pager__item--next">
          <a href="{{ items.next.href }}" title="{{ 'Go to next page'|t }}" rel="next"{{ items.next.attributes|without('href', 'title', 'rel') }}>
            <span class="visually-hidden">{{ 'Next page'|t }}</span>
            <span aria-hidden="true">{{ items.next.text|default('Next ›'|t) }}</span>
          </a>
        </li>
      {% endif %}
    </ul>
  </nav>
{% endif %}

The template is based on the template provided by Classy theme. It's inside the {% trans %} block where the magic happens.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.