Wie man schöne Event-Zeitleisten in WordPress hinzufügt (2 Methoden)

Möchten Sie die Geschichte Ihres Unternehmens erzählen, ohne Ihre Besucher mit Textwänden zu langweilen? Eine visuelle Zeitleiste ist die perfekte Lösung.

Ereignis-Zeitleisten sind eine fantastische Möglichkeit, Ihre Geschichte hervorzuheben oder wichtige Momente auf eine Weise zu präsentieren, die Ihr Publikum wirklich fesselt.

Anstatt Textwände zu überfliegen, werden die Besucher in eine visuelle Reise hineingezogen, die sie durch jeden Meilenstein führt.

Nach dem Testen vieler Zeitleistenlösungen für WordPress haben wir zwei gefunden, die beide einfach zu bedienen sind und professionell aussehende Ergebnisse liefern. In diesem Leitfaden zeigen wir Ihnen, wie Sie schöne Zeitleisten erstellen, die Besucher interessieren und zum Scrollen anregen. 🚀

📌 Schnelle Antwort: Der einfachste Weg, eine Zeitleiste zu WordPress hinzuzufügen, ist die Verwendung des Cool Timeline Plugin. Es bietet zwei Methoden:

Funktion	Methode 1 – Timeline Stories	Methode 2 – Timeline Block
🌟 Am besten geeignet für	Wiederverwendbare globale Zeitleisten	Einmalige, einzigartige Zeitleisten
🎢 Flexibilität	Hoch (Globale Updates)	Moderat (Seitenabhängig)
⚙️ Einrichtung	Dashboard-Menü	Block-Editor

Warum eine schöne Event-Zeitleiste in WordPress hinzufügen?

Event-Zeitleisten heben wichtige Meilensteine mit einer klaren, chronologischen Struktur hervor. Studien zeigen, dass Inhalte mit relevanten visuellen Elementen 94 % mehr Aufrufe erhalten als reine Textinhalte, und die Verwendung einer Zeitleiste kann dazu beitragen, den Storytelling-Aspekt Ihrer Inhalte zu verbessern.

Über Meilensteine hinaus ermöglichen Zeitleisten die visuelle Darstellung von Fortschritten, Phasen und der Verflechtung von Ereignissen. Dies kann Ihre Inhalte ansprechender gestalten.

Was Anwendungsfälle angeht, verwenden viele WordPress-Websites Zeitleisten, um zusammenhängende Ereignisse auf organisierte und visuell ansprechende Weise darzustellen.

Unternehmen und Organisationen nutzen Zeitleisten auch oft, um ihre Geschichte zu zeigen.

Wenn Sie eine Portfolio-Website haben, wie z. B. ein Online-Fotografie-Portfolio, können Sie Ihre Fotografien in einer schönen vertikalen Zeitleiste anzeigen, die Ihre Reise um die Welt zeigt.

Dies kann ansprechender sein, als Ihre Geschichte zu schreiben und sie als Seite mit einfachem Text auf Ihrer Website hinzuzufügen.

So fügen Sie eine Ereigniszeitleiste in WordPress hinzu

Der einfachste Weg, eine Ereigniszeitleiste in WordPress hinzuzufügen, ist die Verwendung des Cool Timeline-Plugins. Dieses kostenlose, benutzerfreundliche Plugin ermöglicht es Ihnen, beeindruckende Zeitleisten schnell und einfach zu erstellen.

Um zu beginnen, navigieren Sie zu Plugins » Plugin hinzufügen auf Ihrem WordPress-Admin-Dashboard.

Geben Sie auf dem nächsten Bildschirm „Cool Timeline“ in die Suchleiste ein, um das Plugin schnell zu finden.

Wenn Sie es sehen, klicken Sie auf „Jetzt installieren“ und dann auf „Aktivieren“.

Details finden Sie in unserem Leitfaden zur Installation eines WordPress-Plugins.

Nach der Aktivierung sehen Sie ein neues Menü Timeline Addons in der Seitenleiste Ihres WordPress-Adminbereichs.

Mit diesem Plugin können Sie Event-Timelines auf 2 Arten erstellen.

Die erste Methode beinhaltet das Hinzufügen von Stories einzeln über das Menü Timeline Addons. Dies erstellt eine Datenbank von Ereignissen, die es Ihnen ermöglicht, exakt dieselbe Timeline automatisch auf mehreren Seiten Ihrer Website anzuzeigen.

Diese Methode erlaubt es Ihnen jedoch nicht, dieselbe Timeline auf Ihrer gesamten Website wiederzuverwenden, es sei denn, Sie speichern sie als synchronisiertes Muster (früher bekannt als Wiederverwendbarer Block).

