Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
 
(7 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
Der Digitall-Pro Kalender kann auf externen Websiten eingebettet werden. Damit können z.B. auf der Vereinshompage die Trainingszeiten angezeigt werden, ohne das ein separater Kalendar gepflegt werden muss.
Der Digitall-Pro Kalender kann auf externen Websiten als [https://developer.mozilla.org/de/docs/Web/API/Web_components Web Komponente]  eingebettet werden. Damit können z.B. auf der Vereinshompage die Trainingszeiten angezeigt werden, ohne das ein separater Kalender gepflegt werden muss.


Nachdem die Domain der externen Website freigegeben wurde kann die Web Komponente wie folgt geladen werden:
Nachdem die Domain der externen Website freigegeben wurde, kann die Komponente wie folgt geladen werden:


<pre style="font-size: 12px">
<pre style="font-size: 12px">
Zeile 12: Zeile 12:


=== Konfiguration ===
=== Konfiguration ===
Um genauere Kontrolle über die Präsentation und den Inhalt des Kalenders zu erreichen werden die folgenden Konfigurationsoptionen angeboten:
Für genauere Kontrolle über die Präsentation und den Inhalt des Kalenders werden die folgenden Konfigurationsoptionen angeboten:


<pre style="font-size: 12px">
<pre style="font-size: 12px">
Zeile 29: Zeile 29:
starting-sport-ids
starting-sport-ids
- Mögliche Werte: '[X,X,...]'
- Mögliche Werte: '[X,X,...]'
- Legt fest welche Sportarten in dem Kalender angezeigt werden. Die IDs der einzelnen Sportarten lassen sich in der jeweiligen URL für den Sport finden.
- Legt fest, welche Sportarten in dem Kalender angezeigt werden. Die IDs der einzelnen Sportarten lassen sich in der jeweiligen URL für den Sport finden.


starting-location-ids
starting-location-ids
- Mögliche Werte: '[X,X,...]'
- Mögliche Werte: '[X,X,...]'
- Legt fest welche Orte in dem Kalender angezeigt werden. Die IDs der einzelnen Orte lassen sich in der jeweiligen URL für den Ort finden.
- Legt fest, welche Orte in dem Kalender angezeigt werden. Die IDs der einzelnen Orte lassen sich in der jeweiligen URL für den Ort finden.


starting-max-age und starting-min-age
starting-max-age und starting-min-age
- Mögliche Werte: 'X'
- Mögliche Werte: 'X'
- Legt fest für welche Altersbereiche Termine angezeigt werden.
- Legt fest, für welche Altersbereiche Termine angezeigt werden.


hide-sports-filter
hide-sports-filter
- Mögliche Werte: 'true', 'false'
- Mögliche Werte: 'true', 'false'
- Entfernt die Möglichkeit die gefilterten Sportarten zu ändern. In Kombination mit starting-sport-ids lassen sich somit also spezielle Kalender für einzelne Sportarten einbetten.
- Entfernt die Möglichkeit die gefilterten Sportarten zu ändern. In Kombination mit starting-sport-ids lassen sich somit also spezielle Kalender für einzelne Sportarten einbetten.
hide-register-link
- Mögliche Werte: 'true', 'false'
- Entfernt den Link in der Detailanzeige eines Events welcher auf die Anmeldeseite von Digitall-Pro verweist.
</pre>
</pre>

Aktuelle Version vom 21. Mai 2025, 11:11 Uhr

Der Digitall-Pro Kalender kann auf externen Websiten als Web Komponente eingebettet werden. Damit können z.B. auf der Vereinshompage die Trainingszeiten angezeigt werden, ohne das ein separater Kalender gepflegt werden muss.

Nachdem die Domain der externen Website freigegeben wurde, kann die Komponente wie folgt geladen werden:

<link href="https://verein.digitall-pro.com/digitall-pro/calendar/de/digitall-pro-calendar.css" type="text/css" rel="stylesheet">
<script src="https://verein.digitall-pro.com/digitall-pro/calendar/de/digitall-pro-calendar.js" type="module"></script>
<div style="width: 100%; height: 100%;">
    <digitall-pro-calendar club-subdomain="verein"></digitall-pro-calendar>
</div>

Konfiguration

Für genauere Kontrolle über die Präsentation und den Inhalt des Kalenders werden die folgenden Konfigurationsoptionen angeboten:

initial-view
- Mögliche Werte: 'day', 'week', 'month', 'list'
- Entscheidet den Kalendermodus (Tages-, Wochen-, Monats- und Terminansicht).

slot-duration
- Mögliche Werte: 'hh:MM'
- Ändert die Zeitspanne einer Zeile im Kalender (Ändert effektiv die Höhe des Kalenders).

slot-min-time und slot-max-time
- Mögliche Werte: 'hh:MM'
- Alle Termine vor/nach diesen Zeiten werden nicht angezeigt.

starting-sport-ids
- Mögliche Werte: '[X,X,...]'
- Legt fest, welche Sportarten in dem Kalender angezeigt werden. Die IDs der einzelnen Sportarten lassen sich in der jeweiligen URL für den Sport finden.

starting-location-ids
- Mögliche Werte: '[X,X,...]'
- Legt fest, welche Orte in dem Kalender angezeigt werden. Die IDs der einzelnen Orte lassen sich in der jeweiligen URL für den Ort finden.

starting-max-age und starting-min-age
- Mögliche Werte: 'X'
- Legt fest, für welche Altersbereiche Termine angezeigt werden.

hide-sports-filter
- Mögliche Werte: 'true', 'false'
- Entfernt die Möglichkeit die gefilterten Sportarten zu ändern. In Kombination mit starting-sport-ids lassen sich somit also spezielle Kalender für einzelne Sportarten einbetten.