Vraag

Hoe kan ik een google maps pagina insluiten op mijn pagina?

  • 11 mei 2021
  • 1 reactie
  • 36 Bekeken

Ik kan helaas niet vinden hoe ik iets kan embedden op mijn pagina. Is dat mogelijk?


1 reactie

Reputatie 7
Badge +16

Hi,

Mijn collega's bij Support hebben een manier gevonden om dit voor elkaar te krijgen. Je moet hier gebruik maken van Google Tag Manager. Hieronder de uitleg :point_down:

Google maps:

  • Ga naar Google maps

  • Voeg locatie naar keuze in

  • Klik op rood omcirkelde:

 f0wLoYT-nbV7lDmvhrtQdBqr2cZL5loQ6j6FClfysn8_YBy6L519YXahNm7BrG8Jhw19Gr2gMpAhy6JwlFY2UxwJ_jWgEG6_6_Y7IKWbHH7rKzR8W1uU31dvlS7hgxFtNNfIes1q

 

  • Er verschijnt een dropdown menu, klik vervolgens op ‘Kaart delen of insluiten’.

  • Er verschijnt een nieuw scherm, klik op ‘Een kaart insluiten’ en dan op ‘HTML kopiëren’.

mGv0wOu0pvLbqwTolq_xeyWBSO9yqwxr3SBSV3XgbSz6P_fI8Qjn4mAwKFAuvn_HMWooKgbGSJSeV2QinrSgVQ-Q4-4CL9KmYObyE8h1ch2IvLRETaPQsXyuvDa8x5CNh2s_EDr8

 

  • Plak deze HTML code op de locatie van de groene tekst:

 

<script>

 var iframe = 'HIER PLAATS JE GOOGLE MAPS CODE';

 var elements = document.getElementsByTagName("p");

 [].forEach.call(elements, function (element) {

   if (element.textContent === "[google-maps]") {

     var iframeDiv = document.createElement("div");

     iframeDiv.innerHTML = iframe;

     element.parentNode.replaceChild(iframeDiv, element);

   }

 });

</script>

 

  • Ga naar Google Tag manager.

  • Maak een nieuwe Tag aan en kies daarbij voor ‘Aangepaste HTML’

  • Plak hier de HTML in.

  • Voeg een trigger toe en klik op ‘All pages’.

  • Klik op opslaan > Publiceren.

  • Voeg vervolgens [google-maps] toe aan de locatie waar Google maps mag verschijnen. ‘[google-maps]’ voeg je toe zonder opmaak en hoofdletters!! 

  • Voorbeeld hoe het eruit ziet in mijn Footer: 

jE4DJQoa9YmGLJE24d0M8SMa-TeTaA38y5SyAzQgEDYpQTYfwrs1_5jYzaVMuxcKyawvwHr0HB01aBonGA1WLqkt2wpCWK5BYx3zYJ1JfUTPs0OnTspu2eLWL8RB3LU0NpRHCsYm

  • Sla de wijzigingen op in je beheeromgeving.

  • Bezoek je website in een incognito venster.

 

Is de Map te groot? Je kunt de afmetingen aanpassen door de groene waarden te wijzigen:

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2469.212439545707!2d5.52490801597873!3d51.76572339960326!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c6fc5f69a3a123%3A0x4c20fdf1a7d56f9c!2sMyOnlineStore%20B.V.!5e0!3m2!1snl!2snl!4v1619185246319!5m2!1snl!2snl" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>

Reageer