Podlove-Templates mit Twig (2): Episoden-Metadaten

Im ersten Teil dieser kleinen Serie ging es um die vergleichsweise einfache Aufgabe die Zusammenfassung der Episode und den Player einzubinden. In diesem zweiten Teil wollen wir den Besucher unseres Podcastblogs mit weiteren Informationen über die Episode versorgen, nämlich der Spielzeit oder Dauer und dem Erscheinungsdatum der Episode. Je nach dem wie Du Podlove konfiguriert hast, können wir auch ausgeben, wann die Episode aufgenommen wurde.

Aufzeichnungs- & Erscheinungsdatum

Für diese beiden Daten geben uns die Podlove-Entwickler zwei Twig-Variablen an die Hand: episode.recordingDate und episode.publicationDate. Die wir wie jede andere Variable aufrufen können, indem wir sie in geschweifte Klammern setzen:

<p>Diese Episode ist am {{ episode.publicationDate }} erschienen. Aufgezeichnet haben wir sie am {{ episode.recordingDate }}.</p>

Voraussetzung dafür, dass Du das Aufzeichnungsdatum ausgeben kannst, ist natürlich dass Du im entsprechenden Feld Deiner Episoden auch etwas einträgst. Standardmäßig nutzt die Variable das was Du in Deinen WordPress-Einstellungen für die Darstellung von Zeit angegeben hast. Du kannst die Ausgabe aber auch selbst formatieren:

 <p>Diese Episode ist am {{ episode.publicationDate.format('d.m.Y') }} erschienen. Aufgezeichnet haben wir sie am {{ episode.recordingDate.format('d.m.Y') }}.</p> 

Das Ergebnis sieht dann so aus:

Diese Episode ist am 17.08.2019 erschienen. Aufgezeichnet haben wir sie am 13.07.2018.

Dauer

Dazu bleiben wir in dem Template, das wir neu angelegt haben und schreiben unterhalb von {% endif %} weiter. Das Schöne an Twig ist, dass wir hier sehr einfach HTML benutzen können, um den Text zu formatieren.

<p><strong>Dauer:</strong> {{ episode.duration }} </p>

Wir lassen also das Wort „Dauer“ fett ausgeben, die dynamischen Daten die für die jeweilige Episode eingefügt werden sobald die Seite aufgerufen wird, erscheinen normal.

Das gleiche geht natürlich auch mit CSS:

<span style="text-decoration:bold">Dauer:</span> {{ episode.duration }} </span>

:Wenn Dir eine Episodendauer von 1:27:48 irgendwie zu doof ist, dann greifen wir auf Variablen und if-Schleifen zurück. Das Ziel ist, eine Spielzeit-Angabe zu haben, die etwa so aussieht: „1 Stunde 27 Minuten und 48 Sekunden“. Das funktioniert so:

<p><strong>Dauer:</strong> {{ episode.duration.hours }} Stunde {{ episode.duration.minutes }} Minuten und 
{{ episode.duration.seconds }}</p>

Das macht exakt das, was wir wollen mit dem kleinen Pferdefuß, dass da nun unabhängig vom Wert der einzelnen Variablen immer „Stunde“ steht. Bei einer Episode die 1 Stunde 27 Minuten und 48 Sekunden dauert, ist das ja gut. Aber ohne ein bisschen Hexerei wird es an anderer Stelle 2 Stunde 1 Minuten und 0 Sekunden heißen. Deswegen brauchen wir einige if-Schleifen.

<p><strong>Dauer:</strong> {{ episode.duration.hours }} 
{% if episode.duration.hours == 0 or  episode.duration.hours > 1 %} Stunden
  {% elseif episode.duration.hours == 1 %} Stunde
{% endif %}
 {{ episode.duration.minutes }} 
{% if episode.duration.minutes == 0 or  episode.duration.minutes > 1 %} Minuten
  {% elseif episode.duration.minutes == 1 %} Minute
{% endif %} 
 und {{ episode.duration.seconds}} 
{% if episode.duration.seconds == 0 or episode.duration.seconds > 1 %} Sekunden
  {% elseif episode.duration.seconds == 1 %} Sekunden 
{% endif %} 
</p>

Das Ergebnis ist nun dynamisch und für jede Länge richtig. Aber wir können das auch noch etwas eleganter darstellen, indem wir die langen Variablen der Podlove-Entwickler durch eigene, kürzere ersetzen:

{% set Stunden = episode.duration.hours %}
{% set Minuten = episode.duration.minutes %} 
{% set Sekunden = episode.duration.seconds %} 

Davon abgesehen bleibt die restliche Operation gleich

 <p><strong>Dauer:</strong> {{ Stunden }} 
 {% if Stunden == 0 or Stunden > 1 %} Stunden
  {% elseif Stunden  == 1 %} Stunde
{% endif %}
 {{ Minuten }} 
{% if Minuten == 0 or Minuten > 1 %} Minuten
  {% elseif Minuten == 1 %} Minute
{% endif %} 
 und {{ Sekunden }} 
{% if Sekunden == 0 or Sekunden > 1 %} Sekunden
  {% elseif Sekunden == 1 %} Sekunden 
{% endif %}  

Damit sieht Dein neues Template nun so aus:

{% if not is_feed() %}
    {{ episode.summary }}
    {{ episode.player }}
{% endif %} 
{% set Stunden = episode.duration.hours %}
{% set Minuten = episode.duration.minutes %} 
{% set Sekunden = episode.duration.seconds %} 
<p><strong>Dauer:</strong> {{ Stunden }} 
{% if Stunden == 0 or Stunden > 1 %} Stunden
  {% elseif Stunden  == 1 %} Stunde
{% endif %}
 {{ Minuten }} 
{% if Minuten == 0 or Minuten > 1 %} Minuten
  {% elseif Minuten == 1 %} Minute
{% endif %} 
 und {{ Sekunden }} 
{% if Sekunden == or Sekunden > 1 0 %} Sekunden
  {% elseif Sekunden == 1 %} Sekunden 
{% endif %} 
Erschienen am {{ episode.publicationDate.format('d.m.Y')  }}, aufgenommen am {{ episode.recordingDate.format('d.m.Y') }}
</p>   

Achtung! Bei den Vergleichsoperatoren and und or ist Groß- und Kleinschreibung wichtig! Wenn Du AND oder OR schreibst, funktioniert die Operation nicht.

In Teil 3 der Reihe werden wir uns damit beschäftigen, wie wir ähnliche Episoden anzeigen können.

Alle Lektionen in dieser Reihe:

3 Kommentare

  1. Ab „Davon abgesehen bleibt die restliche Operation gleich“ ist der Code falsch. In der Zeile mit den Sekunden ist eine 0 verrutscht. Dort heißt es „if Sekunden == or Sekunden > 1 0“, es muss aber „if Sekunden == 0 or Sekunden > 1“ heißen.

  2. Ich noch einmal 🙂
    Im zweitletzen Codeblock ist das mit der verrutschten 0 nun korrigiert, im letzten aber noch falsch.
    Unabhängig davon ist bei beiden die Ausgabe bei „Sekunde“ nicht richtig, denn egal wie viele Sekunden die Episode hat, es wird immer „Sekunden“ ausgegeben. Aber im Fall von einer Sekunde müsste es dann „Sekunde“ heißen. Der Teil ist in allen drei Codeblocks, in denen es vorkommt, falsch.

Kommentar hinterlassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert