Event-Kalender

Mit dem Event-Kalender können Sie Events (Ereignisse) in einer DB-Tabelle speichern. Die Events werden übersichtlich in einem Kalender angezeigt. Die Navigation des Kalenders läuft vollständig über JavaScript (AJAX), somit ist kein Seitenwechsel nötig.

Der Kalender zeigt alle Tage eines Monats in Form einer Tabelle an. Dabei kann über Links zum Vormonat oder kommenden Monat navigiert werden, auch die Auswahl eines bestimmten Monats oder Jahres ist möglich.

Im Kalender können Feiertage angezeigt werden, diese lassen sich im PHP-Quelltext individuell anpassen.

Bildschirmfotos

Event eintragen - Event direkt im Kalender eintragen (Optional).

Event anzeigen - Der Event wird unterhalb des Kalenders angezeigt.

Event aktualisieren - Event bearbeiten, verschieben (Tag/Uhrzeit) oder Event löschen

Kalender - Editor - Events im Editor eingetragen oder bearbeiten (Optional).

Die Bildschirmfotos können von der aktuellen Version abweichen!

Eigenschaften

Flexible Größe - Der Kalender passt sich automatisch der Breite der Seite an.
Events direkt im Kalender eintragen oder bearbeiten.
Schnelle Auswahl von bestimmten Monaten oder Jahren.
Passwort-Schutz (auch für mehrere Benutzer).
Anzeige von Feiertagen (Optional).

Jeder Benutzer kann nur seinen eigenen Event bearbeiten (der Admin. alle)!
Einfaches ändern der Farben des Kalenders durch eine externe CSS-Datei.
Die Dateien sind mit dem Zeichensatz UTF-8 kodiert.
Kalender-Navigation mit JavaScript.
Der Name des Autors kann im Kalender angezeigt werden (Optional).

URLs werden in der Beschreibung des Events autom. umgewandelt.
HTML-Tags können in der Beschreibung verwendet werden.
Kalenderblatt für jeden Kalendertag (Optional).
Auswahl einer bestimmten Uhrzeit für den Event.
Unterstützung für BB-Code.

[Bildschirmfoto]
Der Event-Kalender mit einem Hintergrundbild. — Der Event-Kalender mit einem Hintergrundbild.

Prioritäten (farbige Markierungen) für Events setzen (Optional).
Eine schnelle Suchfunktion im Kalender.
Anzeige einer Liste der aktuellen Events (◆).
Ein Event als iCal (ics-Datei) exportieren (Optional).
Jährliche Wiederholung eines Events (für Geburtstage, Feiertage etc.).

Es kann nun das Ende eines Events (Uhrzeit) ausgewählt werden.
Die Wochentage (Mo-So) sind anklickbar, diese zeigen dann alle Events des Wochentags im Monat oder Jahr an.
Die Tagesansicht zeigt alle Events des gewählten Tages an.
Eine bestimmte Kalenderwoche kann ausgewählt werden.
Smileys und Symbole (😁🌼🍓🎁🐉 …) vom Smartphone werden nativ dargestellt.

Neu

In den Optionen (◼) kann eine bestimmte Priorität ausgewählt werden.
Serienevents eintragen - Events in den Kalender eintragen die über mehrere Tage gehen.
Die Tagesansicht, das Kalenderblatt und die Kalenderwoche haben nun eine Navigation, mit dieser kann ein Tag/Woche vor- oder zurück gesprungen werden.
Ein Doppelklick im Kalender auf einem Kalendertag, zeigt die Kalenderwoche an.

Kalender einbinden

Der Kalender lässt sich in jede HTML-Seite einbinden, einfach den Blau hervorgehobenen Text in die Seite einfügen.

<!DOCTYPE html>
<html lang="de">
 <head>
  <meta charset="UTF-8">
  <title>Kalender</title>
  <link rel="stylesheet" href="kalenderstyle.css">
  <script type="text/javascript" src="kalenderscript.js"></script>
 </head>
<body>

<div id="kalender"></div>

</body>
</html>

Kalender in ein anderes Verzeichnis einbinden

Die Relativen Pfade anpassen, ausgehend vom aktuellen Verzeichnis in dem der Verweis liegt!

<!DOCTYPE html>
<html lang="de">
 <head>
  <meta charset="UTF-8">
  <title>Kalender</title>
  <link rel="stylesheet" href="deinverzeichnis/event-kalender/kalenderstyle.css">
  <script type="text/javascript" src="deinverzeichnis/event-kalender/kalenderscript.js"></script>
 </head>
<body>