Die andere Option ist die Verwendung des Cool Timeline Blocks, um eine visuelle Timeline innerhalb des WordPress Block Editors zu erstellen. Dies ermöglicht es Ihnen, verschiedene Timelines auf verschiedenen Teilen Ihrer Website anzuzeigen.

Nachteilig ist, dass diese Methode es Ihnen nicht erlaubt, dieselbe Timeline auf Ihrer gesamten Website wiederzuverwenden, es sei denn, Sie speichern sie als Blockmuster selbst.

In diesem Leitfaden werden wir beide Methoden behandeln. Unabhängig davon, wie Sie Ihre Timeline erstellen, müssen Sie das Cool Timeline Plugin installieren und aktivieren.

Sobald Sie fertig sind, können Sie Ihre Zeitleiste entweder über das Menü "Timeline Addons" oder den Block-Editor erstellen. Wenn Sie lieber direkt zu einer bestimmten Methode springen möchten, können Sie die folgenden Links verwenden:

Bereit? Legen wir los.

Methode 1. So erstellen Sie eine wiederverwendbare Ereigniszeitleiste mit dem Menü „Timeline Addons“

Um Ihr erstes Ereignis zu erstellen, können Sie in Ihrem WordPress-Dashboard zu Timeline Addons » Neue Story hinzufügen gehen.

Sie können dem Ereignis dann einen Titel geben, indem Sie ihn in das Feld 'Titel hinzufügen' eingeben.

Geben Sie im Haupteditor die Beschreibung des Ereignisses ein.

Sobald Sie dies getan haben, klicken Sie in der rechten Spalte auf den Link „Beitragsbild festlegen“.

Sie können nun das Bild auswählen, das die Veranstaltung auf Ihrer Zeitleiste darstellen soll. Sie können entweder auf „Bild auswählen“ klicken, um ein Bild aus der WordPress-Mediathek auszuwählen, oder eine neue Bilddatei von Ihrem Computer hochladen.

Als Nächstes scrollen Sie nach unten zum Abschnitt „Timeline Story Settings“. Hier können Sie auf das Feld „Story Date / Year“ klicken und das Kalender-Popup verwenden, um die Zeit und das Datum auszuwählen, an dem das Ereignis stattgefunden hat.

Sie können auch zwischen einem „Full“ oder „Small“ Bild für das Ereignis wählen.

Im folgenden Bild sehen Sie ein Beispiel für ein „Full“-Bild.

Größere Bilder lenken die Aufmerksamkeit des Besuchers auf die wichtigsten Ereignisse in der Zeitleiste. Allerdings nehmen „Voll“-Bilder mehr Platz ein.

Das folgende Bild zeigt dasselbe Ereignis, diesmal jedoch mit einem „kleinen“ Bild.

Wenn Sie viele verschiedene Ereignisse zu Ihrer Zeitleiste hinzufügen möchten, sollten Sie die Einstellung „Klein“ verwenden.

Dies kann verhindern, dass Ihre Zeitleiste überladen wirkt.

Nachdem Sie diese Änderungen vorgenommen haben, scrollen Sie zum oberen Rand der Seite und klicken Sie auf die Schaltfläche „Veröffentlichen“.

Und das war's – Sie können diese Schritte nun wiederholen, um weitere Ereignisse zu erstellen.

Möchten Sie alle bisher erstellten Ereignisse sehen? Gehen Sie dann einfach zu Timeline Addons » Cool Timeline Stories.

Sobald Sie alle Ihre Ereignisse erstellt haben, besteht der nächste Schritt darin, anzupassen, wie die Zeitachse auf Ihrer Website aussehen wird.

Um dies zu tun, können Sie zu Timeline Addons » Timeline Settings » General Settings gehen.

Im Abschnitt „Zeitleistentitel“ können Sie den Titel eingeben, der über Ihrer Zeitleiste angezeigt wird.

Cool Timeline kann auch ein Bild über Ihrer Zeitleiste anzeigen, z. B. Ihr Firmenlogo. Dies kann dazu beitragen, Ihr Branding zu stärken und Besuchern zu zeigen, was die Zeitleiste anzeigt.

Um dieses optionale Bild hinzuzufügen, klicken Sie auf die Schaltfläche „Hochladen“.

Sie können nun entweder ein Bild aus Ihrer WordPress-Mediathek auswählen oder eine neue Datei von Ihrem Computer hochladen.

Wenn Sie einer Zeitleiste viel Text hinzufügen, kann diese überladen und abschreckend wirken.

