Añade un formulario de contacto profesional a tu tienda Shopify en minutos con la extensión de tema de SupportRetriever.
¿Qué es una extensión de tema?
Una extensión de tema permite añadir funcionalidad a tu tienda Shopify sin editar el código del tema. El bloque Formularioulario de contacto de SupportRetriever se puede colocar en cualquier página para que los clientes te contacten fácilmente.
Ventajas
- Sin código: Arrastra y suelta el bloque en tu tema
- Instalación limpia: No hace falta editar archivos del tema
- Compatible con actualizaciones: Sobrevive a actualizaciones y cambios del tema
- Responsive en móvil: Funciona bien en todos los dispositivos
- Aspecto profesional: Personalizable para tu marca
- Tienda limpia: La marca SupportRetriever se oculta automáticamente cuando se inserta en tu tienda Shopify (según las políticas de marca de Shopify)
Activación rápida (recomendado)
La forma más rápida de empezar si aún no tienes una cuenta SupportRetriever:
Paso 1: Accede al editor de temas
- Inicia sesión en tu administrador de Shopify
- Ve a Tienda online → Temas
- Haz clic en Personalizar en tu tema activo
Paso 2: Añade el bloque de formulario de contacto
- Navega a la página donde quieres el formulario (ej., página de Contacto)
- Haz clic en Añadir sección o Añadir bloque
- Desplázate hasta Apps
- Selecciona Contact Formulario (SupportRetriever)
Paso 3: Activa tu formulario
Cuando añadas el bloque, verás un mensaje de activación:
- Haz clic en el botón Activate My Formulario
- Se abrirá una nueva pestaña con tu correo de tienda prellenado
- Haz clic en Confirmar y Activar
- La URL de tu formulario aparecerá al instante
- Haz clic en Copiar URL
Paso 4: Pega la URL y publica
- Vuelve a la pestaña del editor de temas de Shopify
- Pega la URL en el campo URL del formulario en el panel de configuración
- Haz clic en Guardar y luego Publicar
Revisa tu correo para obtener instrucciones para completar la configuración de tu cuenta y acceder a tu panel para personalizar el formulario y ver envíos.
Instalación para usuarios existentes
Si ya tienes una cuenta SupportRetriever:
Requisitos previos
- Necesitas una tienda Shopify (cualquier plan)
- Debes estar conectado al admin de Shopify
- Necesitas una cuenta SupportRetriever con un formulario creado
Métodos de instalación
Método 1: Enlace directo con un clic (recomendado)
La forma más rápida de instalar el bloque es usar el enlace directo desde el panel de SupportRetriever.
Paso 1: Conectar tu tienda Shopify
- Inicia sesión en tu cuenta SupportRetriever
- Ve a Ajustes (icono ⚙️ en el menú lateral)
- Baja hasta la sección "Integración con Shopify"
- Introduce la URL de tu tienda:
yourstore.myshopify.com - Haz clic en Conectar Shopify
- Autoriza la conexión cuando se solicite
Paso 2: Abrir el editor de tema con el enlace directo
- En la sección de integración con Shopify verás un botón Abrir editor de tema
- Haz clic en el botón: se abrirá el editor de tema de Shopify
- El bloque Formularioulario de contacto estará listo para añadir
Este botón abre el editor de tema de Shopify con el bloque Formularioulario de contacto listo para añadir.
Paso 3: Añadir el bloque a la página
- En el editor de tema verás el editor de la página
- Haz clic en Añadir bloque o Añadir sección donde quieras el formulario
- Elige Apps en el menú
- Selecciona Formularioulario de contacto (SupportRetriever)
- El bloque se añadirá a la página
Paso 4: Configurar el bloque
- Con el bloque Formularioulario de contacto seleccionado, mira el panel de ajustes a la derecha
- URL del formulario: Pega la URL de tu formulario SupportRetriever
- Obtén la URL en el panel de SupportRetriever
- Formularioato:
https://supportretriever.com/form/your-form-id
- Altura del formulario: Ajusta la altura (recomendado 1000px para formularios completos)
- Mostrar borde: Activa o desactiva el borde (opcional)
Paso 5: Guardar y publicar
- Haz clic en Guardar en la esquina superior derecha del editor de tema
- Haz clic en Publicar para que el formulario esté activo en tu tienda
- Visita tu página para ver el formulario en funcionamiento
Método 2: Instalación manual
Si prefieres añadir el bloque a mano sin el enlace directo:
Paso 1: Acceder al editor de tema
- Inicia sesión en el admin de Shopify
- Ve a Tienda online → Temas
- Haz clic en Personalizar en tu tema activo
Paso 2: Ir a tu página
- En la parte superior del editor, selecciona la página donde quieras el formulario
- Opciones habituales:
- Página Contacto (la más común)
- Página Nosotros
- Páginas personalizadas
- Páginas de producto (para consultas sobre productos)
Paso 3: Añadir sección o bloque
- Haz clic en Añadir sección (formulario a ancho completo) o Añadir bloque (dentro de una sección existente)
- Baja hasta Apps
- Selecciona Formularioulario de contacto (verás "SupportRetriever" o el nombre de la extensión)
Paso 4: Configurar el bloque
Igual que en el Método 1, Paso 4: añade la URL del formulario y ajusta los ajustes.
Obtener la URL de tu formulario
Para encontrar la URL de tu formulario SupportRetriever:
- Inicia sesión en SupportRetriever
- Ve a tu Panel de administración
- Haz clic en Gestión de formularios (icono del formulario en el menú lateral)
- La URL aparece arriba:
https://supportretriever.com/form/[tu-id-de-formulario] - Haz clic en Copiar para copiarla al portapapeles
Ver también: Obtener la URL de tu formulario para instrucciones detalladas.
Ubicaciones habituales
Página de contacto (la más usada)
- Crea o edita tu página de Contacto
- Quita el contenido por defecto (o mantén contenido arriba/abajo del formulario)
- Añade el bloque Formularioulario de contacto
- Guarda y publica
Páginas de producto
Añade el formulario en productos concretos para consultas sobre el producto:
- Abre el editor de tema
- Selecciona Productos → Producto por defecto
- Añade el bloque Formularioulario de contacto a la plantilla de producto
- Configura los ajustes
Varias páginas
Puedes añadir el bloque en varias páginas:
- Página de contacto para consultas generales
- Página Nosotros para consultas comerciales
- Página "Soporte" para atención al cliente
- Páginas de producto para preguntas sobre productos
Cada instancia puede usar la misma URL de formulario o URLs distintas (si tienes varios formularios en SupportRetriever).
Consejos de personalización
Altura
La altura define cuánto espacio ocupa el formulario:
- 600px: Adecuado si hay más contenido arriba/abajo
- 800px: Buen equilibrio para la mayoría de formularios
- 1000px: Muestra el formulario completo sin desplazamiento (recomendado)
Si el contenido es más alto que la altura configurada, el formulario se desplazará dentro del iframe.
Borde
- Mostrar borde: Añade un borde sutil alrededor del formulario (bueno para separar)
- Sin borde: Integración más continua con la página
Móvil
El bloque es responsive en móvil:
- El formulario se adapta al ancho de pantalla
- Los campos se apilan en vertical en móvil
- Campos cómodos para tocar
- Optimizado para iPhone y Android
Solución de problemas
El campo "URL del formulario" está vacío o muestra el placeholder
Solución: Debes pegar la URL de tu formulario SupportRetriever en los ajustes. Cópiala desde el panel de SupportRetriever.
El formulario no aparece o muestra "Formularioulario no encontrado"
Posibles causas:
- URL incorrecta (revisa errores)
- El formulario no existe o se eliminó
- Problema de permisos RLS (contacta con soporte)
Solución: Comprueba la URL; debe empezar por https://supportretriever.com/form/. Consulta Solucionar la extensión de tema.
El formulario se corta (muy bajo o muy alto)
Solución: Ajusta el control Altura del formulario en los ajustes del bloque. Sube a 1000px para ver el formulario completo.
El formulario aparece pero los envíos no funcionan
Posibles causas:
- Problema de carga de Turnstile (protección anti-bots)
- Límite de correos superado
- El navegador bloquea el envío
Solución: Revisa el panel de SupportRetriever por problemas de entrega. Consulta Solucionar la extensión de tema.
El formulario no carga o muestra errores
Posibles causas:
- URL del formulario incorrecta
- Problema de carga de Turnstile
- Problemas de conexión
Solución: Comprueba la URL en los ajustes del bloque y que coincida con la del panel de SupportRetriever. Consulta Solucionar la extensión de tema para más detalles.
Buenas prácticas
Para dueños de tienda
- Página de contacto dedicada: Un lugar claro para las consultas
- Altura 1000px: Así se ve el formulario completo sin desplazamiento
- Probar en móvil: Previsualiza en móvil antes de publicar
- Enlace en la navegación: Añade "Contacto" al menú principal apuntando a la página del formulario
Para equipos de soporte
- Revisar envíos: Consulta SupportRetriever con frecuencia
- Respuestas guardadas: Configura respuestas habituales para contestar más rápido
- Integración Shopify: Conecta tu tienda para ver datos de pedidos en las conversaciones
Para varias tiendas
Si gestionas varias tiendas Shopify:
- Usa una sola cuenta SupportRetriever para todas
- Crea formularios distintos por tienda (opcional)
- Usa correos destinatarios distintos por tienda (opcional)
- Añade el nombre de la tienda en los metadatos del formulario para filtrar
Siguientes pasos
Después de instalar el formulario:
- Pruébalo: Envía un mensaje de prueba para comprobar que funciona
- Personaliza: Ajusta colores y marca en los ajustes de SupportRetriever
- Configura el equipo: Añade a tu equipo de soporte en SupportRetriever
- Respuestas guardadas: Crea respuestas habituales para un soporte más rápido