Añadir un mapa avanzado

El componente Advanced map muestra un mapa de Google y acepta elementos hijos Map marker, Routey Dynamic Route / Pointers . Para el editor de bloques nativo, consulta Build a map with markers and routes.

Configurar Google Maps

Necesitas un proyecto de Google Cloud, las APIs de Maps necesarias y una clave de navegador.

1. En Google Cloud Console, activa Maps JavaScript API.
2. Activa Places API cuando la búsqueda por dirección, el autocompletado o las funciones de proximidad lo necesiten.
3. Crea una clave de API de navegador.
4. Restringe la clave a los remitentes HTTP de producción y de staging aprobados.
5. Restríngela solo a las APIs de Maps necesarias.
6. En WordPress, abre Settings → POM Theme → Integrations → Google Maps.
7. Pega la clave en Google Maps y guarda.

No uses una clave de producción sin restricciones. Google gestiona su propia facturación, cuota y disponibilidad del servicio.

Añadir el mapa

1. Edita una página con Page Builder.
2. Añade Advanced map dentro de una columna.
3. Introduce Map height con un número y una unidad, como 300px o 50vh.
4. Elige Default map center:
   • Calculate usa el centro de los límites de marcadores resueltos;
   • Custom muestra la latitud y la longitud predeterminadas.
5. Elige Zoom level on page load o Based on markers (fit them all).
6. Configura los controles opcionales de zoom, tipo de mapa, vista de calle y pantalla completa.
7. Guarda el componente.

Añadir un marcador

Dentro de Advanced map, añade Map marker y completa:

• Title;
• Latitude y Longitude;
• opcional Address búsqueda;
• opcional Marker image;
• opcional Info box content, que se muestra cuando el visitante selecciona el marcador.

Las coordenadas válidas son la fuente fiable para la ubicación; la búsqueda por dirección ayuda a completar una ubicación, pero no sustituye la verificación.

Añadir una ruta

Usa Route para definir un conjunto ordenado de marcadores y elige Driving, Walking, Bicyclingo Transit. Usa Dynamic Route / Pointers solo cuando las ubicaciones procedan de la entrada actual, de otra entrada configurada o de una consulta guardada.

Estilo y verificación

El grupo Map styles acepta un nombre de estilo personalizado y un estilo de mapa JSON válido. Después de guardar:

1. actualiza la página;
2. abre la URL pública sin iniciar sesión;
3. comprueba los marcadores, las cajas de información, la ruta, el zoom y los controles;
4. repítelo en un área de visualización estrecha;
5. confirma que la clave de navegador acepta el nombre de host de producción.

POM solicita la API compartida de Google Maps de forma asíncrona solo cuando una función de frontend compatible la necesita y hay una clave configurada.

Las coordenadas aceptan el punto y la coma como separadores decimales. Las ubicaciones solo por dirección usan Geocoding; las rutas usan el servicio Directions existente. Confirma el acceso del proveedor, las restricciones de la clave, la facturación y la gestión del consentimiento antes del uso público. Un mapa procesa como máximo 200 puntos y realiza como máximo 20 solicitudes de direcciones. Las consultas dinámicas seleccionan como máximo 50 entradas publicadas y accesibles. Transit usa pares consecutivos; otras rutas largas se dividen en 25 puntos de paso intermedios. La vista previa de WordPress permanece pasiva.

Para facetas de mapa o proximidad, continúa con Maps and proximity search.