Embed a single event or a list of events in your webpage
You can embed a list of filtered events or a specific event card in your webpage using a classic old-school iframe
or a shiny new webcomponent.
Webcomponents
Webcomponents usage requires a small (~5kB gzipped) js script to be loaded in your page (note that you should use your instance name):
<script src='https://demo.gancio.org/gancio-events.es.js'></script>
Embed a single event
To embed an event in webpages you use <gancio-event>
custom element, you can copy the required code in event’s page > Embed > Copy, should be like the following:
<gancio-event id=17 baseurl='https://demo.gancio.org'></gancio-event>
Embed event lists
You can also embed a list of events using <gancio-events>
custom element, you can copy the required code in Export > List > Copy
<gancio-events baseurl='https://gancio.cisti.org'>
<a href='https://gancio.cisti.org'>Gancio Events</a>
</gancio-events>
Customize
Note that you can modify the title (or completely remove it using an empty title
param), you can limit the list to a maximum number of events using the maxlength
parameter and filter events by tags
or places
using that parameters (it’s easier using gancio than to explain it here)
IFrame
You can also use the old iframe method
<iframe src='https://demo.gancio.org/embed/17' style="width: 410px; border: none; height: 210px; overflow: hidden;"></iframe>
Wordpress
To embed an event or a list of events into a WordPress website you can use the WPGancio plugin, this allows you to use webcomponents and shortcodes and automatically includes the needed script in each page and post.