Google Maps integreren in Sitebuilder website
Google Maps integreren in Sitebuilder website
Een interactieve kaart op je website helpt bezoekers je locatie te vinden en wekt vertrouwen. Met Google Maps integratie in Sitebuilder toon je eenvoudig je adres, routebeschrijving en openingstijden op een professionele manier.
Waarom Google Maps toevoegen
Een kaart op je website biedt veel voordelen:
- Bezoekers vinden makkelijker de weg naar je locatie
- Het versterkt de lokale vindbaarheid in Google
- Professionele uitstraling voor bedrijven met fysieke locatie
- Klanten kunnen direct een route plannen
- Meerdere locaties tonen op een kaart (handig voor ketens)
Kaart toevoegen aan je website
Stap 1: Kaartblok plaatsen
- Open de pagina waar je de kaart wilt tonen
- Klik op het plus-icoon om een element toe te voegen
- Zoek naar Kaart of Google Maps in de elementen
- Sleep het kaartblok naar de gewenste positie
Stap 2: Locatie instellen
- Klik op het kaartblok
- Open de Instellingen
- Vul je adres in:
- Straatnaam en huisnummer
- Postcode
- Plaatsnaam
- Klik op Zoeken om de locatie te vinden
- Controleer of de pin op de juiste plek staat
Stap 3: Kaartweergave aanpassen
Pas het uiterlijk aan je website aan:
Zoomniveau
- Kies hoe ver ingezoomd de kaart start
- Dichtbij (straatniveau) of verder weg (stadsniveau)
Kaarttype
- Wegenkaart: Standaard stratenkaart
- Satelliet: Luchtfotos
- Terrein: Hoogtelijnen en natuurelementen
- Hybride: Satelliet met straatnamen
Marker aanpassen
De standaard rode marker kun je personaliseren om op te vallen.
Aangepaste marker uploaden
- Selecteer de kaart
- Ga naar Marker instellingen
- Klik op Eigen marker uploaden
- Upload je logo of icoon (PNG aanbevolen)
- Pas de grootte aan
Marker info-venster
Voeg informatie toe die verschijnt bij klikken op de marker:
- Klik op Info-venster bewerken
- Voeg toe:
- Bedrijfsnaam
- Adres
- Telefoonnummer
- Openingstijden
- Link naar routebeschrijving
- Style het venster naar wens
Geavanceerde opties
Meerdere locaties tonen
Heb je meerdere vestigingen? Toon ze allemaal op een kaart:
- Selecteer de kaart
- Klik op Locatie toevoegen
- Vul het tweede adres in
- Herhaal voor alle locaties
- De kaart zoomt automatisch om alle pins te tonen
Routebeschrijving toevoegen
Maak het makkelijk om naar je toe te komen:
- Voeg een Route knop toe onder de kaart
- Link naar Google Maps met je adres
- Bezoekers kunnen direct navigeren vanuit hun locatie
Kaart styling
Pas kleuren aan zodat de kaart bij je website past:
- Ga naar Geavanceerde instellingen
- Selecteer een Kaartstijl:
- Standaard (kleurrijk)
- Zilver (subtiel grijs)
- Donker (voor donkere websites)
- Retro (vintage look)
- Of maak een volledig aangepaste stijl
API-sleutel instellen
Voor geavanceerde functies is een Google Maps API-sleutel nodig.
API-sleutel aanvragen
- Ga naar Google Cloud Console
- Maak een nieuw project aan
- Schakel de Maps JavaScript API in
- Maak een API-sleutel aan
- Beperk de sleutel tot je domein voor veiligheid
API-sleutel koppelen
- Ga naar Sitebuilder instellingen
- Navigeer naar Integraties
- Plak je API-sleutel bij Google Maps
- Sla op en test de kaart
Kaart op contactpagina
De meest voorkomende plek voor een kaart is de contactpagina. Zo maak je een effectieve contactpagina:
Layout suggestie
- Voeg een twee-kolom layout toe
- Plaats contactgegevens links
- Plaats de kaart rechts
- Voeg een contactformulier eronder toe
Contactgegevens naast kaart
Toon naast de kaart:
- Volledig adres
- Telefoonnummer (klikbaar op mobiel)
- E-mailadres
- Openingstijden
- Social media links
SEO en lokale vindbaarheid
Een kaart helpt niet alleen bezoekers, maar ook je positie in lokale zoekresultaten.
LocalBusiness schema
Voeg gestructureerde data toe:
- Ga naar SEO instellingen
- Schakel LocalBusiness markup in
- Vul alle bedrijfsgegevens in
- Google begrijpt je locatie beter
Google Mijn Bedrijf
Combineer je kaart met een Google Mijn Bedrijf profiel:
- Claim je bedrijf in Google Mijn Bedrijf
- Voeg dezelfde gegevens toe als op je website
- Je verschijnt in lokale zoekresultaten en Google Maps
Mobiele optimalisatie
Controleer of je kaart goed werkt op mobiele apparaten:
Touch interactie
- Gebruikers kunnen inzoomen door te knijpen
- Scrollen op de pagina blijft werken
- Eén vinger versleept de kaart niet per ongeluk
Responsieve grootte
- Test de kaart op verschillende schermformaten
- Pas de hoogte aan voor mobiel indien nodig
- Overweeg een kleinere kaart op telefoons
Veelvoorkomende problemen
Kaart laadt niet
Controleer:
- Is je API-sleutel correct?
- Heb je de juiste APIs ingeschakeld?
- Is je domein toegestaan in de API-instellingen?
Verkeerde locatie
- Controleer het adres op typefouten
- Voeg postcode toe voor precisie
- Verplaats de pin handmatig indien nodig
Langzame laadtijd
- Laad de kaart pas als deze in beeld komt
- Gebruik een statische kaartafbeelding als alternatief
- Beperk het aantal markers
Gerelateerde artikelen
Hulp nodig?
We staan voor je klaar! Loop je ergens tegenaan of heb je vragen? Ons supportteam helpt je graag persoonlijk verder. Stuur ons een berichtje via het ticketsysteem - we reageren meestal binnen een paar uur en denken graag met je mee.
0 van 0 vonden dit nuttig