Bloques de Confianza y Trust Badges — Guía completa
Instalar y configurar los bloques de confianza: iconos, hooks, arrastrar y soltar y variantes por idioma.
Presentación
El módulo Bloques de Confianza y Trust Badges (dftrustbuilder) permite crear bloques de confianza a partir de una biblioteca integrada de 18 iconos SVG, posicionarlos en 6 zonas del front-office con arrastrar y soltar, y gestionar variantes por idioma. Compatible con PrestaShop 8.0 a 9.x, multitienda y multiidioma.
En la instalación se crean 4 bloques de ejemplo (pago seguro, envío rápido, devoluciones fáciles, hecho en la UE) en 5 idiomas en la zona de confianza del producto. Su tienda queda vestida de inmediato.
Instalación
- En el back office, vaya a Módulos > Gestor de módulos > Subir un módulo.
- Suba el archivo
dftrustbuilder-1.0.0.zipy haga clic en Instalar. - Haga clic en Configurar para acceder a los ajustes de visualización y a la gestión de bloques.
No se requiere ninguna modificación del tema: el módulo utiliza los hooks estándar del front-office.
Ajustes de visualización
La página de configuración del módulo agrupa los ajustes globales aplicados a todos los bloques:
- Estilo: minimal (sin marco), con borde (borde fino) o tarjeta (fondo blanco con sombra suave).
- Columnas: auto (se adapta al ancho disponible), 2, 3, 4 o 6.
- Alineación: icono a la izquierda, o centrado con el icono sobre el texto.
- Tamaño de los iconos: de 12 a 128 píxeles (32 px por defecto).
- Color de los iconos: deje vacío para heredar el color del texto del tema.
- Una columna en móvil: fuerza el apilado vertical en pantallas estrechas.
Gestionar los bloques
Haga clic en Gestionar bloques de confianza desde la página de configuración para abrir la lista de bloques.
Crear un bloque
- Haga clic en Añadir bloque.
- Elija un icono de la cuadrícula: pago seguro, tarjeta bancaria, camión de envío, reloj 24 h, paquete, devoluciones, garantía, made in EU, made in France, soporte, teléfono, chat, regalo, opiniones, eco-responsable, mundo, satisfacción, promociones.
- Seleccione el hook de visualización (ver más abajo).
- Complete el título y el subtítulo en cada idioma.
- Opcional: añada una URL por idioma para hacer el bloque completamente clicable, por ejemplo hacia su página CMS de envíos.
- Guarde. El bloque se añade en la última posición.
Zonas de visualización disponibles
- Confianza del producto (displayReassurance): bajo el botón de compra de la ficha de producto — la zona recomendada.
- Portada (displayHome).
- Bajo la cabecera, ancho completo (displayNavFullWidth).
- Sobre el pie de página (displayFooterBefore): visible en todo el sitio.
- Información adicional del producto (displayProductAdditionalInfo).
- Pie del carrito (displayShoppingCartFooter).
Reordenar con arrastrar y soltar
En la lista de bloques, tome las flechas de la columna Posición y arrastre la fila. El orden se guarda automáticamente.
Utilice el filtro Hook en la parte superior de la columna para mostrar solo los bloques de una zona y reordenar esa ubicación con precisión.
Variantes por idioma
Cada bloque tiene un título, un subtítulo y un enlace por idioma. Dos usos:
- Traducción: simplemente complete los textos en cada pestaña de idioma.
- Visibilidad por idioma: deje el título vacío en un idioma para ocultar el bloque solo en ese idioma. Ejemplo: una insignia made in France con el icono del hexágono visible solo en francés, y una insignia made in EU para los demás idiomas.
El título solo es obligatorio en el idioma por defecto de la tienda. Todos los demás idiomas pueden quedar vacíos.
Multitienda
En un contexto multitienda, cada bloque puede asociarse a una o varias tiendas mediante el recuadro Asociación de tienda del formulario. Los ajustes de visualización (estilo, columnas, colores) siguen el contexto de configuración de PrestaShop.
Solución de problemas
- Los bloques no se muestran: compruebe que el bloque está activo, que su hook corresponde a una zona realmente renderizada por su tema, y que el título está completado en el idioma consultado.
- La zona de confianza no aparece en la ficha de producto: algunos temas personalizados no llaman a displayReassurance. Utilice entonces displayProductAdditionalInfo o displayFooterBefore.
- Los iconos son invisibles o del color equivocado: por defecto heredan el color del texto. Defina un color explícito en la configuración si su tema usa un texto muy claro.
- El arrastrar y soltar no funciona: asegúrese de que la lista está ordenada por la columna Posición (orden por defecto).