Pagination Template überschreiben

[androsch]

Seit Contao 5.7 stehe ich auf dem Schlauch was das Überschreiben des pagination templates angeht.

Bisher hatte ich /templates/themeordner/pagination.html5

Dieses greift nur im Debug Modus.

Dann habe ich versucht ein twig Template zu erstellen und es komplett überschrieben:

/templates/themeordner/pagination.html.twig
Das greift leider auch nicht. Daraufhin habe ich das alte html5 template gelöscht, was leider auch keine Änderung brachte.

Das Template Studio hat die Reihenfolge eigentlich richtig angezeigt, wie in der Doku beschrieben.

Mache ich hier einen Fehler, oder bin ich auf einen Bug gestoßen?

Hier der Code meines custom twig templates:

{% trans_default_domain 'contao_default' %}
<!-- indexer::stop -->
<nav class="pagination my-5 w-100 block" aria-label="{{ 'MSC.pagination'|trans }}">
    <p>{{ total }}</p>

    <ul class="d-flex p-0 w-100 align-items-center justify-content-center">
        {% if hasFirst %}
            <li class="first"><a href="{{ first.href }}" class="first" title="{{ first.title }}">{{ first.link }}</a></li>
        {% endif %}

        {% if hasPrevious %}
            <li class="previous"><a href="{{ previous.href }}" class="previous" title="{{ previous.title }}">{{ previous.link }}</a></li>
        {% endif %}

        {% for page in pages %}
            {% if page.href is null %}
                <li><strong class="active">{{ page.page }}</strong></li>
            {% else %}
                <li><a href="{{ page.href }}" class="link" title="{{ page.title }}">{{ page.page }}</a></li>
            {% endif %}
        {% endfor %}

        {% if hasNext %}
            <li class="next"><a href="{{ next.href }}" class="next" title="{{ next.title }}">{{ next.link }}</a></li>
        {% endif %}

        {% if hasLast %}
            <li class="last"><a href="{{ last.href }}" class="last" title="{{ last.title }}">{{ last.link }}</a></li>
        {% endif %}
    </ul>
</nav>
<!-- indexer::continue -->

Danke, mit Twig bin ich leider noch eher per "Sie".

[Spooky]

Seit Contao 5.7 gibt es eine neue Pagination. Was genau möchtest du denn anpassen?

[derRenner]

Ich habe ein angepasstes Template unter /templates/component/_pagination.html.twig platziert. Wobei ich es komplett überschrieben habe.

[androsch]

Seit Contao 5.7 gibt es eine neue Pagination. Was genau möchtest du denn anpassen?

Im Prinzip nur die paar Bootstrap Klassen:

<nav class="pagination my-5 w-100 block" aria-label="{{ 'MSC.pagination'|trans }}">

 <ul class="d-flex p-0 w-100 align-items-center justify-content-center">

[androsch]

Ich habe ein angepasstes Template unter /templates/component/_pagination.html.twig platziert. Wobei ich es komplett überschrieben habe.

Super, danke! Das hat geklappt!

[Spooky]

Im Prinzip nur die paar Bootstrap Klassen:

<nav class="pagination my-5 w-100 block" aria-label="{{ 'MSC.pagination'|trans }}">

 <ul class="d-flex p-0 w-100 align-items-center justify-content-center">

Und nur für ein bestimmtes Modul oder Inhaltselement oder für alle Paginations?

[androsch]

In dem Fall ging es um die mod_neswlist

[Spooky]

Seit Contao 5.7.3 könntest du die CSS Klassen bspw. so hinzufügen:

{# templates/mod_newslist.html.twig #}
{% extends '@Contao/mod_newslist' %}
{% use '@Contao/component/_pagination.html.twig' %}

{% block pagination_component %}
    {% set pagination_attributes = attrs()
        .addClass(['my-5', 'w-100'])
        .mergeWith(pagination_attributes|default)
    %}
    {{ parent() }}
{% endblock %}

{% block content %}
    {% if not articles %}
        <p class="empty">{{ empty }}</p>
    {% else %}
        {{ articles|join|raw }}

        {% if pagination.object|default %}
            {% with {pagination: pagination.object} %}{{ block('pagination_component') }}{% endwith %}
        {% endif %}
    {% endif %}
{% endblock %} 

Beim <ul> sieht es aktuell aber schlecht aus, evt. kommt das aber noch in der nächsten Contao Bugfix Version: https://github.com/contao/contao/pull/9674

[androsch]

Danke!

Mit dem Überschreiben der _pagination.html.twig komm ich zum Glück auch ans Ziel.

[Spooky]

Ab Contao 5.7.4 wird auch folgendes funktionieren:

{# templates/mod_newslist.html.twig #}
{% extends '@Contao/mod_newslist' %}
{% use '@Contao/component/_pagination.html.twig' %}

{% block pagination_component %}
    {% set pagination_attributes = attrs()
        .addClass(['my-5', 'w-100'])
        .mergeWith(pagination_attributes|default)
    %}

    {% set list_attributes = attrs()
        .addClass(['d-flex', 'p-0', 'w-100', 'align-items-center', 'justify-content-center'])
        .mergeWith(list_attributes|default)
    %}

    {{ parent() }}
{% endblock %}

{% block content %}
    {% if not articles %}
        <p class="empty">{{ empty }}</p>
    {% else %}
        {{ articles|join|raw }}

        {% if pagination.object|default %}
            {% with {pagination: pagination.object} %}{{ block('pagination_component') }}{% endwith %}
        {% endif %}
    {% endif %}
{% endblock %} 

[zoglo]

Ab Contao 5.7.4 wird auch folgendes funktionieren:

{# templates/mod_newslist.html.twig #}
{% extends '@Contao/mod_newslist' %}
{% use '@Contao/component/_pagination.html.twig' %}

{% block pagination_component %}
    {% set pagination_attributes = attrs()
        .addClass(['my-5', 'w-100'])
        .mergeWith(pagination_attributes|default)
    %}

    {% set list_attributes = attrs()
        .addClass(['d-flex', 'p-0', 'w-100', 'align-items-center', 'justify-content-center'])
        .mergeWith(list_attributes|default)
    %}

    {{ parent() }}
{% endblock %}

{% block content %}
    {% if not articles %}
        <p class="empty">{{ empty }}</p>
    {% else %}
        {{ articles|join|raw }}

        {% if pagination.object|default %}
            {% with {pagination: pagination.object} %}{{ block('pagination_component') }}{% endwith %}
        {% endif %}
    {% endif %}
{% endblock %} 

And I love it