Cómo añadir un tooltip a una tienda Shopify sin programador
Una pista contextual en Shopify: una frase junto al elemento donde dudan los visitantes, colocada con un clic en el editor visual y mostrada justo cuando ayuda.
- Tiempo
- ● 10 minutos
- Precio
- Plan Free
- Quién lo hace
- Dueño de la tienda o personal con acceso al tema
Ejemplo: un tooltip en Shopify
Las devoluciones por talla son el mayor coste de la tienda. En las fichas de producto, 8 segundos después de cargar, un tooltip junto al selector de talla dice “Talla pequeña: la mayoría pide una más”.
Gratis en el plan Free de Clew, sin tarjeta y sin límite de tiempo: un sitio y hasta 3 tours o tooltips publicados. Las reglas de audiencia y los tests A/B llegan con Pro.
Cómo añadir el tooltip en Shopify, paso a paso
- Paso 01
Copia tu snippet de Clew
Crea una cuenta gratis (o inicia sesión), añade tu sitio y abre Admin → Resumen. Haz clic en la línea de la tarjeta del widget para copiarla: ya lleva la clave real de tu sitio en lugar del marcador.
<!-- Clew: sustituye PEGA_AQUI_TU_CLAVE por la clave del sitio de Admin > Resumen --> <script src="https://tryclew.io/widget/PEGA_AQUI_TU_CLAVE.js" async></script>
Paso 1 · ilustración esquemática - Paso 02
Abre el código del tema
En el admin de Shopify ve a Online Store → Themes, pulsa … junto al tema publicado y elige Edit code.
Paso 2 · ilustración esquemática - Paso 03
Pega la línea en theme.liquid
Abre
layout/theme.liquid, pega la línea de Clew justo antes de</head>y pulsa Save. Cargará en todas las páginas de la tienda.
Paso 3 · ilustración esquemática - Paso 04
Revisa la tienda
Abre la tienda en una ventana privada nueva (con la contraseña de la tienda si aún no está lanzada) y comprueba que las páginas cargan con normalidad.
Paso 4 · ilustración esquemática - Paso 05
Pega el tooltip al elemento
En Clew abre Flujos → + Nuevo flujo, deja Tooltips paso a paso y pulsa Editar en tu sitio. En tu página pulsa Elegir elemento, haz clic en el campo o botón y escribe un título corto y una frase. Ajusta Posición si la posición automática tapa algo importante.
Paso 5 · ilustración esquemática - Paso 06
Elige dónde, cuándo y a quién se muestra
En el mismo editor, completa Dónde mostrarlo (URL de la página), Cuándo mostrarlo, Segmentación de audiencia y Frecuencia. Estos son los ajustes del ejemplo de arriba:
Ajuste Valor Formato Tooltips paso a paso Dónde mostrarlo (URL de la página) Sección por prefijo /productsCuándo mostrarlo Tras N segundos: 8 segundos Segmentación de audiencia Sin reglas: todos los que abren la página Frecuencia Una vez por visitante 
Paso 6 · ilustración esquemática - Paso 07
Publica y compruébalo en el sitio real
Pon Estado en Publicado y guarda. Abre la página en una ventana privada: Clew recuerda quién ya vio un elemento de “una vez”, así que tu navegador habitual puede saltárselo. Las vistas, finalizaciones y abandonos aparecen en las estadísticas.
Paso 7 · ilustración esquemática
Errores comunes: tooltip en Shopify
El checkout queda fuera de alcance
Shopify no ejecuta los scripts del tema en las páginas de pago, así que un tooltip puede vivir en producto, colección, carrito y páginas de contenido, no en el checkout. Planifica el mensaje antes de que el cliente llegue ahí.
Los píxeles personalizados no muestran interfaz
Settings → Customer events ejecuta el código en un sandbox sin acceso a la página. Sirve para analítica, no para un tooltip: usa theme.liquid.
Cambiar de tema elimina la línea
La línea vive en el tema. Cuando publiques un tema nuevo o actualizado, vuelve a pegarla en su theme.liquid.
El constructor puede regenerar elementos al publicar
Los constructores a veces cambian los id de los elementos al duplicar o recrear un bloque. Tras cambios grandes de diseño, abre Estado: si la pista perdió su elemento, vuelve a elegirlo.
Preguntas y respuestas
¿Puedo mostrarlo solo en algunos productos?
Sí. Usa Sección por prefijo con la ruta de una colección, o La URL contiene con parte del handle del producto.
¿Hay una app de Clew para Shopify?
No, y no hace falta: una línea en theme.liquid es toda la instalación. No añade cargos de apps ni bloques de app al tema.
¿El tooltip es gratis?
Sí, en el plan Free: hasta 3 tours y tooltips publicados en un sitio.
¿Puede abrirse solo al hacer clic?
Sí. Elige Al hacer clic en un elemento, indica el selector del icono o enlace que lo abre y pon En cada visita.
Qué más puedes añadir en Shopify
- Cómo añadir un popup a una tienda Shopify sin programador
- Cómo añadir un aviso de paywall en Shopify sin programador