Soms kan het handig zijn om met Google Maps aan te geven waar je bedrijf zich precies bevindt. Ondanks alle navigatie mogelijkheden kijken mensen ook nog even graag in Google Maps waar het precies zit.

Tegenwoordig is Google Maps eenvoudig te integreren met de iframe van Google Maps zelf of via een plugin. We zullen beide mogelijkheden bespreken in dit artikel zodat je zelf een keuze kunt maken welke optie voor jou het beste en makkelijkste is.

Google Maps HTML code

De eerste optie die we stap voor stap zullen uitleggen is degene waar je een zogenoemde <iframe> kunt gebruiken van de maps.google.nl website zelf.

1) Ga naar maps.google.nl

2) Voer de locatie in welke je wilt tonen in Google Maps

3) Klik op het kleine ketting icoontje

4) Je krijgt dan een URL te zien en een HTML code. Selecteer de HTML code en kopieer deze (CTRL+C)

5) Ga naar de admin omgeving (CMS) van je WordPress website

6) Ga naar het menu [Weergave] – [Widgets]

7) Sleep de widget “Text” in de gewenste sidebar

8) Plak de HTML code (CTRL+V) in het tekstgebied. Pas de width (breedte) en height (hoogte) aan. Gangbare maten zijn bijvoorbeeld width: 290 bij height: 250. Klik daarna op de knop [Save].

9) Google Map staat nu in je sidebar. We hebben het nu laten zien hoe je het in een widget plakt, maar op dezelfde manier kan je dit ook gebruiken in een bericht of pagina.

Google Maps plugin

De tweede optie die we stap voor stap zullen uitleggen is een plugin genaamd “Pronamic Google Maps”. Deze plugin geeft je iets meer opties dan de standaard iframe code van Google maps zelf.

1) Ga naar de admin omgeving (CMS) van je WordPress website

2) Ga naar het menu [Plugins] – [Nieuwe plugin]

3) Vul “Pronamic Google Maps” in bij het zoekvak en klik op de knop [Plugins zoeken]

4) Klik op de link “Nu installeren” onder de titel Pronamic Google Maps. Bevestig met [Ok] als er nogmaals wordt gevraagd om de plugin te installeren.

5) De plugin is nu geïnstalleerd. Klik op de link “Plugin activeren” om de plugin daadwerkelijk aan te zetten.

6) Er is nu een menu [Google Maps] in je CMS systeem van WordPress bijgekomen. In dit menu kan je Google Maps activeren voor verschillende bericht types. In principe staat het default goed.

7) Ga naar het menu [Pages] – [Add new]

8) Scroll naar beneden naar het Google Maps Block.

9) Vul de velden naar wens in. Hou wel in de gaten om het vinkje te zetten achter “Actief” en vul je adres goed in (zoals het plaatje). Druk dan op de knop [Geocoderen].

10) Om de Google Map te tonen in de pagina moeten we de shortcode [google-maps width=600 height=400] toevoegen.

11) Klik op de knop [Preview] om het eindresultaat te bekijken.

Het adres vak ontbreekt helaas als je deze plugin wilt gebruiken als widget. Dan zal je eerst moeten kijken wat lengte en breedte maat is voordat het adres kunt aanduiden. Dat is erg jammer van de plugin.

Succes!