Cómo recoger feedback del cliente en un sitio de staging en WordPress, Webflow o Framer.

Un sitio de staging es una copia de la web visible solo para ti y tu cliente: un subdominio como staging.tucliente.com, una dirección de vista previa de tu constructor web o una versión protegida con contraseña del dominio real. Conseguir el feedback ahí, y no sobre diseños estáticos, detecta los problemas que solo aparecen en un sitio que funciona: palabras largas que rompen el diseño, fotos que se recortan mal en el móvil, formularios que envían a la dirección equivocada.

Primero, asegúrate de que el cliente puede abrirlo

Parece obvio, pero una cantidad sorprendente de revisiones se atasca en la pantalla de inicio de sesión. Antes de enviar cualquier enlace, compruébalo en una ventana privada del navegador, en tu teléfono, sin sesión iniciada en nada. Pregúntate:

• ¿La dirección funciona sin una cuenta del constructor web?
• ¿La contraseña es fácil de compartir y de escribir en un móvil?
• ¿Hay algo (un banner de cookies, una página de mantenimiento, un plugin de "próximamente") que tape el contenido?
• ¿Los buscadores se quedarán fuera? Un sitio de staging no debe indexarse. La mayoría de los constructores y WordPress tienen una opción para disuadir a los buscadores, o puedes proteger todo el staging con una contraseña.

WordPress y Elementor

El staging de WordPress suele estar en un subdominio o en una instalación aparte creada por tu hosting o por un plugin de staging. Los clientes no necesitan un usuario de WordPress para verlo. Si lo proteges, mejor una contraseña sencilla para todo el sitio que cuentas de usuario de WordPress, que añaden un paso de inicio de sesión que el cliente no necesita.

Para recoger el feedback tienes varias opciones: enviar capturas de pantalla, invitar al cliente a una llamada o instalar una herramienta de feedback. Tweakpin tiene un plugin gratuito para WordPress: instálalo desde Plugins → Add New (busca "Tweakpin") y pega tu línea en Settings → Tweakpin. También puedes pegar la línea en un plugin de código para cabecera y pie de página, en el Custom Code de Elementor Pro o en la cabecera de tu tema. En WordPress.com, los plugins requieren un plan de pago.

Webflow

Webflow da a cada sitio una dirección de staging gratuita en webflow.io, un lugar natural para las revisiones del cliente antes de que el dominio propio esté activo. Recuerda que el Webflow Designer es tu espacio de trabajo, no el del cliente; envíale en su lugar la dirección de staging publicada.

Para añadir una herramienta de feedback que funcione con un script, abre Site settings → Custom code → Footer code, pega la línea, guarda y publica. El código personalizado requiere un plan Site de pago. Publica primero en la dirección de staging, comprueba que la herramienta de feedback aparece ahí y luego comparte el enlace.

Framer

Los sitios de Framer se pueden publicar en una dirección gratuita de framer.app o en un dominio propio. Se aplica la misma regla: comparte el sitio publicado, no el editor. Para herramientas basadas en un script, abre Site Settings → General → Custom Code, pega la línea al final del body y publica.

Los sitios de Framer a menudo se comportan como aplicaciones de una sola página, con pantallas y secciones que cambian sin recargar la página entera. Si usas una herramienta de feedback, comprueba que los comentarios siguen unidos al elemento correcto cuando el cliente pasa de una pantalla a otra.

Shopify, Wix y Squarespace

La misma idea funciona en otros constructores, con menús distintos:

• Shopify: Online Store → Themes → Edit code → theme.liquid, justo antes de la etiqueta de cierre del body. Aparece en las páginas de tu tienda, no en el checkout de Shopify. Muchos estudios revisan en una vista previa de un tema sin publicar antes de activarlo.
• Wix: Settings → Custom Code → Add Custom Code, colocado en Body - end en todas las páginas. Requiere un plan Premium con un dominio conectado.
• Squarespace: Website → Website Tools → Code Injection → Footer. Code Injection requiere el plan Core o superior.

Qué decirle al cliente antes de empezar

Un sitio de staging parece terminado, y eso puede confundir. Di con claridad:

• Esto es una vista previa privada; los cambios aquí no afectan a la web actual.
• Algunas cosas pueden ser provisionales (y cuáles).
• Puede que los formularios todavía no envíen correos reales, o que te los envíen a ti.
• De qué trata esta ronda y la fecha límite para el feedback (consulta cómo hacer rondas de aprobación).

Mantén el feedback unido a la página

En staging, el sitio sigue cambiando mientras el cliente lo revisa. Las capturas de pantalla quedan desactualizadas enseguida, y un comentario como "la segunda foto" puede que mañana ya no señale la misma foto. Los comentarios fijados al elemento en la propia página, con la dirección de la página y el tamaño de pantalla registrados, se siguen entendiendo incluso después de que hayas movido cosas.

Del staging a la web publicada

Cuando el staging está aprobado, lo copias a la dirección definitiva, y por el camino pueden cambiar algunas cosas: ajustes propios del dominio, formularios, analítica, redirecciones. Haz una breve revisión final con el cliente en la web publicada antes de darla por terminada. La checklist de aprobación para el lanzamiento cubre qué revisar.

Dónde encaja Tweakpin

Tweakpin funciona en la dirección que añades, así que puedes añadir la dirección de staging (por ejemplo staging.tucliente.com) para la revisión y la definitiva después. Añades una línea de código o el plugin de WordPress y luego envías a tu cliente un enlace de revisión. Escribe su nombre y su correo (y una contraseña, si la configuraste) y puede empezar a fijar notas en la página enseguida, sin instalar nada. Las notas se quedan en el elemento al que se refieren, incluso en sitios de una sola página donde las pantallas cambian sin recargar.