Tutoriales de WordPress de Confianza, cuando más los necesitas.
Guía para Principiantes de WordPress
Copa WPB
25 Millones+
Sitios web que usan nuestros plugins
16+
Años de experiencia en WordPress
3000+
Tutoriales de WordPress de expertos

Cómo Agregar un Localizador de Tiendas de Google Maps en WordPress

Todos los días, los clientes potenciales deciden si visitar tu negocio o ir a otro lugar. A menudo, esa decisión se reduce a la conveniencia: ¿qué tan fácil es encontrarte, obtener indicaciones y confirmar si estás abierto?

Un localizador de tiendas de Google Maps bien diseñado elimina todas esas barreras.

Los clientes pueden ver tu ubicación exacta, planificar su ruta, consultar tu horario e incluso tener una idea de tu vecindario, todo sin salir de tu sitio web.

Lo recomendamos a todas las empresas que tienen una ubicación física porque cierra la brecha entre el interés en línea y las visitas en persona.

¿Listo para hacer que visitar tu negocio sea tan fácil como hacer clic en un botón? Te guiaremos a través de la creación de un localizador de tiendas profesional de Google Maps para tu sitio de WordPress.

Cómo agregar un localizador de tiendas en Google Maps en WordPress (Opción gratuita)

¿Por qué agregar un localizador de tiendas de Google Maps en WordPress?

Muchos usuarios de WordPress administran sitios web de pequeñas empresas que atienden a un pueblo o región en particular. Esto incluye negocios como restaurantes, agentes inmobiliarios, plomeros, proveedores de servicios de mantenimiento, pequeñas tiendas, salones y más.

Estas empresas locales dependen de la visibilidad en línea para atraer clientes. Además, según las estadísticas, el 53% de los usuarios de dispositivos móviles buscan indicaciones para tiendas locales en la búsqueda de Google.

Agregar un localizador de tiendas de Google Maps a tu sitio es importante para generar tráfico peatonal porque puede ayudar a las personas a encontrar tu negocio más fácilmente. Podrán obtener indicaciones para llegar a tu tienda y compartir la ubicación con sus amigos.

También puede ayudar a mejorar la visibilidad de su sitio en los motores de búsqueda y atraer a más visitantes a su sitio web.

Veamos cómo agregar un localizador de tiendas de Google Maps en su sitio de WordPress. Le mostraremos métodos gratuitos y de pago con sus pros y contras, para que pueda elegir el que mejor se adapte a sus necesidades.

Método 1: Agregar un localizador de tiendas simple a WordPress (Gratis)

Este método es gratuito y fácil, ya que no necesita pasar por el paso adicional de crear una clave de API de Google Maps. Lo recomendamos para usuarios que desean agregar rápidamente un mapa simple de la ubicación de su tienda.

Primero, necesita visitar el sitio web de Google Maps en su computadora. Luego, ingrese la dirección de su tienda en el campo de búsqueda y Google Maps la mostrará en el mapa con un marcador.

Busca la ubicación de tu tienda en Google Maps

Asegúrese de que el marcador esté colocado en la ubicación correcta. Puede seleccionar un nivel de zoom haciendo clic en los botones de zoom en la esquina inferior derecha.

Una vez que esté satisfecho con cómo se ve el mapa, haga clic en el botón 'Compartir' en la columna de la izquierda. En la ventana emergente que aparece, cambie a la pestaña 'Incrustar un mapa'.

Selecciona la opción de Google Maps de Incrustar un mapa

Ahora verá su ubicación buscada en el mapa con código HTML. Para obtener el código de incrustación, haga clic en el enlace 'Copiar HTML'.

Ahora, diríjase al área de administración de su sitio web de WordPress y edite la publicación o página donde desea mostrar el mapa del localizador de tiendas.

Normalmente, los usuarios agregan un mapa localizador de tiendas en su página de formulario de contacto con su número de teléfono comercial y horario de atención.

En la pantalla de edición de la publicación, necesitas agregar un bloque de 'HTML personalizado'.

Agregar un bloque de HTML personalizado a tu página

Debes pegar el código que copiaste de Google Maps en el área de texto del bloque 'HTML personalizado'.

