Store locator plus, configuramos el plugin de las múltiples localizaciones.

Tener una buena comunicación con nuestros clientes es un echo que está demostrado. Hoy en día existen muchas herramientas para llevar a cabo esta labor: e-mail, teléfono, redes sociales, etc etc.

Una de las más extendidas es mostrar la localización de nuestro negocio a través de Google maps. Implementar la localización de nuestro negocio en nuestra página web es relativamente fácil, desde Google maps nos ofrecen un código que insertamos en un módulo Html y lo tenemos solucionado, pero ¿y si nuestro modelo de negocio se basa en partners o en una franquicia?

¿Como podemos hacer para mostrar en un único mapa todas las localizaciones de todas nuestras sucursales?

Para ese fin esta creado el plugin Store locator plus.

Instalación

Para instalarlo nos iremos al repositorio de plugins de WordPress. Nos vamos a plugins/añadir nuevo y en la barra de buscar escribimos Store locator plus. Una vez aparezcan los resultados de la búsqueda instalamos y ejecutamos (recuadro rojo de la imagen).

Al actualizarse la página veremos como a la columna de opciones de la izquierda se nos a añadido una pestaña nueva (recuadro azul de la imagen). En esta pestaña configuraremos las opciones que necesitamos para llevar a cabo nuestro mapa multilocalizaciones.

Creamos la API key para Google Maps

Para el correcto funcionamiento de google maps en nuestra página web, lo primero que debemos realizar es una API key. Podemos conseguir nuestra API key de forma gratuita en la consola de desarrolladores de Google. Creamos un nuevo proyecto (recuadro verde imagen) con el título que nos interese y una vez nos aparezca la biblioteca de API seleccionamos MAPS JAVASCRIPT API y la habilitamos.

Acto seguido clicamos sobre credenciales (recuadro naranja imagen) y creamos una credenciales clave de API (recuadro rosa imagen) y nos creara una clave que deberemos pegar en los ajustes de Store Locator Plus.

Volvemos al administrador de WordPress y vamos a los ajustes de Store Locator Plus, seguimos la ruta General/server y pegamos la API key en Google Browser Key (recuadro lila de la imagen) y guardamos los cambios.

Configuramos el aspecto visual de Store Locator Plus

Iniciaremos la personalización por los aspectos de búsqueda. Para ello accederemos a Settings/Search. De arriba a abajo estos son los campos que debemos definir:

• Distance unit: Definir la unidad con la que se van a medir las distancias.
• Radio Options: En este punto definimos los diferentes radios de búsqueda en relación a la ciudad o el código postal que se introduzca en el buscador.
• Search form style: El estilo del formulario de búsqueda. En la versión premium ofrecen más opciones de personalización.
• Radius y address: Añadiremos las traducciones que acompañan a los campos de búsqueda

Pasamos a la personalización del mapa. Sin movernos de esta página hacemos click en Map. De arriba a abajo estos son los campos que debemos definir:

• Center Map At: Definiremos en centro del mapa en un pais, región o localidad.
• Center Latitude Fallback y Center Longitude Fallback: Si la geocodificación del Google esta desactivada definiremos el centro del mapa a través de la longitud y la latitud. Para averiguar esos parámetros de una dirección podéis realizarlo clicando aquí.
• Zoom Level: Definiremos el nivel de zoom inicial del mapa.
• Zoom Adjustment: Cambia la medida en que el zoom automático limita las ubicaciones mostradas.
• Map Domain: Seleccione la URL de la API de Google maps que se utilizará de forma predeterminada para las consultas de ubicación. En nuestro caso seleccionaremos España.
• Map Language: Idioma del mapa.

• Map Height y Height Units: Definimos el alto del mapa y la unidad de medida con la que definimos la altura. En pixeles, porcentaje, etc etc
• Map Width y Width Units: Definiremos el ancho del mapa del mismo modo que el punto anterior.
• Map Type: Tipo de mapa. De carreteras, satélite, hibrido, etc.
• Remove Credits: Seleccionando esta opción deshabilitamos los créditos del plugin.
• Home Marker: Personalizamos con un icono la leyenda que marca la central de nuestro negocio. El plugin ofrece un abanico de posibilidades para la personalización o bien podemos subir un icono a la biblioteca de medios.
• Location Marker: Personalizamos con un icono la leyenda que marca las sucursales de nuestro negocio.

Personalizamos los resultados de búsqueda de Store Locator Plus

Clicamos sobre la pestaña results y personalizamos los campos a nuestro criterio.

• Show Locations: Si activamos esta opción nos aparecerán todos los posibles resultados sin realizar ninguna búsqueda.
• Initial Search Radius: Definimos el radio inicial de búsqueda.
• Number To Show Initially: Número inicial de resultados antes de la búsqueda.
• Number To Show: Número inicial de resultados después de la búsqueda.

Los campos que aparecen en appearance y labels son para definir las traducciones tanto de los resultados de búsqueda como de los textos que aparecen al clicar en las leyendas del mapa.

Añadimos nuestra primera dirección en Store Locator Plus

Clicamos sobre la pestaña locations.

Una vez nos cargue la página correspondiente nos aparecerán 4 subpestañas:

• List: Lista de todas las direcciones que tenemos añadidas al plugin.
• Add: Añadir nueva dirección.
• Load: Cargar una lista de direcciones que utilicen La aplicación de Store Locator Plus mediante una URl.
• Import: Importar una lista de direcciones mediante un archivo CSV.

Para añadir una nueva dirección clicamos sobre la pestaña add y simplemente es rellenar todos los campos referentes a la sucursal que vayamos a insertar en el mapa. Recordad que para la localización de coordenadas podemos utilizar la herramienta que hemos mencionado en el punto que hacia referencia a la personalización del mapa.

Podéis reeditar o borrar direcciones con los iconos que aparecen al inicio de cada uno de los elementos de la lista (recuadro rojo imagen).