In diesem Sinne möchten Sie vielleicht eine maximale Anzahl von Wörtern festlegen, die auf der Zeitleiste angezeigt werden. Um ein maximales Wortlimit festzulegen, geben Sie einfach eine Zahl in das Feld „Content Length“ ein.

Wenn Sie ein Limit festlegen, ist es eine gute Idee, Links wie „Weiterlesen“ zu Ihrer Zeitleiste hinzuzufügen. Cool Timeline fügt diesen Link dann zu allen Beschreibungen hinzu, die größer als Ihr Wortlimit sind.

Um diesen Link hinzuzufügen, suchen Sie den Abschnitt „Mehr lesen anzeigen?“ und klicken Sie auf die Schaltfläche „Ja“.

Sie können nun entscheiden, ob das Klicken auf den Link 'Weiterlesen' den Rest Ihres Textes in derselben Registerkarte oder in einer neuen Browserregisterkarte anzeigen soll. Um diese Wahl zu treffen, klicken Sie einfach auf die Optionsschaltfläche 'Gleiche Registerkarte' oder 'Neue Registerkarte'.

Standardmäßig zeigt die Timeline das Jahr an, in dem jedes Ereignis stattgefunden hat. Möglicherweise müssen Sie diese Informationen jedoch nicht immer anzeigen. Zum Beispiel, wenn alle Ereignisse im selben Jahr stattgefunden haben.

Um die Jahresbeschriftung auszublenden, klicken Sie einfach auf den Schieberegler 'Year Label', um ihn von 'Show' auf 'Hide' zu stellen.

Standardmäßig wird das erste Ereignis in Ihrer Zeitleiste auf der rechten Seite der vertikalen Linie der Zeitleiste angezeigt.

Möchten Sie dieses Ereignis stattdessen auf der linken Seite der Zeitleiste anzeigen? Klicken Sie dann einfach auf die Schaltfläche „Links“ neben „Vertikale Zeitleisten-Geschichten beginnen von“.

Wenn Sie mit Ihren Änderungen zufrieden sind, klicken Sie auf die Schaltfläche „Speichern“, um sie zu speichern.

Nun können Sie zum Tab „Stileinstellungen“ wechseln.

Standardmäßig hat die Zeitleiste keinen Hintergrund.

Wenn Sie möchten, können Sie Ihrer Zeitleiste einen farbigen Hintergrund hinzufügen, indem Sie auf den Schieberegler 'Timeline Background' klicken, um ihn von 'No' auf 'Yes' zu stellen.

Klicken Sie dann auf die Schaltfläche neben 'Hintergrundfarbe der Story'.

Sie sollten nun in der Lage sein, eine Hintergrundfarbe über die Farbwähl-Einstellungen auszuwählen.

Dieser Bildschirm bietet auch ähnliche Farbeinstellungen für alle verschiedenen Teile Ihrer Zeitleiste, einschließlich der vertikalen Linie und der Event-Titel. Um eine dieser Standardfarben zu ändern, klicken Sie einfach auf die Schaltfläche des Abschnitts und verwenden Sie dann den Farbwähler, der erscheint.

Wenn Sie mit den vorgenommenen Änderungen zufrieden sind, vergessen Sie nicht, auf die Schaltfläche „Speichern“ zu klicken.

Als Nächstes möchten Sie vielleicht zum Tab „Typografie-Einstellungen“ gehen. Hier können Sie die Schriftart ändern und die Größe der verschiedenen Inhalte in Ihrer Zeitleiste anpassen, wie z. B. den Zeitleistentitel und den Story-Titel.

Wenn Sie die Standard-Typografie-Einstellungen ändern, vergessen Sie nicht, Ihre Änderungen durch Klicken auf die Schaltfläche „Speichern“ zu speichern.

Sobald Sie die Zeitleiste angepasst haben, können Sie sie zu Ihrer Website hinzufügen. Öffnen Sie einfach die Seite oder den Beitrag, auf dem Sie sie anzeigen möchten, und klicken Sie dann auf die Schaltfläche „+“.

Geben Sie nun „Cool Timeline“ in die Block-Suchleiste ein. Da Sie Ihre Ereignisse über das Menü „Stories“ erstellt haben, müssen Sie den Cool Timeline Shortcode-Block auswählen, um sie anzuzeigen.

Dies zieht automatisch die von Ihnen erstellten Stories ein und zeigt sie in einem vertikalen Layout an.

Sie können Ihre Seite dann wie gewohnt aktualisieren oder veröffentlichen.

Wenn Sie nun Ihre Website besuchen, sehen Sie die Live-Zeitleiste.

