Nextcloud (Schul-)Kalender in WordPress anzeigen

Nextcloud (Schul-)Kalender in WordPress anzeigen

Zur Zeit der Schulschließungen habe ich ja schon darüber geschrieben, wie wir Nextcloud an der Schule nutzen, um für alle Beteiligten eine Austauschplattform zu Verfügung zu haben. Da Nextcloud neben der Dateiablage auch eine Kalenderverwaltung beinhaltet, liegt es nahe, damit auch die Schultermine an zentraler Stelle zu verwalten. Termine sind gerade auch für die Schülerinnen und Schüler sowie deren Eltern wichtig, deswegen wollten wir als Schule die Termine auch auf der Homepage angezeigt haben. Wie das mit Nextcloud und WordPress geht, zeige ich in diesem Artikel.

Vorarbeiten in der Nextcloud

Wir haben in unserer Nextcloud mehrere Kalender angelegt, die teilweise öffentlich, teilweise aber auch nur intern genutzt werden sollen:

Übersicht über die Kalender in Nextcloud

Über das Freigabesymbol, das bei einem neu angelegten Kalender standardmäßig grau erscheint, kann man festlegen, ob der Kalender über einen Link geteilt werden soll (öffentlich) oder nur mit Benutzern innerhalb der Nextcloud (privat). Hier als Beispiel unser Schulkalender:

Kalender teilen

Der Kalender ist mit Nutzergruppen innerhalb der Nextcloud geteilt: Mitglieder der Gruppe Lehrkräfte können den Kalender nur lesen, Mitglieder der Gruppe Leitung können ihn bearbeiten, also neue Termin einpflegen oder bestehende Termine verändern. Zusätzlich ist der Kalender öffentlich geteilt über den Punkt “Link teilen”. Damit kann man den Kalender auch öffentlich verfügbar machen, z.B. über seine Schulhomepage. Dazu benötigt man den Abonnements-Link den man in die Zwischenablage kopieren kann, wenn man auf das Menu bei “Link teilen” klickt.

Abonnements-Link kopieren

Umsetzung in WordPress

Mit diesem Link kann man nun jede beliebige Software verwenden, die CalDav versteht, um die Kalenderdaten anzuzeigen. Da wir gerade unsere Homepage mit WordPress neu aufsetzen, demonstriere ich den Vorgang mit dem für WordPress verfügbaren Plugin ICS Calendar. Das Plugin ist sehr puristisch gehalten, verfügt aber über viele Möglichkeiten, das Aussehen der Anzeige zu verändern. Die Free-Version ist für viele Schulen bestimmt ausreichend, wer mehr möchte kann sich die Pro-Version kaufen.

Ist das Plugin installiert, kann man innerhalb einer Seite mit der Eingabe von

[ics_calendar url="Abonnenment-Link"]

den Kalender im Monatsformat anzeigen lassen. Innnerhalb der Anführungszeichen muss dann natürlich der vorhin kopierte Abonnement-Link eingefügt werden. Damit wäre die Anzeige bereits möglich, allerdings gibt es noch mehr Optionen, die man nutzen kann, um die Anzeige zu verbessern.

Mehrere Kalender (bei uns sind es im Moment vier) kann man in einer Übersicht anzeigen lassen, in dem man sie innerhalb der Anführungszeichen per Leerzeichen oder | getrennt eingibt, also

[ics_calendar url="Abonnenment-Link1 Abonnenment-Link2 ..."]

Zusätzlich kann man jeden Kalender mit einer Farbe darstellen lassen, sodass man die Kalendereinträge auch optisch gut unterscheiden kann. Leider ist mir keine einfache Möglichkeit bekannt die Farben der Nextcloud-Kalender zu übernehmen, so dass man sie manuell aus der Nextcloud einmal übertragen muss, wenn man die gleiche Farbe haben möchte. Den Eintrag ergänzt man dann um die Farben in Hex-Schreibweise

[ics_calendar url="Abonnenment-Link1 Abonnenment-Link2 ..."
 color="#0040ff #ff0000 ..."]

Eine weitere Option ist die Änderung der Bezeichnungen der Kalender, da die Abonnement-Links meistens den Nutzernamen des Kalenderbesitzers mitschicken. Dafür gibt es die Option feedlabel, bei der man wie vorher auch bei den Farben und Urls die Bezeichnungen in der richtigen Reihenfolge angibt.

[ics_calendar url="Abonnenment-Link1 Abonnenment-Link2 ..."
 color="#0040ff #ff0000 ..."
 feedlabel="Termine für Alle|Unterstufe|Mittelstufe|Oberstufe"]

Damit hat man im Prinzip eine funktionierende Ansicht für die Schulhomepage, kann aber natürlich noch die Möglichkeiten von dem Plugin nutzen, wie z.B. standardmäßige Wochen- oder Listenansicht, Anzeige von Start- und Endzeit eines Termins, usw.

Alle diese Möglichkeiten sind in der Plugin-Ansicht innerhalb des WordPress-Backends erlläutert, so dass man dort nachlesen sollte. Wem die Optionen nicht reichen, kann sogar eine Pro-Version kaufen, die weitere Einstellungen bietet.

So sieht im Moment unsere Konfiguration aus, die Abonnement-Links habe ich aus Gründen der Übersicht gekürzt

[ics_calendar url="Link1 Link2 Link3 Link4"
title="false"
color="#0040ff #ff0000 #ffff00 #11924f" 
feedlabel="Termine für Alle|Unterstufe|Mittelstufe|Oberstufe" showendtimes="true" 
hidealldayindicator="true" 
legendinline="true"]

Und so sieht das Ganze dann in der Umsetzung aus:

Nächste Termine auf der Startseite

Mit der Ansicht als Liste (view=”list”) kann man auch nur eine Übersicht der kommenden Termine anzeigen lassen. Wir nutzen das auf unserer Startseite. Dazu ist folgender Eintrag notwendig:

[ics_calendar url="link1 link2 link3 .." title="Termine" description="false" view="list" count="5" showendtimes="true" hidealldayindicator="true" format="d.m.y" legendstyle="none"]

Damit werden immer die nächsten 5 (count=”5″) anstehenden Termine aus den angegebenen Kalendern angezeigt. Die weiteren Parameter beeinflussen die Anzeige mit Datumsformat und Deaktivierung von Legende und Beschreibung, so dass nur die Termintitel dargestellt werden.

Eine Übersicht über alle möglichen Parameter findet man auf der Seite der Software selbst:

https://icscalendar.com/icsdocs/

Unseren fertigen Kalender findet man unter https://humboldtgymnasium-solingen.de/kalender/ und die Übersicht auf der Startseite.

Schreibe einen Kommentar

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