Ahora puedes previsualizar la página para ver Google Maps incrustado en ella. El mapa mostrará la ubicación de tu tienda marcada, con enlaces para obtener direcciones o guardar la ubicación.

Vista previa del mapa de Google incrustado

Este método funciona para incrustar rápidamente Google Maps, pero no te brinda los máximos beneficios de SEO. En otras palabras, no te ayudará a clasificar más alto y obtener más tráfico de los motores de búsqueda o de las búsquedas en Google Maps.

Si eres una pequeña empresa, un restaurante o una tienda en línea en una o más ubicaciones físicas, te recomendamos usar la siguiente solución para mejorar tus rankings de SEO local.

Método 2: Agregar un localizador de tiendas con SEO Local (Recomendado)

Casi el 46% de todas las búsquedas en Google tienen intención local. All in One SEO (AIOSEO) es el mejor plugin de SEO para WordPress del mercado y te ayuda a atraer más tráfico gratuito de los motores de búsqueda a tu sitio web.

Lo hemos estado usando en WPBeginner para mejorar los rankings de nuestros artículos en los resultados de búsqueda y hemos tenido una gran experiencia con él. Si deseas una mirada más profunda, consulta nuestra reseña completa de AIOSEO.

También es un excelente plugin localizador de tiendas porque puedes ingresar las ubicaciones de tu tienda, detalles de contacto y horarios de atención utilizando marcado schema para que esa información se muestre en las páginas de resultados de los motores de búsqueda.

Por ejemplo, si buscas en Google 'ubicaciones de McDonald’s en Florida', muestra un fragmento destacado con una lista de destinos y un mapa con ubicaciones marcadas.

Vista previa del mapa de múltiples ubicaciones en Google

Esto ayudará a mejorar los rankings SEO de tu sitio web y aumentar tu tasa de clics en búsquedas

Nota: Necesitarás al menos el plan AIOSEO Plus para acceder a la función de SEO Local necesaria para este tutorial.

Primero, necesitas instalar y activar el plugin AIOSEO para WordPress. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Tras la activación, el plugin ejecutará un asistente de configuración. Si necesitas ayuda para configurar el plugin, por favor, consulta nuestra guía sobre cómo configurar AIOSEO para WordPress.

Asistente de configuración de AIOSEO

Una vez completado el proceso de configuración, deberás dirigirte a All in One SEO » SEO Local en tu panel de WordPress.

Haz clic en el botón ‘Activar SEO Local’ para empezar a configurar tus ajustes locales.

Activar SEO Local en AIOSEO

A continuación, necesitas hacer clic en la pestaña ‘Mapas’ en la parte superior de la página SEO Local.

En la página de Mapas, deberías ver el campo ‘Clave de API’.

Pega tu clave API de Google Maps

Puedes obtener una clave de API para Google Maps yendo a la Plataforma de Google Maps e iniciando sesión con tu cuenta de Google.

Después de eso, deberías hacer clic en el botón ‘Empezar’.

Bienvenido a Google Maps Platform

Los recursos de Google Cloud se organizan por proyecto. Si aún no tienes un proyecto, se creará uno automáticamente para ti.

Ten en cuenta que deberás habilitar la facturación para el proyecto para poder usar la API de Google Maps. Sin embargo, es poco probable que pagues algo.

Las solicitudes de incrustación de mapas son gratuitas con uso ilimitado como se detalla en la documentación de Google, y además te otorgan $200 de crédito mensual cada mes.

Necesitas hacer clic en el botón ‘Crear cuenta de facturación’.

Habilita la facturación para tu proyecto

Ahora verás la página de Información de la cuenta. Deberías seleccionar tu país en el menú desplegable y aceptar los términos de servicio.

Cuando estés listo, haz clic en el botón ‘Continuar’.

Acepta los Términos de Servicio de Google Maps

Ahora, necesitas seleccionar un perfil de pagos existente o crear uno nuevo.

El perfil será para un individuo o una empresa e incluirá el nombre del individuo o empresa, un método de pago y una dirección.

Inicia tu prueba gratuita

Una vez que haya ingresado esa información, deberá hacer clic en el botón ‘Iniciar mi prueba gratuita’.