<div id="kalender"></div>

</body>
</html>

In der Datei: kalenderscript.js (Zeile: 18) folgendes anpassen:

var kalender = "deinverzeichnis/event-kalender/kalender.php";

Voraussetzungen

Webserver (Linux) mit PHP 5.6 (oder höher), eine MySQL/MariaDB-Datenbank und Kenntnisse in HTML, CSS, JavaScript und PHP um die Scripte den eigenen Wünschen anpassen zu können.

Hinweise zur Installation

Führen Sie folgende Anweisungen nacheinander aus:

In der Datei: verbindung.php tragen Sie Ihre Zugangsdaten (zur Datenbank) ein. Dort sind auch weitere Einstellungen möglich.
Laden Sie alle Dateien auf Ihrem Webserver hoch.
Rufen Sie die Datei: installation.php in Ihrem Browser auf.
Rufen Sie die Datei: demo.htm in Ihrem Browser auf und tragen Sie Ihre ersten Event in die Datenbank ein.

Herunterladen: event-kalender.zip

Viel Spaß damit!

Tipps

Wenn man eine Liste der Events auch auf einer anderen Seite anzeigen möchte, dann sind die folgenden PHP-Scripte hilfreich.

Die Events des aktuellen Monats anzeigen:

Dieses Script zeigt die Events des aktuellen Monats an.


<?php

// Event Kalender

// Events des aktuellen Monats anzeigen



include "verbindung.php"; // Dateipfad eventuell anpassen



$select = $db->query("SELECT `start`, `event`, `beschreibung`

                      FROM `" . $TABLE_PREFIX . "_kalender`

                      WHERE YEAR(`start`) = YEAR(NOW()) AND

                            MONTH(`start`) = MONTH(NOW())

                      ORDER BY `start` ASC");

$events = $select->fetchAll();

foreach ($events as $event) {

 sscanf($event["start"], "%4s-%2s-%2s %5s", $dbJahr, $dbMonat, $dbTag, $dbUhr);

 echo $dbTag . '.' . $dbMonat . '.' . $dbJahr . '&emsp;' . $dbUhr . ' Uhr - ' .

 $event["event"] . ' &mdash; ' . $event["beschreibung"] . '<br>';

}

?>

Aktuelle Events anzeigen:

Hier können Sie selbst die Anzahl der Events bestimmen die angezeigt werden soll.


<?php

// Event Kalender

// Aktuelle Events anzeigen (mit Beschreibung)



include "verbindung.php"; // Dateipfad eventuell anpassen



$anzahl = 12; // Anzahl

$select = $db->query("SELECT `start`, `event`, `beschreibung`

                      FROM `" . $TABLE_PREFIX . "_kalender`

                      WHERE `start` >= NOW()

                      ORDER BY `start` ASC

                      LIMIT " . $anzahl);

$events = $select->fetchAll();

foreach ($events as $event) {

 sscanf($event["start"], "%4s-%2s-%2s %5s", $dbJahr, $dbMonat, $dbTag, $dbUhr);

 echo '<p>' . $dbTag . '.' . $dbMonat . '.' . $dbJahr . '&emsp;' . $dbUhr . ' Uhr - ' .

 $event["event"] . '<br>' . $event["beschreibung"] . '</p>';

}

?>

Events der nächsten 31 Tage:

Immer Aktuell, die Events der nächsten 31 Tage (individuell einstellbar).


<?php

// Event Kalender

//  Events der nächsten 31 Tage (individuell einstellbar).



include "verbindung.php"; // Dateipfad eventuell anpassen



$tage = 31; // Tage

$select = $db->query("SELECT `start`, `event`, `beschreibung`

                      FROM `" . $TABLE_PREFIX . "_kalender`

                      WHERE (TO_DAYS(`start`) - TO_DAYS(NOW())) >= 0 AND (TO_DAYS(`start`) - TO_DAYS(NOW())) <= " . $tage . "

                      ORDER BY `start` ASC");

$events = $select->fetchAll();

foreach ($events as $event) {

 sscanf($event["start"], "%4s-%2s-%2s %5s", $dbJahr, $dbMonat, $dbTag, $dbUhr);

 echo '<p>' . $dbTag . '.' . $dbMonat . '.' . $dbJahr . '&emsp;' . $dbUhr . ' Uhr - ' .

 $event["event"] . '<br>' . $event["beschreibung"] . '</p>';

}

?>

Veranstaltungsliste: Diese Veranstaltungsliste zeigt alle aktuellen und vergangenen Veranstaltungen (Events) sortiert an.