← Agendapagina met Google Calendar · klus 3 van 4
Klus 3 · ± een kwartier · eenmalig
Zet de agenda op je website
Je hebt nu een agenda-ID (klus 1) en een API-sleutel (klus 2). Die twee vul je in een kant-en-klaar script in, en dat script plak je in een nieuwe pagina “Agenda” op je website. Daarna hoef je hier nooit meer aan te komen.
Download het script en vul twee regels in
Je downloadt het bestand agenda-embed.txt naar je eigen computer en opent het daar met Kladblok (Notepad). Bovenin, in het blok INSTELLINGEN, vul je tussen de aanhalingstekens het agenda-ID en de sleutel in. De rest van het bestand laat je staan.
agenda-embed.txt. Het bestand komt in je map Downloads. Open het met Kladblok — rechtermuisknop op het bestand, “Openen met” → “Kladblok”. De naam of extensie maakt niets uit: je plakt straks gewoon de hele inhoud in je website.Maak een pagina “Agenda” en plak het script erin
Maak in álle gevallen eerst een eigen pagina “Agenda” aan en zet die in het menu — zo krijgt de agenda een vaste, vindbare plek met een eigen webadres. Daarna verschilt het per websitesysteem:
JouwWeb · jouwweb.nl
- Log in en maak via “Pagina’s” een nieuwe pagina “Agenda” aan
- Voeg op die pagina een “Embed Code”-element toe (bij de elementen, onder “Overig”)
- Klik “Embed aanpassen”, plak de volledige inhoud van
agenda-embed.txten sla op
Google Sites · sites.google.com
- Open je site in de editor en maak via “Pagina’s” → “+” de nieuwe pagina “Agenda” aan
- Kies Invoegen → Insluiten → tabblad “Insluitcode”
- Plak de volledige inhoud van
agenda-embed.txten klik op “Publiceren”
WordPress · inloggen via jouwdomein.nl/wp-admin
- Maak via “Pagina’s” → “Nieuwe pagina” de pagina “Agenda” aan
- Voeg een blok “Aangepaste HTML” (Custom HTML) toe en plak daarin de volledige inhoud van
agenda-embed.txt - Klik “Publiceren” en zet de pagina in het menu via “Weergave” → “Menu’s”
Liever een plugin? Installeer via “Plugins” → “Nieuwe plugin” de plugin “List View Google Calendar”, vul in de instellingen de Google Calendar API Key en het Google Calendar ID in en zet op de pagina “Agenda” een blok “Shortcode” met [gc_list_view]. Je mist dan wel de dag-groepering en de voorpagina-variant van het script.
Werkt de agenda? Zet dan de beperking van de sleutel aan (klus 2, stap 4) en controleer nog een keer. Krijg je een foutmelding, dan staat er in de melding zelf wat er meestal aan de hand is.
Extra: de eerstkomende activiteiten op je voorpagina
Wil je bezoekers meteen op de homepage laten zien wat er binnenkort te doen is? Plak hetzelfde script óók op de voorpagina en zet daar in het instellingenblok DAGEN_VOORUIT op bijvoorbeeld 7 (maximaal 14). Het script schakelt dan vanzelf over op een compacte lijst: één regel per activiteit — datum, titel, tijd. Op de agendapagina laat je DAGEN_VOORUIT op 0 staan. Eén agenda, twee weergaven, allebei werken ze zichzelf bij.
De compacte lijst voor de voorpagina, met DAGEN_VOORUIT op 14.
Wat je verder in het script kunt instellen · bovenin, bij INSTELLINGEN · niets verplicht
MAX_ITEMS— hoeveel komende activiteiten maximaal worden opgehaald (standaard 50)DAGEN_VOORUIT—0toont alles;1t/m14toont alleen die periode én schakelt over op de compacte lijst voor je voorpaginaWEERGAVE— wat er met besloten activiteiten gebeurt:1laat ze weg,2toont ze met titel,3toont alleen het woord “Besloten” met de tijd, zodat bezoekers zien dat de zaal bezet is zonder te weten waarvoorDETAIL—1toont titel, tijd en locatie;2zet daar de omschrijving onderGROEPEER_PER_DAG—1toont per dag één datum met alle activiteiten van die dag eronder;0geeft elke activiteit een eigen datumblokje
Een activiteit geldt als besloten wanneer je hem in Google op Privé hebt gezet, of wanneer de titel begint met “Besloten” of “Privé”.
WEERGAVE 2 of 3 verschijnt die dus altijd als “Besloten”. Wil je de titel wél kunnen tonen, laat de afspraak dan openbaar staan en zet “Besloten” vooraan in de titel.