Methode 2. So erstellen Sie mehrere Event-Zeitleisten in WordPress mit dem Timeline-Block

Der Cool Timeline Block ermöglicht es Ihnen, eine Zeitleiste visuell im Block-Editor zu erstellen.

Dieser Block enthält viele Platzhalterinhalte. Um Ihre Zeitleiste zu erstellen, müssen Sie einfach jeden Platzhalter durch Ihren eigenen Text und Ihre eigenen Bilder ersetzen. Dies ermöglicht es Ihnen, Ihre Zeitleiste visueller zu gestalten.

Bevor wir beginnen, beachten Sie, dass diese Methode nicht die in Methode 1 erstellten Stories verwendet. Stattdessen geben Sie die Ereignisdetails manuell direkt in den Block ein.

Öffnen Sie dazu einfach die Seite oder den Beitrag, auf der/dem Sie eine Zeitleiste hinzufügen möchten.

Sie können dann auf das '+'-Symbol klicken und 'Cool Timeline Block' eingeben. Wenn dieser Block angezeigt wird, klicken Sie darauf, um ihn zur Seite oder zum Beitrag hinzuzufügen.

Der Cool Timeline-Block hat 4 Platzhalterereignisse. Sie können mit der Bearbeitung beginnen, indem Sie auf das erste Ereignis in der Zeitleiste klicken.

Ersetzen Sie im rechten Menü einfach den Platzhalter „Story-Überschrift“ durch die Überschrift, die Sie für dieses Ereignis verwenden möchten.

Als Nächstes können Sie eine Beschreibung in das Feld „Story Description“ eingeben.

Danach möchten Sie das Feld „Primäre Beschriftung (Datum/Schritte)“ finden. Geben Sie hier das Datum ein, an dem dieses Ereignis stattgefunden hat.

Standardmäßig zeigt der Cool Timeline-Block das erste Ereignis auf der rechten Seite der Zeitachse an.

Wenn Sie das Ereignis lieber auf der linken Seite der vertikalen Linie anzeigen möchten, klicken Sie auf die Schaltfläche „Links“.

Jetzt hat der Cool Timeline-Block ein Platzhalterbild für jedes Ereignis. Um diesen Platzhalter durch Ihr eigenes Bild zu ersetzen, klicken Sie einfach auf die Schaltfläche „Entfernen“.

Sobald Sie das getan haben, klicken Sie auf die Schaltfläche „Bild hochladen/auswählen“.

Sie können dann ein Bild aus der Mediathek auswählen oder eine neue Datei von Ihrem Computer hochladen.

Für die besten Ergebnisse empfehlen wir die Verwendung von Bildern mit demselben Seitenverhältnis, z. B. alle quadratisch oder alle im Querformat, damit Ihre Zeitleiste ordentlich und professionell aussieht.

Der Cool Timeline Block zeigt dann jedes Bild in voller Größe an. Um stattdessen ein kleineres Bild anzuzeigen, öffnen Sie das Dropdown-Menü 'Bildgröße' und wählen Sie 'Mittel' oder 'Miniaturansicht'.

Sobald Sie auf eine der verschiedenen Bildgrößen klicken, wird der Block aktualisiert, um das neue Bild anzuzeigen. So können Sie verschiedene Größen ausprobieren, um zu sehen, was auf Ihrer Website am besten aussieht.

Standardmäßig markiert die Zeitachse jedes Ereignis auf der vertikalen Linie mit einem Punkt. Möglicherweise möchten Sie diesen einfachen Punkt durch ein benutzerdefiniertes Symbol ersetzen.

Sie könnten zum Beispiel verschiedene Symbole für verschiedene Arten von Events verwenden. Dann können Sie die verschiedenen benutzerdefinierten Symbole erkunden, die Sie für Ihre Zeitleiste verwenden können, indem Sie auf die Optionsschaltfläche 'Benutzerdefiniert (Font Awesome Icon)' klicken.

Sobald Sie dies getan haben, erscheint ein Dropdown-Menü mit einem Pfeilsymbol. Sie möchten es erweitern, um durch alle verschiedenen Symbole zu scrollen.

Wenn Sie das perfekte Icon für Ihr Ereignis gefunden haben, können Sie darauf klicken.

Sie können nun die restlichen Platzhalterereignisse nach demselben oben beschriebenen Verfahren anpassen.

Wenn Sie der Zeitleiste weitere Ereignisse hinzufügen möchten, klicken Sie einfach auf das Symbol „Story hinzufügen“. Dadurch wird ein neuer Platzhalter für ein Ereignis hinzugefügt, das Sie anpassen können.

