Como receber feedback do cliente no site de homologação no WordPress, Webflow ou Framer.

Um site de homologação (ou staging) é uma cópia do site que só você e o cliente conseguem ver: um subdomínio como staging.seucliente.com.br, um endereço de prévia da sua ferramenta ou uma versão protegida por senha do domínio real. Receber feedback ali, e não em layouts estáticos, pega os problemas que só aparecem num site funcionando: palavras longas que quebram o layout, fotos que ficam mal cortadas no celular, formulários que enviam para o endereço errado.

Primeiro, garanta que o cliente consegue abrir

Parece óbvio, mas muitas revisões travam na tela de login. Antes de mandar qualquer link, teste numa janela anônima, no seu celular, deslogado de tudo. Pergunte a si mesmo:

• O endereço funciona sem conta na ferramenta de criação do site?
• A senha é fácil de passar e de digitar no celular?
• Alguma coisa (um banner de cookies, uma página de manutenção, um plugin de "em breve") cobre o conteúdo?
• Os buscadores vão ficar de fora? Um site de homologação não deve ser indexado. A maioria das ferramentas e o WordPress têm uma opção para desencorajar os mecanismos de busca, ou você pode proteger todo o site de homologação com senha.

WordPress e Elementor

A homologação no WordPress normalmente fica num subdomínio ou numa instalação separada, criada pela sua hospedagem ou por um plugin de staging. O cliente não precisa de login no WordPress para ver. Se for proteger, prefira uma senha simples para o site inteiro em vez de contas de usuário do WordPress, que adicionam uma etapa de login de que o cliente não precisa.

Para receber feedback, você tem algumas opções: mandar prints, chamar o cliente para uma reunião ou instalar uma ferramenta de feedback. O Tweakpin tem um plugin gratuito para WordPress: instale em "Plugins → Add New" (o mesmo menu em português no seu painel; busque "Tweakpin") e cole a sua linha em "Settings → Tweakpin". Você também pode colar a linha num plugin de código para cabeçalho e rodapé, no Custom Code do Elementor Pro ou no cabeçalho do seu tema. No WordPress.com, plugins exigem um plano pago.

Webflow

O Webflow dá a todo site um endereço de staging gratuito em webflow.io, que é o lugar natural para a revisão do cliente antes de o domínio próprio entrar no ar. Lembre que o Webflow Designer é o seu espaço de trabalho, não o do cliente; mande para ele o endereço de staging publicado.

Para adicionar uma ferramenta de feedback que roda por script, abra "Site settings → Custom code → Footer code", cole a linha, salve e publique. Código personalizado exige um plano Site pago. Publique primeiro no endereço de staging, confira se a ferramenta de feedback aparece ali e só então compartilhe o link.

Framer

Sites no Framer podem ser publicados num endereço gratuito framer.app ou num domínio próprio. A regra é a mesma: compartilhe o site publicado, não o editor. Para ferramentas que usam script, abra "Site Settings → General → Custom Code", cole a linha no fim do body e publique.

Sites no Framer muitas vezes se comportam como aplicações de página única, com telas e seções que mudam sem recarregar a página inteira. Se usar uma ferramenta de feedback, confira se os comentários continuam presos ao elemento certo quando o cliente navega entre as telas.

Shopify, Wix e Squarespace

A mesma ideia funciona em outras ferramentas, com menus diferentes:

• Shopify: "Online Store → Themes → Edit code → theme.liquid", logo antes da tag de fechamento do body. Aparece nas páginas da sua loja, não no checkout da Shopify. Muitos estúdios fazem a revisão na prévia de um tema não publicado antes de colocá-lo no ar.
• Wix: "Settings → Custom Code → Add Custom Code", na posição "Body - end", em todas as páginas. Exige um plano Premium com domínio conectado.
• Squarespace: "Website → Website Tools → Code Injection → Footer". O Code Injection exige o plano Core ou superior.

O que avisar ao cliente antes de ele começar

Um site de homologação parece pronto, e isso pode confundir. Deixe claro:

• Esta é uma prévia privada; mudanças aqui não afetam o site atual.
• Algumas coisas podem ser provisórias (e quais são).
• Os formulários talvez ainda não enviem e-mails de verdade, ou talvez enviem para você.
• Sobre o que é esta rodada e até quando você precisa do feedback (veja como fazer rodadas de aprovação).

Mantenha o feedback preso à página

Na homologação, o site continua mudando enquanto o cliente revisa. Prints ficam desatualizados rápido, e um comentário como "a segunda foto" pode não apontar mais para a mesma foto amanhã. Comentários fixados no próprio elemento da página, com o endereço da página e o tamanho da tela registrados, continuam compreensíveis mesmo depois de você mudar as coisas de lugar.

Da homologação para o ar

Quando o site de homologação é aprovado, você o copia para o endereço definitivo, e algumas coisas podem mudar no caminho: configurações ligadas ao domínio, formulários, analytics, redirecionamentos. Faça uma conferência final rápida no site no ar com o cliente antes de dar como concluído. O checklist de aprovação para o lançamento mostra o que olhar.

Onde o Tweakpin entra

O Tweakpin roda no endereço que você adiciona, então você pode adicionar o endereço de homologação (por exemplo staging.seucliente.com.br) para a revisão e o definitivo depois. Você adiciona uma linha de código ou o plugin para WordPress e manda um link de revisão para o cliente. Ele digita o nome e o e-mail (e uma senha, se você definir uma) e já pode começar a fixar comentários na página, sem instalar nada. Os comentários ficam no elemento a que se referem, mesmo em sites de página única em que as telas mudam sem recarregar.