--- title: "Añadir una sección CMS Localizador de tiendas" description: "La extension localizador de tiendas GoodBarber te permite mostrar las ubicaciones de tus tiendas en tu aplicación Shopping y ayudar a tus clientes a encontrarlo" canonical_url: "https://es.goodbarber.com/help/shop/mostrar-puntos-de-venta-en-un-mapa-r142/anadir-una-seccion-cms-localizador-de-tiendas-a25/" lang: es --- # Añadir una sección CMS Localizador de tiendas Source: https://es.goodbarber.com/help/shop/mostrar-puntos-de-venta-en-un-mapa-r142/anadir-una-seccion-cms-localizador-de-tiendas-a25/ La extension localizador de tiendas GoodBarber te permite mostrar las ubicaciones de tus tiendas en tu aplicación Shopping y ayudar a tus clientes a encontrarlo fácilmente, simplificando la experiencia de compra. Con esta extension, puedes agregar secciones de Mapa a tu aplicación Shopping. **Instala la extension:** 1. Ve al menú **Extensiones Store > Todas las Extensiones > Localizador de tiendas** 2. Haz clic en "**Instalar"** ## 1. Añadir una sección Mapa 1. En el menú swipe izquierdo, ve a **Mi app > Estructura** 2. Haz clic en el botón verde + ​"**Añadir una sección** " en la columna derecha 3. Añade una sección de Mapas escogiendo "**Mapa**" en los items del contenido 4. Dale un titulo 5. Haz clic en "**Añadir**" ## 2. Añadir un punto 1 - Haz clic en los 3 puntos en tu lista de secciones, y luego "**​Modificar el** **contenido**" ![](https://cmsphoto.ww-cdn.com/superstatic/1878438/art/default/34458010-31503643.jpg?v=1782311109.3996873) 2 - Haz clic en el botón verde "**Crear un punto**" en la columna principal 3 - Dale un **titulo** 4 - Entra una **ubicación**. *Hay 2 posibilidades*: - **Llena la dirección primero y escoge tu ubicación desde la lista** **desplegable.** *Si la dirección que introduces puede ser localizada geográficamente en Google Maps, aparecerá en la parte inferior, y la latitud y la longitud del punto se rellenarán automáticamente. Nota: No podrás cambiar el format de la dirección en este caso, es algo manejado automáticamente.* - **Llena la latitud y longitud, luego llena la dirección manualmente** - sin escogiendo una opción de la lista desplegable. *Nota: Con este método, podrás determinar el formato que quieres para la dirección.* ![](https://cmsphoto.ww-cdn.com/superstatic/1878438/art/default/34458010-31503644.jpg?v=1782311109.4156873) ## 3. Cómo recuperar coordenadas GPS en Google Maps 1 - Entra a la plataforma **Google Maps:**[https://maps.google.com](https://maps.google.com) 2 - **Pon tu ratón** justo encima del punto del mapa que quieres geolocalizar 3 - Haz clic con **el botón derecho** en el punto Una burbuja de información que aparecerá contiene la**latitud** y **longitud** del punto. ![](https://cmsphoto.ww-cdn.com/superstatic/1878438/art/default/34458010-31503645.jpg?v=1782311109.4276874) ## 4. Estado de publicación de tu punto El botón en la parte inferior a la derecha de la pantalla, te deja seleccionar el estado de publicación del contenido: **- Publicar**: tu contenido será visible en la aplicación de inmediato. **- Guardar borrador**: tu contenido será salvado pero no visible a tus usuarios. **-** **No publicado**: Tu contenido ha sido guardado pero no es visible a tus usuarios. Este estado podría ser util para informar miembros de tu equipo que el contenido tiene que ser revisado antes de publicación, por ejemplo. **- En stock**: tu contenido será salvado pero no visible a tus usuarios. ![](https://cmsphoto.ww-cdn.com/superstatic/1878438/art/default/34458010-31503646.jpg?v=1782311109.4356875) ## 5. Pestaña de Info 1 - Ve a la columna derecha y haz clic en la pestaña **Info** 2 - Puedes seleccionar la **​pagina o** **categoría donde tu artículo será visible en la app**. *Puedes hacer que el mismo artículo sea visible en secciones diferentes o en categorías mostrando el mismo tipo de contenido. En el ejemplo, el artículo sera visible en la sección Mapa CMS (categoría principal) y también en la categoría 2.* ![](https://cmsphoto.ww-cdn.com/superstatic/1878438/art/default/34458010-31503647.jpg?v=1782311109.4436874) 3 - **Configura tus botones de acción**: Haz una llamada a un numero telefónico, o enviar mensaje a un correo electrónico 4 - **Añadir un enlace** a un sitio externo ![](https://cmsphoto.ww-cdn.com/superstatic/1878438/art/default/34458010-31503648.jpg?v=1782311109.4516876) 5 - **Configura el estilo de tu icono:** - **​**escoge entre diferente estilos de iconos que proporcionamos *o* - puedes subir un icono personal* 6 - **aplica cualquier** color que quieras a tu icono *Nota: Si subes un icono personal, ​tiene que absolutamente seguir todos estos requerimientos: - El archivo tiene que ser un archivo PNG. - El formato tiene que ser entre 150 x 150 px y 150 x 300 pixels. - El icono tiene que ser ​completamente blanco (FFFFFF) y el fondo tiene que ser transparente. El punto de anclaje del icono tiene que ser al centro del PNG.* ![](https://cmsphoto.ww-cdn.com/superstatic/1878438/art/default/34458010-31503649.jpg?v=1782311109.4596877) ## 6. SEO 1 - Opcional: cambiar el [slug](https://es.goodbarber.com/help/shop/optimizar-el-posicionamiento-seo-de-la-pwa-r105/configurar-la-reescritura-de-url-y-slugs-a290/) 2 - Opcional: cambia el [tag titulo](https://es.goodbarber.com/help/shop/optimizar-el-posicionamiento-seo-de-la-pwa-r105/configurar-las-etiquetas-meta-para-el-seo-de-la-pwa-a266/) 3 - Opcional: cambia el [tag descripción meta](https://es.goodbarber.com/help/shop/optimizar-el-posicionamiento-seo-de-la-pwa-r105/configurar-las-etiquetas-meta-para-el-seo-de-la-pwa-a266/) ![](https://cmsphoto.ww-cdn.com/superstatic/1878438/art/default/34458010-31503650.jpg?v=1782311109.4716876) ## 7. Permite los usuarios cambiar las unidades de distancia 1 - Añade una [sección de Ajustes](https://es.goodbarber.com/help/shop/crear-secciones-practicas-r15/anadir-una-seccion-de-ajustes-en-la-app-a26/) a tu app Tus usuarios podrán escoger entre las unidades de distances que verán en el Mapa, millas o kilómetros. ## 8. Ajustes de la sección 1. En el menú swipe izquierdo, ve a **Mi app > Estructura** 2. Haz clic en 3 puntos a un lado de tu sección 3. Haz clic en "**Ajustes**": - Ordenar los puntos por distancia, fecha de redacción, orden alfabético o más comentando - Activar comentarios, etc. Para más información sobre el menú de ajustes de la sección, por favor lea esta ayuda en línea: **[Ajustes de las paginas CMS](https://es.goodbarber.com/help/shop/organizar-tu-contenido-r121/configurar-los-ajustes-de-las-secciones-a116/) .** **IMPORTANTE: Sólo los 48 primeros puntos del mapa se mostrarán en el lanzamiento de la sección.** Debe **desplazarse hacia abajo en la lista para cargar los siguientes 48 puntos y mostrarlos en el mapa.** Debe repetir el proceso para las siguientes 48 ubicaciones, y así sucesivamente.