Widget de mapa

Muestre a sus visitantes el mapa de cualquier ubicación que desee. Use el widget para mostrar la ubicación física de su negocio o de un evento especial. También puede usarlo para mostrar a los clientes dónde encontrarán estacionamiento.

Para agregar el widget Mapa:

  1. En el panel izquierdo, haga clic en Widgets.
  2. Haga clic y arrastre el widget Mapa a su sitio.

Para obtener más información sobre cómo agregar widgets a su sitio, consulte Agregar widgets.

Editor de contenido

Para acceder al editor de contenido:

  1. Haga clic con el botón derecho en el widget y haga clic en Editar contenido.
  2. Escriba su dirección comercial en el campo proporcionado.
  3. Seleccione la dirección en la lista desplegable que aparece. Si su dirección no aparece en la lista desplegable, significa que no podemos encontrarla en el API de MapBox (a veces es diferente de su búsqueda de mapas). Para solucionar este problema, trate de establecer un enlace de un widget de botón directamente al URL del mapa en Google Maps como alternativa. Si su dirección no aparece en MapBox, puede enviar una solicitud directamente a MapBox para agregarla.
  4. Es posible que quiera mostrar un botón de mapa en lugar de una imagen de mapa. Para mostrar un botón de mapa en dispositivos específicos, seleccione Usar botón en dispositivos () donde desea que aparezca el botón. Si no se elige ningún dispositivo, se mostrará la imagen de mapa.
  5. Escriba el texto que desea que aparezca en el botón en el campo Texto en el botón proporcionado.

Mostrar elemento emergente con información de la ubicación

Para mostrar un elemento emergente de información de ubicación en el widget de mapa:

Escriba un título y una descripción para el elemento emergente.

Seleccione para mostrar la ventana emergente Al mantener cursor sobre , Al hacer clic o Siempre en el menú desplegable de elementos emergentes.

Editor de diseño

Para acceder al editor de diseño, haga clic con el botón derecho en el widget y haga clic en Editar diseño.

Haga clic en la pestaña Diseño para editar el diseño del mapa que aparece en su sitio.

Para obtener información sobre las opciones de diseño que no son específicas de este widget (por ejemplo, diseño, estilo o espaciado), consulte Diseño de widgets.

Incruste un mapa de Google usando un widget de HTML

Para incrustar mapas de Google Maps con el widget de HTML:

  1. Navegue a Google Maps.
  2. Busque la ubicación que desee.
  3. Haga clic en el menú situado en la esquina superior izquierda, luego haga clic en Compartir o incrustar mapa.
  4. Haga clic en la pestaña Incrustar mapa.
  5. Copie el URL entre las comillas que van luego de <iframe src =". Asegúrese de copiar el URL completo anidado entre las comillas.

  6. Navegue a su sitio y, en el panel izquierdo, haga clic en Widgets, y arrastre el widget HTML a una fila o columna.
  7. Utilice el siguiente código de incrustación y agregue el URL que obtuvo de Google Maps entre las comillas que van después de iframe src =:

    <div class="embed-container"><iframe src=" " frameborder="0" allowfullscreen></iframe></div>

  8. Vaya al Modo de desarrollador.
  9. Haga clic en HTML/CSS del sitio y luego haga clic en site.css.
  10. Incruste el siguiente CSS en esta sección:

    .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

    El tamaño del mapa cambiará de tamaño según corresponda para adaptarse a las vistas en los distintos dispositivos. Si usa el código de incrustación normal de Google Maps, el tamaño del widget de mapa aparecerá estático en todos los dispositivos y se cortará en la vista de dispositivos móviles.