Configurar newsletter, contacto y mapa

Qué vas a lograr

• Captar correos con un bloque Newsletter.
• Recibir mensajes desde un bloque Formulario.
• Mostrar una ubicación con Google Maps y un botón externo.

Paso a paso en Flobu

Cómo funciona la interfaz de Flobu en este tutorial

• Menú lateral: dentro del editor visual, usa Añadir o Agregar bloque.
• Panel central: selecciona cada bloque y revisa cómo se ve en la página.
• Panel derecho: editarás contenido, campos, mensajes, ubicación y presentación.
• Acción clave: al terminar, revisa escritorio, tablet y móvil; luego usa Publicar cambios.

1) Configurar el bloque Newsletter

1. Abre la página que quieres editar.
2. Elige la sección donde quieres captar correos.
3. Haz clic en Añadir o Agregar bloque.
4. Busca Newsletter dentro de Formularios.
5. Selecciona el bloque en el canvas.
6. En Contenido, edita Título y Subtítulo.
7. En Formulario, ajusta Placeholder y Texto del botón.
8. En Mensajes, escribe el Mensaje de éxito y el Mensaje de error.
9. En Presentación, revisa Alineación, Ancho, Estilo, Radio, Tamaño y Botón.

Resultado esperado:

• El bloque muestra un formulario simple para captar correos en la tienda publicada.
• Si usas Mailchimp, la audiencia se configura aparte; este bloque solo captura el correo desde la página.

2) Configurar el bloque Formulario

1. Haz clic en Añadir o Agregar bloque.
2. Busca Formulario dentro de Formularios.
3. Selecciona el bloque en el canvas.
4. En Contenido, edita Título, Subtítulo y Texto del botón.
5. En Estados, ajusta el Mensaje de éxito y el Mensaje de error.
6. En Campos, activa o desactiva Nombre, Teléfono y Asunto según lo que necesites.
7. Ten presente que Correo y Mensaje siempre quedan visibles y son requeridos.
8. En Etiquetas, cambia los textos visibles de cada campo.
9. En Presentación, revisa Alineación del encabezado, Ancho, Estilo, Radio y Botón.

Resultado esperado:

• El cliente puede enviar un mensaje desde la tienda publicada y la tienda recibe los datos de contacto.

3) Configurar el bloque Google Maps

1. Haz clic en Añadir o Agregar bloque.
2. Busca Google Maps dentro de Mapas.
3. Selecciona el bloque en el canvas.
4. En Ubicación, completa el campo Dirección o lugar.
5. Si necesitas más precisión, completa Coordenadas con el formato latitud,longitud.
6. Ajusta el Zoom del mapa y elige el Tipo de mapa: Mapa o Satélite.
7. En Contenido, edita Título y Caption.
8. En Botón externo, decide si mostrarás el botón.
9. Ajusta el Texto del botón.
10. Si dejas vacío el campo Enlace del botón, Flobu crea automáticamente un enlace a Google Maps usando la ubicación configurada.
11. En Presentación, revisa Altura, Alineación, Ancho, Radio y Estilo.

Resultado esperado:

• La página muestra un mapa claro y, si lo activaste, un botón para abrir la ubicación en Google Maps.

Checklist final rápido

• Agregué el bloque Newsletter.
• Configuré textos, botón, mensajes y presentación del newsletter.
• Agregué el bloque Formulario.
• Revisé campos, etiquetas, mensajes y presentación del formulario.
• Agregué el bloque Google Maps.
• Completé dirección o coordenadas, zoom, tipo de mapa y botón externo.
• Revisé escritorio, tablet y móvil.
• Publiqué los cambios.

Errores comunes

• Buscar "Contacto" o "Mapa" como nombres exactos. En la biblioteca aparecen como Formulario y Google Maps.
• Pensar que el bloque Newsletter conecta Mailchimp por sí solo. La integración de Mailchimp se configura aparte.
• Intentar ocultar los campos Correo o Mensaje en el formulario. Esos campos siempre quedan visibles y son requeridos.
• Usar coordenadas con formato incorrecto. Escríbelas como -33.4489,-70.6693.
• Dejar el mapa sin dirección ni coordenadas. El bloque necesita una ubicación para mostrarse correctamente.
• Ignorar el aviso "Falta configurar Google Maps". Si aparece, revisa la configuración de Google Maps del sitio antes de publicar.
• Olvidar publicar los cambios. Lo que ves en el editor no llega al sitio público hasta que uses Publicar cambios.