Sie haben die Möglichkeit die Events dieses Repair Cafés auf Ihrer Webseite einzubinden.
Dazu genügt es das folgende Snippet an der Stelle in Ihrer Webseite einzufügen, an welcher die Events angezeigt werden sollen.
<iframe src="https://repair-cafe.ch/de/cafes/osons-changer/embed" id="repairCafe" width="100%" height="400" frameborder="0"></iframe>
Aufbau der URL
https://repair-cafe.ch/:language/cafes/:cafe_slug/embed
Wahl der Sprache
Die Sprache kann durch den URL-Parameter :language gewählt werden. Folgende Sprachen stehen zur Auswahl: de, fr, it.
Wahl des Repair Cafés
Durch das Ändern des URL-Parameters :cafe_slug wird das Repair Café gewählt, von dem die Events angezeigt werden sollen.
Der :cafe_slug kann aus der jeweiligen URL der Café-Detailseite entnommen werden.
Optionen
Anzahl Events pro Seite
Standardmässig werden 300 Events pro Seite angezeigt. Um die Anzahl zu ändern kann ein GET-Parameter events_per_page zur URL hinzugefügt werden.
Beispiel:
https://repair-cafe.ch/de/cafes/osons-changer/embed?events_per_page=5
iFrame Resizer (optional)
Im iFrame wird bereits das iFrame Resizer-Skript in der Version 3.6.6 geladen.
Damit ist es möglich, dass das iFrame automatisch auf die Grösse des Inhalts angepasst wird.
So können unschöne Scrollbalken auf Ihrer Webseite vermieden werden.
Alles was Sie dafür tun müssen, ist das iframeResizer.min.js Skript auf Ihrer Seite einzubinden und es für das eingebundene iFrame folgendermassen zu initialisieren:
<script>
iFrameResize({
checkOrigin: ['https://repair-cafe.ch']
}, '#repairCafe');
</script>
Bei Verwendung des iFrame Resizers sollte auf dem iFrame zusätzlich das Attribut scrolling="no" gesetzt werden. In diesem Falle kann folgendes Beispiel verwendet werden:
<iframe src="https://repair-cafe.ch/de/cafes/osons-changer/embed" id="repairCafe" width="100%" height="400" frameborder="0" scrolling="no"></iframe>
Alles Weitere über die Einbindung des iFrame Resizer-Skripts können Sie direkt aus der offiziellen Dokumentation entnehmen: https://github.com/davidjbradshaw/iframe-resizer.
