Du möchtest unterschiedliche Ansichten des Kursplans auf deiner Webseite integrieren? Beispielsweise für jeden deiner Orte eine "gefilterte" Ansicht?
Dann ist diese Anleitung die richtige für dich.
Du hast die Möglichkeit alle verfügbaren Filter auch als direkte "gefilterte" Ansicht deines Kursplans zu nutzen.
Aktuell bieten wir dir die folgenden Filter für den Kursplan an:
Termintypen (Klassen, Termine, Sonderveranstaltungen)
Orte
Trainer
Veranstaltungsseite
Wähle die gefilterte Ansicht, die du integrieren möchtest
Klicke auf Einstellungen > Online-Kurskalender > Teile deinen Kalender.
Kopiere den ersten angezeigten Link und öffne diesen in einem neuen Tab
Auf der rechten Seite siehst du nun bereits alle deine verfügbaren Filter.
Wähle den Filter aus, für den du eine gesonderte Ansicht des Kursplans erstellen möchtestDu hast auch die Möglichkeit, die Listenansicht für unregelmäßige Veranstaltungen auszuwählen, sofern du diese aktiviert hast.
Kopiere die URL die du oben in der Browserleiste siehst
Anpassung des Codes
Gehe zurück zu FitogramPro und klicke auf Einstellungen > Online-Kurskalender > Teile deinen Kalender.
Unter Integration wähle "Auf Website einbetten" > iFrame
Kopiere den Code.
Ersetze im Code nun https://widget.fitogram.pro/your_domain mit der URL, die du gerade eben kopiert hattest.
⚠️ Beachte, dass der Teil "&fito-embedded=true" Teil der URL bleiben muss
Den gesamten, angepassten Code kannst du nun an der gewünschten Stelle auf deiner Webseite integrieren.
Beispiel:
Das ist der standardmäßige iFrame Code:
<!-- Fitogram Booking Tool starts here -->
<iframe
frameborder="0"
scrolling="yes"
src="https://widget.fitogram.pro/my_domain/?fito-embedded=true&w=/list-view"
width="100%"
height="800px">
</iframe>
<!-- Fitogram Booking Tool ends here -->
Ich möchte gerne nur Events des Types "Termin" anzeigen. Hier die gefilterte URL:
https://widget.fitogram.pro/my_domain/?f=type/Appointment&w=/list-view
Der iFrame Code zur gefilterten Ansicht sieht dann dementsprechend so aus:
<!-- Fitogram Booking Tool starts here -->
<iframe
frameborder="0"
scrolling="yes"
src="https://widget.fitogram.pro/my_domain/?f=type/Appointment&w=/list-view"
width="100%"
height="800px">
</iframe>
<!-- Fitogram Booking Tool ends here -->
#Kalender verlinken #Buchungskalender verlinken #Kurskalender auf der Website anzeigen