Twig - Downloads auf Dateiendungen einschränken

von Bernhard Renner

Um Dateien, die in einem Inhaltselement Downloads bereitgestellt werden, auf eine bestimmte Dateiendung einzuschränken, bedarf es nur weniger Anpassungen.

Zielsetzung in einem Projekt war es, die bereitgestellten Dateien auf *.pdf einzuschränken.
Die Herausforderung:
• die Dateien stammen aus dem Home-Verzeichnis der Mitglieder
• im Home-Verzeichnis befinden sich nicht nur PDF-Dateien
• die Dateien müssen nicht einzeln ausgewählt werden, sondern sollen durch Häkchen für "gesamter Ordner ausgewählt" automatisiert im Frontend ausgegeben werden

 

Erstelle dazu erst mal ein neues Twig-Template - und zwar als Varianten-Template, damit nicht alle Inhaltselemente Downloads davon betroffen sind.
/templates/content_element/downloads/pdf-files.html.twig

{# templates/content_element/downloads/pdf-files.html.twig #} 

{% extends "@Contao/content_element/downloads.html.twig" %}

{% block content %}
    {% with { items: downloads|filter(item => item.file.extension(true) == 'pdf') } %}
        {{ block('list_component') }}
    {% endwith %}
{% endblock %}

{% block list_item_attributes %}
    {{- attrs(list.item_attributes|default).addClass(['download-element', "ext-pdf"]) -}}
{% endblock %}

{% block list_item %}
    {% with { download: item } %}{{ block('download_component') }}{% endwith %}
{% endblock %}


Wir wenden hierbei einen Filter auf die Variable downloads an.
downloads|filter(item => item.file.extension(true) == 'pdf') sorgt dafür, dass nur Elemente mit der Dateiendung .pdf in die items-Liste übernommen werden.
• die Anpassung in list_item_attributes sorgt dafür, dass die Datei-Klasse "ext-pdf" erhalten bleibt.

Das war's ... damit werden nur noch PDF-Dateien in der Download-Liste angezeigt.


Mit einer Kombination aus weiteren Anpassungen, können natürlich noch weitere Feinheiten mit eingebaut werden.
In meiner Anforderung waren es noch:
• Bootstrap card
• Darstellung der Dateigrösse

{# templates/content_element/downloads/pdf-files.html.twig #} 

{% extends "@Contao/content_element/downloads.html.twig" %}

{% block content %}
    {% with { items: downloads|filter(item => item.file.extension(true) == 'pdf') } %}
      <div class="card">
        <div class="card-body">
          {{ block('list_component') }}
        </div>
      </div>
    {% endwith %}
{% endblock %}

{% block list_item_attributes %}
    {{- attrs(list.item_attributes|default).addClass(['download-element list-group-item', "ext-pdf"]) -}}
{% endblock %}

{% block list_item %}
    {% with { download: item } %}{{ block('download_component') }}{% endwith %}
{% endblock %}


{% block list_attributes %}
  {# add class to <ul> #}
  {{ parent() }} class="list-group"
{% endblock %}

{%- block download_link_inner -%}
    {{ text }} ({{ download.file.fileSize|format_bytes }})
{%- endblock -%} 


Hier werden der <ul> eine Klasse list-group hinzugefügt und dem <li> eine Klasse list-group-item.

Und im block download_link_inner erhalten die Downloaddateien die Information zur Dateigrösse zurück.
Danke an dieser Stelle an Fritz für die Bereitstellung dieser Information im Forum.
Hier geht's zum Forumseintrag.

Kommentare

Einen Kommentar schreiben

Bitte rechnen Sie 3 plus 8.