10 Dic

Insertar un mapa de Google Maps en nuestra web.

En este post les vamos a explicar de manera sencilla cómo incorporar un mapa de Google Maps en vuestro sitio web en pocos pasos:

1.- Nos dirigimos a google maps y buscamos la dirección que queremos que aparezca en el mapa. Por ejemplo: Plaza Cibeles Madrid.
cibeles busqueda

 

 

 

 

 

 

 

 

 

 

 

 

 

2.- Elegimos la clase de mapa que queremos que salga en el sitio web:

– Mapa.
– Satélite.

3.- En la parte derecha inferior del navegador, encontramos diferentes opciones que nos ofrece Google Maps. Hacemos clic en la rueda dentada y elegimos la primera opción del desplegable que aparece: “Compartir o insertar el mapa”.

opciones

 

 

 

 

 

 

 

 

 

 

 

 

4.- Nos aparecerá un cuadro con dos opciones: “Compartir enlace” e “Insertar mapa”. Elegimos “Insertar mapa”.

insertar mapa

 

 

 

 

 

 

5.- Ahora podemos ver que nos sale un código html en la parte superior, que es el que copiaremos e introduciremos en nuestra web en el lugar donde queramos que vaya, pero antes, podemos Google nos da a elegir el tamaño a integrar el mapa.

– Pequeño.
– Mediano.
– Grande.
– Tamaño personalizado.

Según el que elijamos, se redimensiona el mapa para tener una vista previa del tamaño que sería. Además en el tamaño personalizado, podemos introducir los píxeles de ancho y alto, ajuntándolo a nuestras necesidades.

tamaño mapa

 

 

 

 

 

 

 

 

 

 

 

 

 

6.- Por último, copiamos el código html (iframe) que nos proporciona Google, y lo pegamos en el código fuente de la página de nuestra web, dentro de las etiquetas “body”, en el lugar que asignemos para él.

Ahora ya podremos disfrutar de nuestra página con un mapa interactivo de la posición que queremos.

Espero que le haya sido de utilidad este post, y no olviden de compartir el contenido si les fue de utilidad.