Google agenda toevoegen aan je WordPress site

Google agenda is een super handige agenda om afspraken en evenementen in weer te geven.

Daarnaast is Google agenda ook prima te bereiken op alle mobiele apparaten, zodat je altijd bij je agenda kunt komen om iets te wijzigen.

Wanneer je een website hebt wil je misschien een evenementenagenda plaatsen of wellicht wil je dat mensen je afspraken of beschikbaarheid kunnen bekijken.

In dit artikel laat ik je daarom zien hoe je een Google agenda kunt toevoegen aan je WordPress website.

Het doel is dus simpel gezegd om een agenda zoals je hieronder ziet op je website te krijgen.

Google Agenda

Hoe je een Google agenda in WordPress kunt plaatsen

Google agenda heeft standaard al de mogelijkheid om een agenda in te sluiten op een website door middel van een iframe.

Het is dus helemaal niet zo moeilijk om een Google agenda op je website te krijgen. Het is simpel gezegd een kwestie van de code opzoeken en deze in een bericht of pagina te plaatsen.

Insluitcode ophalen van je Google agenda

Om dit hele proces te beginnen moet je als eerste naar je Google agenda gaan.

Eenmaal op de website van Google agenda zie je aan de linkerkant alle agenda’s staan die je hebt aangemaakt. Klik op het pijltje naar beneden in de agenda die je graag wilt insluiten op je website en klik vervolgens op “Agenda-instellingen”.

Google agenda instellingen

Je komt nu uit op de pagina “Agendagegevens”. Je hebt op deze pagina een kopje “Deze agenda insluiten” staan, met daarnaast een insluitcode die je op je website kunt plakken met de standaard instellingen.

Google agenda insluitcode

Kopieer deze code als je gebruik wilt maken van de standaard instellingen of klik als je nog dingen wilt wijzigen op “Pas de kleur, de grootte en andere opties aan”.

Google agenda instellingen insluitcode

Zoals je ziet hierboven heb je de mogelijkheid om dingen aan te passen zoals de naam van de agenda, de kleur, de breedte en hoogte, welke agenda’s worden weergegeven, en nog een aantal andere dingen.

Wanneer je instellingen aanpast zal de agenda aan de rechterkant zich direct aanpassen aan de hand van wat je hebt ingesteld. Het is dus een preview van wat je op de website ook te zien krijgt.

Eenmaal alles naar wens ingesteld kun je de insluitcode kopiëren en vervolgens naar je website gaan.

Insluitcode Google agenda op je WordPress site plaatsen

Ga op je website naar een bericht of pagina waar je de Google agenda aan toe wilt voegen. In de WordPress editor moet je erop letten dat je in de teksteditor zit en niet in de visuele editor.

Wanneer je in de visuele editor zit zal de code namelijk gewoon als platte tekst worden weergegeven op je website en het is natuurlijk de bedoeling dat de code zijn werk doet en er een Google agenda wordt weergegeven.

Wanneer je er zeker van bent dat je in de teksteditor zit kun je de insluitcode plakken en het werk zit erop.

Google agenda insluiten in WordPress

Werk je pagina bij, klik op publiceren of bekijk een voorbeeld van de pagina om de Google agenda op je website te zien staan.

Google agenda voor WordPress

Meer werk als dit is het niet om een Google agenda toe te voegen aan je WordPress website.

Maak jij gebruik van een Google agenda op je website? Om welke redenen heb je dit gedaan of waarom wil je dit doen? Laat het gerust weten in de reacties.

17 reacties Voeg ook een reactie toe

  1. Hoi Maikel,

    Ik vraag me af is het ook mogelijk om de agenda die ik in WordPress heb gebouwd op mijn website, om deze afspraken terug te laten komen in mijn google agenda?

    Vr gr Carla

  2. Hoi Maikel, ik heb de agenda op mijn website staan en wil getoonde afspraken weergeven in 2 kleuren, rood en groen. In mijn agenda gaat dat goed, in het getoonde iframe toont ie ze alleen in de standaard ingestelde kleur. Weet jij of het mogelijk is dat ie de voor de afspraak ingestelde kleur overneemt in het iframe? bedankt alvast! Groeten, Hette

  3. Hoi Maikel,

    Weet jij of deze plugin ook geschikt is om het mooi vorm te geven. dus per dag. Ik heb een prinstscreen maar die kan ik niet toevoegen. Het is voor een klant.

  4. Hoi Maikel,
    De agenda wordt bij mij weergegeven op mn laptop, maar niet op mijn ipad of iphone. Weet jij wat ik fout heb gedaan? Dank! Nienke

    • Hmm goede vraag, ik heb het even getest of het toevallig niet altijd zo is momenteel, maar dit is niet het geval. Waarschijnlijk zal het een instelling zijn ergens, ik weet helaas niet 1, 2, 3 welke. Ik krijg op de website verder ook een melding te zien dat niet alle afspraken getoond kunnen worden, omdat ik de rechten daarvoor niet heb.

      • Hoi Maikel, dank voor je reactie. Ik heb het nog niet op kunnen lossen. Misschien toch een andere agenda proberen. Dank je wel! Ik ben super blij met de hulp via je website. Groet, Nienke

  5. Bedankt voor duidelijk handleiding.
    Het werkt prima op iPad en iPhone maar helaas is agenda niet zichtbaar op monitor van desktop.
    Andere browsers geprobeerd maar helaas.
    Ik zie enkel een rechthoekig vlak zonder dagen, weken, enz.
    Nog geen enkel idee wat daarvan de oorzaak kan zijn.
    Heb jij enig idee?

  6. Hoi Maikel, ik heb het nog niet gedaan, maar het lijkt eenvoudig. Ik heb een praktijk en zou mijn zakelijke agenda op mijn website willen zetten. Kunnen klanten dan zelf een afspraak invullen? En kan ik dat dan op al mijn aparaten zien in mijn google agenda? En kan ik er een soort van e-mail systeem aanhangen dat ze een bevestiging krijgen van hun afspraak? Ik hoor het graag. M.v.g. Merel Slotboom http://www.movimento.nl

  7. Onwijs fijn artikel Maikel, precies wat ik zocht. Ik zoek voor mijn site al geruime tijd een manier om mijn volgers op de hoogte te brengen van evenementen, zonder dat ik er elke keer een artikel over hoef te schrijven. Daarnaast is het ook handig dat ik i.v.m. de reisjes die ik maak niet teveel tijd kwijt ben, dus dit is ideaal! Groetjes, Nina

Geef een reactie