Hoe plaats ik een Google Maps-kaart of andere code?

Wat heb je nodig?

• De embedcode: een stukje code dat begint met <iframe. Die krijg je bij de dienst zelf, zoals Google Maps of je boekingssysteem.
• Een kolom op je pagina waar de kaart of widget moet komen, bijvoorbeeld op je contactpagina naast je adres.

Stap 1: Kopieer de code bij Google Maps

1. Ga naar Google Maps en zoek je bedrijf of adres.
2. Klik op Delen.
3. Kies het tabblad Kaart insluiten.
4. Kies eventueel een formaat en klik op HTML kopiëren.

De namen van de knoppen bij Google kunnen af en toe veranderen. Zoek dan naar ‘insluiten’ of ‘embed’.

Stap 2: Voeg het blok Code toe

Klik in de kolom op de + (Blok toevoegen), typ ‘code’ en kies Code. Het bewerkvenster gaat open met één groot tekstvak: Code.

Stap 3: Plak de code

Klik in het vak Code en plak de code (Ctrl+V). Verander er niets aan. Klik op Klaar en daarna rechtsboven op Opslaan. Bekijk de pagina op de website: de kaart staat nu in de kolom.

Andere embeds: boekingswidget, formulier, social post

Op dezelfde manier plaats je andere code om in te sluiten, zoals een boekingswidget, een agenda, een formulier van een andere dienst of een bericht van social media. Zoek bij die dienst naar ‘insluiten’, ‘embed’ of ‘code voor je website’, kopieer de code en plak hem in het blok Code.

Voor een video van YouTube of Vimeo heb je dit blok niet nodig. Daarvoor is het blok Video. Zie een video plaatsen van YouTube of Vimeo. Een formulier van je eigen website plaats je ook op een andere manier; zie een formulier op een pagina plaatsen.

Let op: snelheid, privacy en cookies

• Snelheid. Elke embed laadt iets van een andere website. Ingesloten kaarten en andere iframes laden pas als de bezoeker in de buurt scrolt, maar zet er toch niet te veel op één pagina. Zie ook waarom je website traag is.
• Privacy en cookies. Een kaart, video of widget van een andere partij kan cookies plaatsen of gegevens van je bezoeker doorsturen. Vermeld dat in je cookie- en privacybeleid. Twijfel je? Overleg met ons.
• Veiligheid. Code in dit blok wordt zonder controle op je pagina gezet. Plak alleen code van bronnen die je vertrouwt.

Code die niet werkt

Niet elke code werkt in dit blok. Een gewone iframe, zoals die van Google Maps, gaat bijna altijd goed. Code met een script erin kan stuk gaan, omdat WordPress bepaalde tekens omzet. Werkt een widget niet, stuur ons dan de code. Dan kijken we hoe we hem goed op je site krijgen.

Lukt het niet?

• Je ziet de code als tekst op de pagina. Je hebt hem in een blok Tekst geplakt. Gebruik het blok Code.
• De kaart blijft leeg of grijs. Kopieer de code opnieuw bij Google Maps en plak hem in zijn geheel, van <iframe tot en met </iframe>.
• De kaart is te hoog of te laag. Kies bij Google een ander formaat, of pas het getal achter height= in de code aan.
• De kaart toont het verkeerde adres. Zoek in Google Maps eerst je bedrijf op en kopieer daarna pas de code.
• Een widget met een script doet niets. Neem contact met ons op.

Je adres zelf pas je aan bij de bedrijfsgegevens; zie je adres op de hele site wijzigen. Andere blokken vind je in alle blokken op een rij.

Veelgestelde vragen