Kurse und Anmeldung auf der eigenen Website

Kursprogramm aus vynst auf der Website zeigen und Anmeldungen direkt dort annehmen, mit WordPress, auf jeder anderen Seite oder über die API.

Euer Kursprogramm pflegt ihr in vynst (inwendo ERP). Auf der Website soll es aktuell sein, und Interessierte sollen sich gleich dort anmelden. Dafür gibt es drei Wege, je nachdem, womit eure Website gebaut ist.

Mit WordPress

1. vynst Sync einrichten und im Tab Events den Import aktivieren. Jeder öffentliche Kurs wird ein Beitrag, mit Kategorien und Schlagwörtern aus vynst.
2. Die Kursübersicht baut euer Theme wie jede andere Beitragsliste, etwa als Archiv /vynst-events/ oder mit einem Listen-Baustein eures Page-Builders.
3. Im Template der Einzelseite das Anmelde-Widget mit der ID aus vynst ausgeben:

<?php $erpId = get_post_meta(get_the_ID(), 'erp_id', true); ?>
<div data-iw-event-signup
     data-iw-host="verein.iw-erp.de"
     data-iw-event-id="<?php echo esc_attr($erpId); ?>"></div>
<script src="https://verein.iw-erp.de/frontend_assets/backend/iw_erp_web_ui/event-signup.js" async></script>

4. Webhooks für Veranstaltungen anlegen, damit neue Kurse und Änderungen sofort auf der Website stehen. Wie das geht, steht bei vynst Sync.

Freie Plätze, Anmeldezeitraum und Preise prüft das Widget bei jedem Aufruf direkt in vynst. Sie sind also immer aktuell, auch wenn der Beitrag älter ist.

Auf jeder anderen Website

Für einzelne Kurse setzt ihr das Anmelde-Widget auf die Seite des Kurses. Die ID steht in vynst an der Veranstaltung, statt der ID geht auch ihr Kurzname:

<div data-iw-event-signup data-iw-host="verein.iw-erp.de" data-iw-event-id="yoga-am-morgen"></div>
<script src="https://verein.iw-erp.de/frontend_assets/backend/iw_erp_web_ui/event-signup.js" async></script>

Erlaubt euer Baukasten kein HTML, nehmt den Shortcode [iw-event-signup host="verein.iw-erp.de" event-id="yoga-am-morgen"]. Einrichtung und Gestaltung: JavaScript-Widgets einbinden.

Mit der API

Die Liste der öffentlichen Veranstaltungen gibt die API ohne Anmeldung heraus:

curl 'https://verein.iw-erp.de/api/event/base_event?pageSize=20&page=1&withMaxPageNumber=1&orderFieldName=name&orderFieldSort=ASC' \
  --header 'x-iw-convert-to-camel-case: 1'

• searchString ist eine Freitextsuche, eventType, baseLocation und ageGroup filtern nach Art, Ort und Altersgruppe.
• Mit withMaxPageNumber=1 stehen Anzahl Seiten und Treffer in den Headern X-IW-MAX-PAGES und X-IW-MAX-RESULTS.
• Einen einzelnen Kurs mit allen öffentlichen Angaben liefert GET /api/event/base_event/{id}.

Zum Anmelden schickt ihr die Angaben erst an POST /api/event/public/test_base_event_signup. vynst prüft die Anmeldung, ohne sie zu speichern. Passt alles, legt POST /api/event/public/base_event_signup die Anmeldung an. Kostet der Kurs etwas, enthält die Antwort directBillingToken, und https://verein.iw-erp.de/api/payment/redirect/{directBillingToken} führt zur Bezahlung. Alle Felder stehen in der API-Referenz zu Veranstaltungen.

Ruft ihr die API aus dem Browser auf, tragt eure Website in CORS - HTTP Origins ein.