đ Como configurar um formulĂĄrio popup
âčïž Note: Este artigo foi traduzido automaticamente utilizando IA e pode conter imprecisĂ”es. Se algo parecer errado, entre em contato com nossa equipe de suporte.
Quer coletar e-mails, nĂșmeros de telefone ou qualquer detalhe personalizado certo quando os compradores estĂŁo mais envolvidos? đ
Isso Ă© exatamente o que o FormulĂĄrio de contexto em Hoppy Popups Ă© construĂdo para. Ele permite que vocĂȘ crie um formulĂĄrio de inscrição totalmente personalizĂĄvel que aparece em qualquer lugar em sua loja â e transforma visitantes casuais em assinantes que vocĂȘ pode comercializar mais tarde âš
Com um formulĂĄrio Popup, vocĂȘ pode coletar:
- đ§ Endereços de e-mail para sua newsletter
- đ± NĂșmeros de telefone para atualizaçÔes SMS
- đ Detalhes personalizados como aniversĂĄrios, preferĂȘncias ou tamanhos
- đ Recompensa novas inscriçÔes com um cĂłdigo de desconto automĂĄtico
Este guia orienta vocĂȘ atravĂ©s da configuração de seu primeiro Popup Form passo a passo, usando apenas as configuraçÔes que vocĂȘ realmente precisa para obtĂȘ-lo ao vivo.
â ïž Antes de começar
Antes de configurar o formulĂĄrio Popup, certifique-se:
- A Hoppy Popups app estĂĄ instalado no seu Shopify guardar
- A Aplicativo Incorporar estĂĄ habilitado no seu tema (configuração Ășnica â coberto abaixo)
- VocĂȘ sabe que informaçÔes vocĂȘ quer coletar de compradores
Opcional, mas Ăștil para decidir com antecedĂȘncia:
- đ Um cĂłdigo de desconto que vocĂȘ gostaria de recompensar novos assinantes com
- đ Onde os assinantes devem ser armazenados (dentro do aplicativo, ou sincronizados com uma ferramenta de e-mail como Klaviyo)
âčïž Este guia centra-se na FormulĂĄrio de contexto tipo, que suporta campos de formulĂĄrio personalizados. A Captura de E- mail PopUp funciona quase da mesma forma â simplesmente salta os campos personalizados â para que vocĂȘ possa seguir estes passos para isso tambĂ©m.
â Passo inicial â Habilitar a incorporação da aplicação
Para que qualquer popup apareça em seu storefront, o aplicativo embed deve ser ativado dentro de seu Shopify tema.
Ir para:
Shopify Admin â Loja online â Temas â Personalizar â App Incorpora
Depois:
- Procurar Hoppy Popups
- Alternar ON
- Clique Gravar
đĄ SĂł precisas de fazer isto uma vez. Se nĂŁo estiver activado, Hoppy Popups tambĂ©m irĂĄ lembrĂĄ-lo com um banner antes de publicar â para que vocĂȘ nĂŁo perca.
đ ïž Passo 1 â Criar um novo formulĂĄrio popup
Abrir o Hoppy Popups app a partir da sua Shopify Admin.
Depois:
â Clique Criar uma nova janela
Isto abre o Escolher Tipo de Pop-up ecrĂŁ.
â Encontrar o FormulĂĄrio de contexto cartĂŁo â Clique Criar um FormulĂĄrio Popup
A pågina de configuração abre automaticamente com:
- A ConteĂșdo tab â o que o formulĂĄrio diz e recolhe
- A Desenho tab â como se parece o popup
- A Colocação tab â quando e onde aparece
- A Visualização ao vivo Ă direita, para que vocĂȘ possa ver mudanças Ă medida que vai đ
đ Passo 2 â Adicione seu ConteĂșdo do FormulĂĄrio
Começas por dentro. ConteĂșdo tab. Isso controla os compradores de texto e as informaçÔes que seu formulĂĄrio coleta.
đ·ïž Nome do formulĂĄrio popup
Este nome Ă© apenas para sua referĂȘncia interna.
Os compradores nunca o verĂŁo.
Use algo reconhecĂvel, como:
- Inscrição da Newsletter Pågina inicial
- FormulĂĄrio do clube de aniversĂĄrio
- Popup de Desconto de Boas-vindas
đĄ Nomeação clara torna muito mais fĂĄcil gerenciar vĂĄrios popups mais tarde.
đŹ & Descrição do TĂtulo
Esta Ă© a mensagem principal de compradores ver no topo do popup.
Exemplo
- TĂtulo: "Junte-se ao nosso clube de aniversĂĄrio đ"
- Descrição: "Assine-se e receba um presente especial no seu aniversårio."
Seja breve, amigĂĄvel e focado no benefĂcio de se inscrever.
VocĂȘ tambĂ©m pode adicionar um Logotipo acima do tĂtulo se vocĂȘ gostaria que o popup para se sentir mais on-brand.
đ§ Campo de E- mail
Este Ă© o nĂșcleo da maioria dos formulĂĄrios de inscrição.
Quando Mostrar campo de e- mail estĂĄ ligado, aparecem dois campos adicionais:
- Substituição do campo de e- mail â o texto da dica dentro da caixa, por exemplo, "Enter seu email"
- Mensagem de erro â mostrado se um comprador entra em um e-mail invĂĄlido
đ± Telefone / Campo SMS
Ligar Mostrar o Campo do NĂșmero de Telefone (SMS) se vocĂȘ tambĂ©m quiser coletar nĂșmeros de telefone.
Quando habilitado, aparecem mais algumas opçÔes:
- CĂłdigo padrĂŁo do paĂs â prĂ©-seleciona o paĂs para o nĂșmero de telefone
- placeholder do campo do telefone
- Mensagem de erro do telefone
Isso Ă© Ăștil se vocĂȘ planeja enviar ofertas de SMS ou encomendar atualizaçÔes mais tarde đČ
đ§© Campos de FormulĂĄrio Personalizados
Isto Ă© o que faz o FormulĂĄrio de contexto especial â vocĂȘ pode pedir quase tudo, nĂŁo apenas um e-mail.
â Clique Adicionar campo para criar uma nova pergunta
Para cada campo, escolha um Tipo de Campo:
- Campo de texto
- MĂșltiplas linhas
- BotÔes de rådio
- Caixas de seleção
- Largar
- Multi- selecção
- NĂșmero
- Ligação
- Envio do arquivo
- Data
- Tempo
- Classificação
EntĂŁo dĂȘ-lhe um Legenda â esta Ă© a pergunta que os compradores vĂȘem, como "Seu aniversĂĄrio" ou "Como vocĂȘ ouviu sobre nĂłs?".
Dependendo do tipo de campo, algumas opçÔes extras aparecem automaticamente:
- đ Posicionador â aparece para campos baseados em texto (texto, mĂșltiplas linhas, nĂșmero, link, tempo)
- â OpçÔes â aparece para campos de escolha (rĂĄdio, caixas de seleção, dropdown, multi-selecionado), onde vocĂȘ adiciona as respostas que os compradores podem escolher
- â Requerido â ligue isso se os compradores devem responder antes de enviar
â ïž O seu formulĂĄrio deve incluir pelo menos um destes: um campo de Email, um campo de Telefone ou um campo Personalizado. Caso contrĂĄrio, nĂŁo hĂĄ nada para os compradores preencherem.
đĄ Um novo formulĂĄrio Popup jĂĄ começa com um campo de Email, um campo Telefone e uma amostra AniversĂĄrio campo de data â para que vocĂȘ possa lançar rapidamente e ajustar a partir daĂ.
đ Enviar Texto do BotĂŁo
Este Ă© o botĂŁo clientes clique para enviar o formulĂĄrio.
Definir a Texto do Botão para algo focado na ação, como:
- "Assine-me"
- "Pegue o meu desconto"
- "Junte-se ao Clube"
Quando o seu formulĂĄrio tem campos, este botĂŁo automaticamente Apresenta O formulĂĄrio â nĂŁo Ă© necessĂĄria uma configuração suplementar.
âïž Caixa de Verificação de Opt- In (Opcional)
VocĂȘ pode adicionar um Caixa de Verificação de Opt- In assim os compradores concordam ativamente em receber marketing de vocĂȘ.
Quando ligado, um Texto opt- in o editor aparece onde vocĂȘ pode escrever sua mensagem de consentimento, como:
"Sim, envie-me ofertas exclusivas e atualizaçÔes."
Isso ajuda vocĂȘ a coletar consentimento de marketing claro e permanecer em conformidade đ
đ Passo 3 â Definir o que acontece apĂłs a inscrição
Depois de um comprador enviar o formulĂĄrio, o popup muda para um estado de sucessoEsta Ă© sua chance de agradecer - lhes â e recompensĂĄ - los.
VocĂȘ vai encontrar estas configuraçÔes no fundo do ConteĂșdo tab.
đ & Descrição da Mensagem de Sucesso
Escreva a mensagem de agradecimento aos compradores ver logo apĂłs o envio.
Exemplo
- Mensagem de Sucesso: "EstĂĄs dentro! đ"
- Descrição do Sucesso: "Aqui estå a tua recompensa por te juntares a nós."
đ Recompensa Com um Desconto (Opcional)
Uma pequena recompensa pode aumentar drasticamente as inscriçÔes.
âčïž Este campo estĂĄ disponĂvel uma vez Mostrar o CĂłdigo de CupĂŁo Ă© alternado para SIM.
Para exibir um cĂłdigo de cupom, vocĂȘ pode:
- Selecione um dos cĂłdigos de cupons em que vocĂȘ criou Shopify Admin â Descontos clicando em Selecionar / Mudar Desconto.
- VocĂȘ pode criar um novo clicando em Criar um novo desconto.
Exemplo
- SAVE10
- Bem-vindo20
- COUPON123
đž Aplicação de Desconto
Esta opção controla como o desconto é aplicado. Tem duas opçÔes:
- O cliente terĂĄ que aplicar o desconto manualmente â o cliente terĂĄ de indicar o cĂłdigo do cupĂŁo durante o checkout para receber o desconto.
- Aplicar o Desconto automaticamente â o desconto serĂĄ aplicado automaticamente durante o check-out sem que o cliente tenha de introduzir o cĂłdigo do cupĂŁo.
â ïž Importante:
- Nosso aplicativo nĂŁo cria ou gerencia cĂłdigos/descontos de cupom. VocĂȘ deve criĂĄ-los em Shopify Admin â Descontos antes de usĂĄ-los no popup.
âĄïž BotĂŁo de Sucesso (Opcional)
VocĂȘ tambĂ©m pode mostrar um botĂŁo na tela de sucesso.
Ligar Mostrar o botĂŁo CTA de sucesso, e dois campos aparecem:
- Texto do BotĂŁo de Sucesso â Por exemplo, "Começar as compras"
- Ligação do BotĂŁo de Sucesso â onde o botĂŁo deve levar compradores
Esta Ă© uma boa maneira de enviar novos assinantes diretamente para uma pĂĄgina de coleção ou venda đïž
âčïž Cada inscrição Ă© salva automaticamente dentro Hoppy Popups â Assinantes. Se vocĂȘ quiser assinantes enviados para uma ferramenta de e-mail como Klaviyo ou Mailchimp, vocĂȘ pode conectĂĄ-lo no Integração tab â consulte o guia dedicado de Integraçãos para configuração.
đ Passo 4 â Escolha quando e onde aparece
Agora abra o Colocação tab. Isto controla o tempo, frequĂȘncia e localização do popup.
Quando deve aparecer? (Trigger)
Escolher um Tipo de gatilho, em seguida, utilizar Mostrar o Aparecer Depois afinar o momento:
- ApĂłs o Tempo (duração) â imediatamente, ou apĂłs alguns segundos na pĂĄgina
- Rolo da PĂĄgina â depois de um cliente pergaminhos a meio caminho para baixo
- Intenção de saĂda â quando um comprador estĂĄ prestes a sair
- O botĂŁo Adicionar ao carrinho Ă© clicado â quando um item Ă© adicionado, ou quando o carrinho passa um valor
- ApĂłs as visualizaçÔes das pĂĄginas â depois que um comprador vĂȘ um certo nĂșmero de pĂĄginas
Alguns gatilhos revelam opçÔes extras â por exemplo, Intenção de saĂda permite escolher o que "deixar" significa, e Adicionar ao carrinho permite- lhe reagir a um valor mĂnimo do carrinho.
đĄ Um pequeno atraso (alguns segundos) Ă© um padrĂŁo amigĂĄvel â dĂĄ aos compradores um momento para olhar em volta antes do formulĂĄrio aparecer.
đ Com que freqĂŒĂȘncia deve mostrar?
Embaixo Configuração da Visualização, escolha com que frequĂȘncia o popup volta:
- Mostrar todas as vezes â aparece em cada visita
- Uma vez de cada vez que alguĂ©m visita â uma vez por visita, e pĂĄra apĂłs o formulĂĄrio Ă© submetido
- FrequĂȘncia limite â depois de estar fechado, espere um nĂșmero de dias antes de mostrar novamente
âčïž Uma vez que um comprador envia o formulĂĄrio, o popup pĂĄra de mostrar-lhes automaticamente â para que vocĂȘ nunca pergunte duas vezes.
đ Onde Deve Aparecer?
Utilização Mostrar Ligado para escolher as påginas onde o formulårio aparece:
- Cada pĂĄgina
- Apenas na pĂĄgina inicial
- Todas as pĂĄginas do produto
- PĂĄginas especĂficas do produto
- ColeçÔes, ou coleçÔes especĂficas
- Produtos com etiquetas especĂficas
Quando vocĂȘ escolhe uma opção especĂfica (como um produto ou coleção), um seletor aparece para que vocĂȘ possa escolher exatamente qual.
đ Posição
Escolha onde estĂĄ a janela:
- Centro para um clåssico, atenção-agarrando popup
- A canto (como a parte inferior direita) para uma sensação mais suave, slide-in
âčïž A visibilidade do dispositivo (Desktop, Mobile, ou ambos) estĂĄ definida no Desenho tab. Regras mais avançadas â como segmentação pelo status de login do cliente, tags, tempo de vida Ăștil, paĂs ou fonte UTM â tambĂ©m estĂŁo disponĂveis. Estes sĂŁo abrangidos pelo Alvo guia para que esta configuração permanece simples.
đ A fazer uma campanha de tempo limitado? VocĂȘ pode adicionar um Iniciar e Fim data em que Agendamento. Por padrĂŁo, o formulĂĄrio Ă© executado continuamente (começa agora, nunca termina). Ver Agendamento guia para campanhas datadas.
đš Passo 5 â Style the Popup (Opcional)
Abrir o Desenho aba para fazer o popup corresponder Ă sua marca.
Aqui vocĂȘ pode ajustar rapidamente coisas como:
- A Modelo para começar a partir de um look pronto
- A Tamanho do Popup e estilo de posição
- Cores, fontes, e espaçamento
- A botĂŁo e campo de entrada estilo
- A Sobreposição de fundo e entrada animação
VocĂȘ nĂŁo precisa tocar em nada disso para ir ao vivo â os padrĂ”es ficam Ăłtimos fora da caixa âš
Para uma anålise completa de cada opção de styling, ver o Desenho & Styling guia. Para ajustes avançados, o CSS Personalizado guia permite-lhe ajustar detalhes com o seu próprio código.
â Passo 6 â Salvar e Publicar
Uma vez que tudo fica bem na pré-visualização:
- Gravar o seu formulĂĄrio de contexto
- Clique Publicar para tornĂĄ-lo vivo em sua loja
â ïž Salvar sozinho faz nĂŁo Publicar o formulĂĄrio. Sempre clique Publicar Quando estiveres pronto para os clientes verem.
ApĂłs a publicação, o crachĂĄ de status do popup atualiza para que vocĂȘ possa ver rapidamente se Ă© Publicado, NĂŁo publicado, Agendadoou Expirado.
đĄ Se o aplicativo incorporado ainda nĂŁo estiver habilitado, Hoppy Popups MostrarĂĄ um lembrete com Activar a Entrada da Aplicação botĂŁo logo apĂłs vocĂȘ publicar â basta segui-lo e vocĂȘ estĂĄ definido.
đĄ Dicas Ășteis
- Teste seu formulĂĄrio abrindo sua loja em um IncĂłgnito / Privado janela e envio de um e- mail de teste â entĂŁo verifique Assinantes para confirmar que chegou
- Mantenha formulĂĄrios curtos â pedindo apenas um e-mail geralmente recebe mais inscriçÔes đ
- Certifique-se de que pelo menos um campo (e-mail, telefone ou personalizado) esteja ligado, ou que o formulĂĄrio nĂŁo possa ser enviado
- Quer o formulĂĄrio em outra lĂngua? VocĂȘ pode adicionar traduçÔes na TraduçÔes secção â ver o guia de tradução dedicado
đ Resultado Final
Uma vez configurado e publicado:
â Os compradores vĂȘem um belo formulĂĄrio de inscrição na marca
â Emails, nĂșmeros de telefone e detalhes personalizados sĂŁo coletados automaticamente
â Novos assinantes podem receber instantaneamente uma recompensa de desconto
â O formulĂĄrio aparece na hora certa, nas pĂĄginas certas
â Cada inscrição Ă© salva e pronta para sincronizar com suas ferramentas de marketing
Uma forma popup bem configurada Ă© uma das maneiras mais fĂĄceis de aumentar seu pĂșblico e transformar visitantes pela primeira vez em clientes de longo prazo đ
Actualizado em: 10/09/2026
Obrigado!