Timeline - TYPO3

Timeline - TYPO3

Timeline-Zeitreisen leicht gemacht

Zeitleisten ermöglichen es, Informationen in einer visuell ansprechenden und leicht verständlichen Form darzustellen. Sie erleichtern Benutzern das Durchsuchen und Verstehen von Inhalten, vor allem wenn sie zeitlich geordnet sind. Schau gerne auf unserer Beispielseite vorbei, um eine Vorstellung zu bekommen, wie eine Timeline aussehen könnte: Klicke hier

Das Modul im Frontend

Die Timeline hat zwei Varianten, einmal die Horizontale und dir Vertikale Timeline. Außerdem besteht das Modul im Frontend aus mehreren Teilen. Einer Zeitleiste, einer Überschrift, einem Text und gegebenenfalls einem Bild und einem Button.


Die Zeitleiste dient zur visuellen Darstellung von zeitlich aufeinander folgenden Ereignissen 










Mit dem Text so wie einem Bild ist es möglich dem Timelineeintrag Inhalt zu geben. Zusätzlich hat man mit dem Button die Möglichkeit, auf Seiten zu verlinken.

Pflege im Backend

Die Pflege der Timeline erfolgt in zwei Schritten.

1. Den Rahmen einfügen

1. Wir starten auf der gewünschten Seite.
2. Um den Rahmen einzupflegen, musst du unter +Inhalt bei Container die gewünschte Timeline einpflegen.


2. Timeline Einträge einpflegen

Nun musst du in dem Rahmen erneut auf +Inhalt drücken und kannst einen Zeitleisten-Eintrag erstellen


Den Zeitleisten-Eintrag pflegen

Es gibt fünf verschiedene Felder:
  1. Datum
  2. Überschrift
  3. Button
  4. Text
  5. Mediendatei

Alert
Bei dem Button muss ein vollständiger Link hinterlegt werden

Pflege der Vertikalen Timeline

Die Pflege der Vertikalen Timeline funktioniert genau wie bei der Horizontalen Timeline, mit dem Unterschied, dass es unterschiedliche Spalten gibt.
Folgende Felder gibt es:
  1. Überschrift
  2. Unterschrift
  3. Button Link
  4. Mediendatei
  5. Extra Text
  6. Text für Kreis
  7. Icon
  8. Farbschema


Pflege der Variante 3

Die Variante 3 kommt mit mehr Möglichkeit im Vergleich zur Variante 0.
  1. Die Grafik des "Zeitstrahls" kann individuell gestaltet werden. Dafür muss ein SVG gepflegt werden. Bei den Mini-Teasern empfehlen Größe von 36 x 114px, bei den Cards 36 x 304px. Beim SVG muss fill="currentColor" gesetzt werden, damit sich die Farbe der Linie korrekt anpasst.
  2. Es kann zwischen der Card Optik und der Mini-Teaser Optik unterschieden werden.
  3. Es kann ein Farbschema gewählt werden




    • Related Articles

    • destination.youtube - TYPO3

      destination.youtube - YouTube auf der Landingpage Darstellung im Frontend Wer das Modul einmal selbst testen will, kann dies über folgenden Link machen: LINK Hinweis: Für die Anzeige im Frontend müssen Cookies akzeptiert werden. Pflege im Backend ...

    • Mehrere Varianten von Modulen - TYPO3

      Unterschiedliche Varianten eines Moduls pflegen Innerhalb unserer Produktwelt besteht die Möglichkeit, verschiedene Module mit unterschiedlichen Varianten zu erwerben. Die Pflege innerhalb der Module variiert dabei leicht und kann innerhalb der ...

    • Web Releasenotes 2025 04

      Liebe Kund:innen, wir freuen uns, euch die neueste Version unseres TYPO3-Produkts auf web.destination.one sowie der destination.welcome+ vorstellen zu können, die durch euer wertvolles Feedback und eure Anregungen ermöglicht wurde. Im Folgenden ...

    • Übersicht TYPO3 Cookies

      Übersicht über alle Cookies und weitere Techniken in unserem Produkt, die von Cookie-Tools gemanagt werden können. Drittanbieter (Tag Manager, Analytics, IBE's, Widgets, zusätzliche TYPO3-Extensions, etc.) müssen in den Projekten immer individuell ...

    • Web Releasenotes 2026 02

      Liebe Kund:innen, wir freuen uns, euch die neueste Version unseres TYPO3-Produkts auf web.destination.one vorstellen zu können! Dank eures wertvollen Feedbacks und eurer Anregungen konnten zahlreiche Verbesserungen und Optimierungen umgesetzt werden. ...