Código del widget de imagen para tiendas online: maquetas e ideas visuales para tus clientes
Un widget de imagen con IA ayuda a los clientes a visualizar una idea de producto antes de comprar. Así lo usan las tiendas y así lo mantienes fiel a tu marca y dentro del presupuesto.
Publicado:
A los clientes a menudo les cuesta imaginar el resultado: una impresión personalizada, el color de una habitación, una idea para regalar. Un widget de imagen con IA les permite describirlo y ver una imagen generada en segundos, sin salir de tu tienda. Como el widget es de marca blanca, parece parte de tu tienda y no una herramienta de terceros.
Ideas que funcionan en una tienda
- Impresiones y merchandising personalizados: "un dibujo minimalista de montañas a línea para una taza" da al cliente un punto de partida para hablarlo contigo.
- Interiorismo y decoración: los visitantes esbozan un ambiente ("un dormitorio escandinavo tranquilo en verde salvia") antes de ver los productos que encajan.
- Inspiración para regalos: una imagen rápida ayuda a decidir qué pedir.
Deja claro en la página que las imágenes son conceptos generados por IA, no fotos de un producto que envías. Así las expectativas son realistas y evitas devoluciones.
Añádelo a una página de producto o a una landing page
Crea un widget de Imagen en Widgets, guárdalo y copia el código:
<script src="https://api14.com/widget.js" data-widget="YOUR_WIDGET_ID" async></script>
La mayoría de los creadores de tiendas admiten un bloque de HTML personalizado. Pega ahí la etiqueta, o muestra el widget dentro de un elemento concreto con data-target. El widget vive en su propio Shadow DOM, así que el CSS de tu tema y el widget nunca interfieren entre sí.
Haz que parezca tu tienda
El widget de imagen no lleva logotipo ni línea "powered by". Escribe el título y el botón con el tono de tu tienda, elige el color de acento de tu marca y un tema que combine con tus páginas. Usa el texto del campo para mostrar un buen prompt de ejemplo: los clientes copian lo que ven.
Mantén el gasto previsible
Una tienda puede tener días de mucho movimiento, así que define límites antes de una campaña:
- Haz que el widget funcione con una clave API dedicada. En el editor, la última opción de la lista de claves es Crear nueva clave API. Dale a esa clave un límite de gasto diario y restríngela al modelo de imagen que elegiste.
- Añade también un límite de gasto diario en el propio widget.
- En Configuración, Controles de widgets, define cuántas solicitudes puede enviar un visitante al día.
Uso muestra las solicitudes del widget por sitio y por widget, para que veas si la herramienta compensa.
Autoriza solo el dominio de tu tienda
Indica el dominio de tu tienda en Configuración, Sitios del widget. Un dominio incluye también sus subdominios, así que example.com incluye www.example.com.
Prueba el editor en la página de widgets para ver cómo quedaría un widget de imagen en tu tienda.