No se preocupe por la redacción de ‘Prueba gratuita’. Las solicitudes de incrustación de mapas siguen siendo gratuitas incluso cuando la prueba gratuita ha finalizado, y su tarjeta de crédito nunca se cargará hasta que actualice manualmente a una cuenta de pago.

También se le puede pedir que complete una encuesta de 30 segundos sobre su negocio para asegurar que se le brinde la información más relevante.

Es posible que se te pida que completes una encuesta de 30 segundos

Cuando haga clic en el botón ‘Enviar’, se mostrará su clave de API de Google Maps. Deberá ingresar esta clave en la configuración del plugin para los Métodos 2 y 3.

Luego, puede hacer clic en el ícono ‘Copiar al portapapeles’ al final del campo ‘Tu clave de API’. Una vez que lo haya hecho, simplemente cierre la ventana emergente haciendo clic en el botón ‘Ir a Google Maps Platform’.

Copia tu clave API

Restringir tu clave de API de Google Maps

Recomendamos que restrinja la clave para que no pueda ser utilizada por otros.

Después de crear tu clave de API, Google mostrará una ventana emergente ‘Protege tu clave de API’ donde puedes restringir tu clave para que solo funcione en tu propio sitio web.

En el menú desplegable ‘Seleccionar tipo de restricción’, debes seleccionar ‘Referencias HTTP (sitios web)’. Luego, en el siguiente campo, debes escribir el nombre de dominio de tu sitio web en el campo ‘Nuevo elemento’ usando el patrón *ejemplo.com/*.

Protege tu clave API

Deberías ver un mensaje que dice: ‘Tu clave de API se ha restringido correctamente’. Ahora, la clave solo funcionará para Google Maps incrustado en tu sitio web específico.

De vuelta en tu sitio web, debes ingresar tu clave de API en el campo. A continuación, puedes desplazarte hacia abajo para editar la configuración del mapa.

AIOSEO te permite mostrar Google Maps usando un bloque de Gutenberg (editor de WordPress), shortcodewidget, o código PHP. También te permite elegir diferentes estilos de mapa y agregar un marcador personalizado a tu mapa.

Editar la configuración del mapa

Para este tutorial, asegúrate de que la configuración 'Bloque de Gutenberg' esté seleccionada. No olvides hacer clic en el botón 'Guardar Cambios' cuando hayas terminado.

Ahora, puedes crear tu mapa localizador de tiendas. Cómo lo hagas dependerá de si tu negocio tiene una sola tienda o múltiples ubicaciones.

Agregar un mapa para una sola ubicación

Si tu negocio opera desde una sola ubicación física, el mapa utilizará la información que proporciones en la página de 'Configuración de Ubicaciones' de All in One SEO.

Ahora, ve y cambia a la pestaña 'Ubicaciones' de la página All in One SEO » Local SEO.

Dado que tienes una sola ubicación física, debes asegurarte de que la opción 'Múltiples Ubicaciones' esté configurada en 'No'.

Establece Múltiples ubicaciones en No

A continuación, deberías desplazarte hacia abajo hasta la sección 'Información del Negocio' y completar tanta información sobre tu negocio como sea posible.

Esto es importante porque la información puede mostrarse cuando alguien busca tu negocio usando la búsqueda de Google o Google Maps.

La información del negocio se mostrará en las búsquedas de Google

Después de eso, desplázate hacia abajo hasta la sección ‘Mapas’ para fijar tu ubicación exacta.

Simplemente ingresa tu dirección en el campo 'Introduce una consulta'. Se agregará un marcador en esa ubicación, y puedes mover el marcador arrastrándolo a una nueva ubicación si es necesario.

Ingresa la ubicación de tu tienda como consulta en la sección de Mapas

Cuando hayas terminado, debes desplazarte hasta la parte superior o inferior de la página y hacer clic en el botón 'Guardar Cambios' para almacenar tu configuración.

Ahora, puedes agregar tu mapa localizador de tiendas a cualquier publicación o página de WordPress. Para empezar, simplemente edita o agrega una nueva publicación o página en tu sitio web.

Una vez que esté en el editor de bloques, haga clic en el botón '+' en la parte superior y agregue el bloque 'AIOSEO Local – Mapa' en cualquier lugar de la página. Asegúrese de hacer clic en el botón 'Actualizar' o 'Publicar' cuando haya terminado.

Agregar un bloque de mapa local de AIOSEO a tu página

Felicidades, ha agregado exitosamente un localizador de tiendas de Google Maps a su sitio.

Agregar mapas para múltiples ubicaciones

Para agregar un mapa para una ubicación diferente, debe navegar a la pestaña Ubicaciones de la página All in One SEO » Local SEO. Una vez allí, deberá hacer clic en la opción 'Sí' para Múltiples Ubicaciones y luego hacer clic en el botón 'Guardar Cambios' en la parte superior de la pantalla.

Establecer Múltiples Ubicaciones en Sí

Una vez que guarde sus cambios, notará que se ha agregado un nuevo tipo de publicación personalizada de Ubicaciones custom post type en la barra lateral del administrador. Aquí es donde ingresará las ubicaciones de su negocio.

Continúe y navegue a Ubicaciones » Todas las Ubicaciones y luego haga clic en el botón 'Agregar Nuevo'.

Agregar una nueva ubicación

Esto te llevará al editor de Ubicaciones. Deberás agregar un título para la ubicación que estás agregando, como el nombre de la tienda o el pueblo.

Ahora deberías desplazarte hacia abajo hasta la sección ‘AIOSEO Negocio Local’ de la página, debajo del contenido de la publicación.

Asegúrate de ingresar tanta información como sea posible porque puede mostrarse cuando alguien busque tu negocio en la búsqueda de Google o en Google Maps.

Completar la Sección de Información del Negocio

Después de eso, deberías encontrar la sección ‘Mapas’ e ingresar tu dirección en el campo ‘Ingresar una consulta’.

Se mostrará un marcador en esa ubicación.

Agregar múltiples ubicaciones de mapas

Después de ingresar tu ubicación en el mapa y añadir la información de la ubicación, haz clic en el botón ‘Publicar’.

Ahora puedes repetir este paso y agregar tus otras ubicaciones de negocio.

Una vez que hayas terminado, puedes agregar un mapa localizador de tiendas a tu sitio web para cada ubicación utilizando el bloque ‘AIOSEO Local – Mapa’ en el editor de WordPress.

Agregar un bloque de mapa local de AIOSEO a tu página

Ahora, deberás elegir qué ubicación mostrar en el mapa.

Para hacer eso, mira el panel de configuración del bloque a la derecha de la pantalla y elige la tienda que deseas mostrar en el menú desplegable ‘Ubicación’.

Seleccionar una Ubicación de Tienda del Menú Desplegable en el Panel de Configuración

Simplemente agrega bloques de mapas locales adicionales para cualquier otra ubicación. No olvides hacer clic en el botón ‘Publicar’ o ‘Actualizar’ en la parte superior de la página para mostrar los mapas en tu sitio web.

Método 3: Mostrar múltiples ubicaciones de tiendas en un solo mapa

Los dos primeros métodos te permiten agregar mapas localizadores de tiendas con una sola ubicación. Si tienes múltiples ubicaciones, entonces necesitas agregar un mapa separado para cada una.

Alternativamente, puedes usar nuestro tercer método para mostrar múltiples ubicaciones en un solo mapa.

Lo primero que necesitas hacer es instalar y activar el plugin Locatoraid Store Locator. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Al activarlo, necesitas visitar Locatoraid » Configuración y configurar el plugin.

En la pestaña ‘Google Maps’, deberás pegar una clave API de Google Maps. Puedes seguir el método anterior en el Método 2 para crear una.

Luego, debes hacer clic en el ícono ‘Guardar’ para almacenar la clave. Deberías notar que Google Maps puede cargarse correctamente en la ventana ‘Vista previa del estilo del mapa’.

Pega tu clave API de Google Maps

A continuación, puedes visitar la pestaña ‘Configuración’ y elegir si deseas mostrar millas o kilómetros en el mapa.

También puedes revisar las otras opciones, como el formato de la dirección, los detalles que te gustaría mostrar en el mapa y qué usuarios pueden usar el plugin.

Configura tu mapa, incluyendo las unidades que deseas usar

Una vez que estés satisfecho con la configuración del plugin, asegúrate de hacer clic en el botón ‘Guardar’ para almacenar tu configuración.

Ahora estás listo para agregar las ubicaciones de tus tiendas. Debes navegar a Locatoraid » Ubicaciones. Una vez allí, necesitas hacer clic en el botón ‘Agregar nueva’.

Hacer Clic en el Botón Agregar Nuevo en la Página de Ubicaciones

Esto te llevará a la página ‘Agregar nueva ubicación’. Aquí, puedes escribir el nombre de la tienda, la ubicación y otros detalles.

Cuando termines, deberías hacer clic en el botón ‘Agregar nueva ubicación’ en la parte inferior de la página.

Completar la Dirección de Tu Tienda y Otra Información

Serás llevado a la página ‘Editar ubicación’, donde puedes ver la ubicación de la tienda en un mapa.

Si todo se ve bien, entonces deberías hacer clic en el botón ‘< Ubicación’ en la parte superior de la pantalla para regresar a la página Locatoraid » Ubicaciones en tu panel.

Confirma que el mapa es correcto y luego haz clic en el botón de ubicaciones

Puedes agregar más ubicaciones haciendo clic en el botón ‘Agregar ubicación’ y repitiendo estos pasos.

Una vez que todas las ubicaciones de tu tienda hayan sido creadas, puedes agregar el mapa a tu sitio web.

Simplemente agrega o edita una página y haz clic en el ícono azul ‘+ Agregar Bloque’. Debes arrastrar un bloque de Shortcode a la página y luego ingresar el shortcode [locatoraid] en el campo.

Agrega un bloque de código corto a tu página

Este shortcode predeterminado funcionará bien para la mayoría de los sitios web. Sin embargo, puedes personalizar el mapa usando un shortcode diferente. Visita la página Locatoraid » Publicar para obtener más información.

Ahora, puedes publicar o actualizar la página y visitar tu sitio web para ver el mapa localizador de tiendas.

Todas las ubicaciones de tu tienda se mostrarán en el mismo mapa. Si tus usuarios escriben su dirección o hacen clic en el enlace ‘Localizarme’, podrán encontrar las tiendas más cercanas y obtener indicaciones.

Vista previa del mapa de Locatoraid con múltiples ubicaciones

Esperamos que este tutorial te haya ayudado a aprender cómo agregar un localizador de tiendas de Google Maps en WordPress. También podrías querer aprender cómo crear un mapa interactivo en WordPress o consultar nuestra lista de los mejores plugins de marcado de esquema para tu sitio web.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para obtener tutoriales en video de WordPress. También puedes encontrarnos en Twitter y Facebook.

Descargo de responsabilidad: Nuestro contenido es compatible con el lector. Esto significa que si haces clic en algunos de nuestros enlaces, podemos ganar una comisión. Consulta cómo se financia WPBeginner, por qué es importante y cómo puedes apoyarnos. Aquí está nuestro proceso editorial.

El Kit de herramientas definitivo para WordPress

Obtén acceso GRATUITO a nuestro kit de herramientas: ¡una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Interacciones del lector

4 CommentsLeave a Reply

  1. Hi there, the shortcode you have in the instructions on this page for the store locator is incorrect and conflicting.
    you have [wpls] in the instructions but the actual shortcode which you have in the screenshot is [wpsl].
    The s and the l are around the wrong way :)

  2. Dado que Google Maps cobra por usar su servicio, ¿no sería bueno ofrecer también la opción de usar Open Street Map? Estoy seguro de que debe haber plugins que lo hagan y hacerlo a mano no es tan diferente de la opción de Google.

    • No tenemos un plugin específico que recomendaríamos en este momento, pero ciertamente estaremos atentos.

      Administrador

Deja una respuesta

Gracias por elegir dejar un comentario. Ten en cuenta que todos los comentarios son moderados de acuerdo con nuestra política de comentarios, y tu dirección de correo electrónico NO será publicada. Por favor, NO uses palabras clave en el campo del nombre. Tengamos una conversación personal y significativa.