Wenn Sie mit dem Aussehen der Zeitleiste zufrieden sind, können Sie die Seite wie gewohnt aktualisieren oder veröffentlichen. Sobald dies geschehen ist, ist Ihre Zeitleiste auf Ihrer WordPress-Website live.

Bonustipp: Ereignisschema in WordPress hinzufügen

Sobald Sie eine schöne Timeline erstellt haben, um Ihre Ereignisse oder Meilensteine ​​zu präsentieren, können Sie noch einen Schritt weiter gehen, indem Sie Suchmaschinen helfen zu verstehen, worum es geht.

Hier kommt Event-Schema-Markup ins Spiel.

Das Event-Schema ist ein spezieller Code, der im Hintergrund arbeitet. Es gibt Google eine klare Zusammenfassung der wichtigsten Details Ihrer Veranstaltung, wie Datum, Uhrzeit, Ort und möglicherweise Ticketinformationen, in einem strukturierten Format, das es leicht lesen kann.

Außerdem kann das Hinzufügen von Event-Schema dazu beitragen, dass Ihre Inhalte in Rich Snippets oder Google-Event-Listings erscheinen. Egal, ob Sie kommende Events oder die Unternehmensgeschichte teilen, es hilft den richtigen Leuten, Sie zu finden, wenn sie nach verwandten Aktivitäten oder Meilensteinen suchen.

Eine der einfachsten Möglichkeiten, dies zu tun, ist die Verwendung von AIOSEO Pro, dem besten SEO-Plugin für WordPress. Es bietet einen leistungsstarken Schema-Generator, der mehrere Schematypen unterstützt, einschließlich Ereignis, damit Suchmaschinen Ihre Inhalte besser verstehen und hervorheben können.

Weitere Details finden Sie in unserem Leitfaden zum Hinzufügen von Event-Schema in WordPress.

FAQs: Fügen Sie Ihrer WordPress-Website eine schöne Ereigniszeitleiste hinzu

Haben Sie Fragen zur Anzeige Ihrer Veranstaltungen im Zeitleistenformat auf WordPress? Hier sind einige schnelle Antworten, die Ihnen den Einstieg erleichtern.

Hat WordPress eine integrierte Kalender- oder Zeitleistenfunktion?

WordPress enthält standardmäßig keine integrierte Kalender- oder Zeitleistenfunktion. Sie können jedoch ganz einfach eine mit Plugins wie Cool Timeline oder Sugar Calendar hinzufügen.

Ist das Cool Timeline Plugin kostenlos nutzbar?

Ja, Cool Timeline hat eine kostenlose Version, die für die meisten Websites leistungsfähig genug ist. Sie enthält die Kernfunktionen, die zum Erstellen vertikaler Zeitleisten benötigt werden. Für horizontale Layouts und erweiterte Design-Skins müssen Sie auf die Pro-Version upgraden.

Wie erstelle ich eine Ereignis-Zeitleiste in WordPress?

Der einfachste Weg ist die Verwendung eines Plugins wie Cool Timeline. Nach der Installation können Sie Ereignisse oder Meilensteine als Zeitachsen-Stories hinzufügen, das Layout anpassen und sie mit einem Shortcode oder Block anzeigen.

Kann ich eine Kalenderansicht neben der Zeitleiste hinzufügen?

Ja, das können Sie. Während sich das Cool Timeline-Plugin auf visuelle Zeitleisten konzentriert, bietet es keine traditionelle Kalenderansicht. Wenn Sie Ihre Ereignisse im Monats- oder Tageskalenderformat anzeigen möchten, empfehlen wir die Verwendung eines Kalender-Plugins wie Sugar Calendar.

Wie zeige ich das heutige Datum in WordPress an?

Sie können einen Shortcode, ein Widget oder benutzerdefinierten Code verwenden, um das heutige Datum anzeigen. Einige Page-Builder-Widgets und Themes haben diese Funktion ebenfalls integriert.

Verwandte Leitfäden zur Verwaltung von WordPress-Ereignissen

Wir hoffen, dieser Artikel hat Ihnen geholfen zu lernen, wie Sie Ihrem WordPress-Website eine schöne Ereigniszeitleiste hinzufügen.

Wenn Sie dies hilfreich fanden, möchten Sie vielleicht auch unsere Anleitungen zu folgenden Themen lesen:

• So zeigen Sie kommende Events in WordPress an
• Wie man Mitglieder-exklusive Veranstaltungen in WordPress durchführt
• So erstellen Sie eine Veranstaltungsregistrierungsseite in WordPress
• So fügen Sie ein Countdown-Timer-Widget in WordPress hinzu
• Beste WordPress-Kalender-Plugins

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.