Widgets e inserciones
Wall of Love, carrusel, tarjeta individual y el Trust Badge.
Tipos de widget
- Wall of Love, la clásica cuadrícula tipo mosaico con tus mejores testimonios
- Carrusel, una fila deslizante, genial bajo una sección hero
- Testimonio individual, una cita destacada, grande y clara
- Trust Badge, tu puntuación verificada con estrellas (requiere verificación de empresa)
Insertar
Cada widget te da una línea de código:
<script src="https://app.trustfuel.ai/widget.js" data-trustfuel-widget="YOUR_ID" async></script>
Funciona en WordPress, Webflow, Framer, Shopify y cualquier web propia. El widget se renderiza en un frame aislado, se autoajusta, carga en diferido y nunca ralentiza tu página.
Insertar un testimonio concreto
Cada testimonio publicado tiene su propio código de inserción (en su página de detalle):
<script src="https://app.trustfuel.ai/widget.js" data-trustfuel-testimonial="TESTIMONIAL_ID" async></script>
Perfecto para poner una cita fuerte junto a una tabla de precios o dentro de un caso de éxito. Añade data-theme="dark" o data-theme="auto" para combinar con tu web.
Custom CSS
Cada widget tiene un campo Custom CSS en su editor. Tu CSS aplica solo dentro de esa inserción, así que cada código puede verse completamente distinto. Estas son las clases que puedes apuntar:
| Clase | Qué estiliza |
|---|---|
.tf-card |
El contenedor de la tarjeta (fondo, borde, radio, sombra) |
.tf-testi |
La tarjeta de testimonio en sí |
.tf-testi-quote |
El texto de la cita |
.tf-testi-author |
La fila de autor al pie de la tarjeta |
.tf-testi-name |
Nombre del autor (la línea pequeña de debajo es un small) |
.tf-testi-avatar |
La imagen de avatar redonda |
.tf-testi-media |
Zona de vídeo/captura de una tarjeta |
.tf-stars |
La fila de estrellas (color cambia el color de estrella) |
.tf-star--empty |
Estrellas sin rellenar |
.tf-badge |
El contenedor del Trust Badge |
.tf-badge-score |
El número grande de puntuación en el badge |
.tf-wall |
La cuadrícula tipo mosaico (columns controla el número de columnas) |
También puedes sobrescribir los design tokens de toda la inserción, por ejemplo:
:root {
--tf-primary: #e11d48; /* color de acento */
--tf-radius: 12px; /* radio de esquina de las tarjetas */
--tf-font: Georgia, serif;
}
.tf-testi-quote { font-size: 18px; font-style: italic; }
Los planes Pro pueden además fijar un color de acento global en Settings → Branding que aplica a todas las inserciones y formularios a la vez.
Elegir exactamente qué testimonios aparecen
En el editor del widget cambia Which testimonials? de Automatic a Hand-picked. Gestionas dos listas:
- Available muestra todo lo que aún no está en el widget. Busca por nombre o cita y filtra por tipo (texto, vídeo, captura), luego pulsa un testimonio para añadirlo. Los añadidos salen de la lista al instante.
- In widget muestra lo que estará en vivo tras guardar. El número de cada elemento es su orden; pulsa la × para quitarlo.
El modo Automatic usa filtros en su lugar: número máximo, etiqueta y solo destacados.
SEO Trust Badges (backlink dofollow)
Los widgets se renderizan en un frame aislado por rendimiento, lo que significa que sus enlaces no pasan valor SEO. Para eso usa los SEO Trust Badges en Public Profile: tres estilos estáticos (card, sello redondo, barra compacta) que se insertan como HTML plano.
- La imagen del badge se genera en vivo desde tu puntuación de reseñas, siempre muestra cifras actuales.
- El enlace de vuelta a tu perfil de TrustFuel es un enlace dofollow normal, un backlink real que fortalece tu dominio.
- Copia el snippet en la página Public Profile y pégalo en el footer de tu web, aviso legal o firma de email.
- Marcado de Google Stars: junto a los badges hay un script JSON-LD de una línea. Inyecta el schema de Organization + AggregateRating con tu puntuación verificada en vivo en tu página, la base técnica para snippets de estrellas en tus propias páginas. Ten en cuenta la política self-serving de Google: las estrellas en tu propio dominio las muestra Google a su criterio, la superficie garantizada de estrellas es tu página de perfil de TrustFuel.
Fondo transparente
Activa Transparent background en el editor y la superficie del widget desaparece por completo: las tarjetas flotan directamente sobre tu página, sea cual sea su color. Combinado con el iframe transparente, así las inserciones encajan sin caja visible en funnels y landing pages oscuras.
Configuración
Tema (claro, oscuro o seguir el sistema del visitante), máximo de testimonios, columnas, filtro por etiqueta, solo destacados y visibilidad de las estrellas. Los planes Pro pueden personalizar los widgets con su propio color de acento en Settings → Branding.