# Web: Veranstaltungskalender einbinden

Quelle: https://musikschulverwaltung.de/wiki/web/veranstaltungen/ · Stand: 03.09.2026

---

Mit der Musikschul-App können Sie Veranstaltungen direkt aus iMikel ankündigen. Über folgenden Code können Sie diese Daten ebenfalls direkt auf Ihrer Internetseite einbinden.

## Quellcode

Als Beispiel verwenden wir hier die Daten der App [MKS Böblingen](https://musikschule.boeblingen.de/start/_digitalespielraeume/mks+app.html). Tauschen Sie hierbei den Alias beim Attribut "alias" durch den Ihrer App aus und wählen Sie Ihre Farbe beim Attribut "accent-color".

```html
<script
  type="module"
  src="https://cdn.musikschulverwaltung.de/events/latest/main.js"
></script>
<events-posts alias="boeblingen" accent-color="#f39200" />
```

### Parameter für `<events-posts>`

- **`alias`** (Pflicht): Eindeutige Kennung Ihrer Musikschul-App.
  - Beispiel: `alias="demo"`
- **`accent-color`**: Akzentfarbe der Komponente.
  - Beispiel: `accent-color="#f39200"`
- **`darkmode`**: Steuert, ob die Komponente hell oder dunkel erscheint.
  - `darkmode="auto"`: folgt der Systemeinstellung
  - `darkmode="true"`: immer dunkel
  - `darkmode="false"`: immer hell
  - Hinweis: Ohne den Parameter folgt die Komponente der Systemeinstellung, sofern die einbettende Seite `<meta name="color-scheme" content="light dark">` erklärt - sonst bleibt sie hell.

## Vorschau

<div class="embedded">
  <script type="module" src="https://cdn.musikschulverwaltung.de/events/latest/main.js"></script>
  <events-posts alias="boeblingen" accent-color="#f39200" style="font-size: 14px;"/>
</div>
