Como colocar um pop-up em uma loja Shopify sem programador
Guia passo a passo para um pop-up na Shopify: instale uma linha, escreva o modal no editor do Clew e decida quando ele aparece — depois de alguns segundos, na deslocamento, numa visita de retorno — sem mexer no tema de novo.
- Tempo
- ● 10 minutos
- Preço
- Teste grátis de 14 dias, sem cartão
- Quem faz
- Dono da loja ou equipa com acesso ao tema
Exemplo: um pop-up na Shopify
Uma loja de roupas quer que quem volta saiba do portes grátis acima de 50 €, sem receber com uma camada quem chega pela primeira vez. O pop-up “Portes grátis acima de 50 € este mês” aparece nas coleções na segunda visita, uma vez, e o botão abre a página de portes.
Este formato faz parte do plano Pro. Toda conta nova começa com 14 dias de teste grátis com todos os formatos e regras de público, sem cartão. Quando o teste acaba, nada é apagado e o que foi publicado continua a aparecer; tours e tooltips continuam gratuitos no plano Free.
Como adicionar o pop-up na Shopify, passo a passo
- Passo 01
Copie o seu snippet do Clew
Crie uma conta gratuita (ou entre), adicione o seu site e abra Visão geral no admin. Clique na linha do cartão O widget ainda não deu sinal. para copiar: ela já vem com a chave real do seu site no lugar do marcador.
<!-- Clew: substitua COLE_AQUI_A_SUA_CHAVE pela chave do site em Admin > Visão geral --> <script src="https://tryclew.io/widget/COLE_AQUI_A_SUA_CHAVE.js" async></script>
Passo 1 · ilustração esquemática - Passo 02
Abra o código do tema
No admin da Shopify vá em Online Store → Themes, clique em … ao lado do tema publicado e escolha Edit code.
Passo 2 · ilustração esquemática - Passo 03
Cole a linha no theme.liquid
Abra
layout/theme.liquid, cole a linha do Clew logo antes de</head>e clique em Save. Ela carrega em todas as páginas da loja.
Passo 3 · ilustração esquemática - Passo 04
Verifique a loja
Abra a loja numa nova janela anónima (com a senha da loja, se ainda não foi lançada) e veja se as páginas carregam normalmente.
Passo 4 · ilustração esquemática - Passo 05
Escreva o pop-up no Clew
No Clew abra Fluxos → + Novo fluxo e escolha Formato Janela modal. Adicione um passo: um título curto, uma ou duas frases e, em Texto do link / URL do link, o texto do botão e a página que ele abre. O modal não precisa de seletor: sempre aparece centralizado.
Passo 5 · ilustração esquemática - Passo 06
Escolha onde, quando e para quem aparece
No mesmo editor, preencha Onde mostrar (URL da página), Quando mostrar, Segmentação de público e Frequência. Estas são as configurações do exemplo acima:
Configuração Valor Formato Janela modal Onde mostrar (URL da página) Secção por prefixo /collectionsQuando mostrar Na N.ª visita: 2 Segmentação de público Sem regras: toda nós que abre a página Frequência Uma vez por visitante 
Passo 6 · ilustração esquemática - Passo 07
Publique e verifique no site real
Mude Estado para Publicado e guarde. Abra a página numa janela anónima: o Clew lembra quem já viu um item de “uma vez”, por isso o seu navegador de sempre pode saltar. Visualizações, conclusões e abandonos aparecem nas estatísticas.
Passo 7 · ilustração esquemática
Armadilhas: pop-up na Shopify
O checkout fica fora do alcance
A Shopify não executa scripts do tema nas páginas de checkout, por isso um pop-up pode ficar em produto, coleção, carrinho e páginas de conteúdo, não no checkout. Planeje a mensagem antes de o cliente chegar lá.
MB Wayels personalizados não mostram interface
Settings → Customer events é executado código num sandbox sem acesso à página. Serve para analytics, não para um pop-up: use o theme.liquid.
Trocar de tema remove a linha
A linha fica no tema. Quando publicar um tema novo ou atualizado, cole de novo no theme.liquid dele.
Não empilhe com os pop-ups do construtor
Se o tema ou um plugin já mostra um pop-up de newsletter ou de cookies na mesma página, o visitante vê duas camadas. Desligue um deles ou dê ao Clew outro acionador (deslocamento ou segunda visita).
Perguntas e respostas
O pop-up pode mostrar um cupom?
Sim, como texto, por exemplo “Use PRIMAVERA10 no checkout”. O Clew não cria nem valida cupons: crie o desconto antes na Shopify.
Existe uma app do Clew para Shopify?
Não, e nem precisa: uma linha no theme.liquid é a instalação inteira. Não gera cobranças de app nem blocos de app no tema.
É possível mostrar o pop-up numa página só?
Sim. Instale a linha no site inteiro e escolha Caminho exato ou Secção por prefixo em Onde mostrar (URL da página). O pop-up não aparece em nenhuma outra página.
O pop-up é grátis?
O formato modal faz parte do Pro; contas novas têm 14 dias de teste com tudo, sem cartão. Tours e tooltips são grátis no plano Free.
Para onde o botão leva?
Para qualquer página que indicar em URL do link. Abre noutro separador, para o visitante não perder a página em que estava.
O que mais é possível adicionar na Shopify
- Como adicionar um tooltip em uma loja Shopify sem programador
- Como criar um aviso de paywall na Shopify sem programador
Pop-up em outras plataformas
- WordPressComo colocar um pop-up em um site WordPress sem programador
- WebflowComo colocar um pop-up em um site Webflow sem programador
- WixComo colocar um pop-up em um site Wix sem programador
- FramerComo colocar um pop-up em um site Framer sem programador
- Google Tag ManagerComo colocar um pop-up em seu site com o Google Tag Manager sem programador