ℹ️ 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 aumentar sua lista de e-mails diretamente da sua loja virtual? 🚀

A Email Collection Bar no app Hoppy Announcement Banner facilita a captura de e-mails dos visitantes e transforma navegantes casuais em assinantes — tudo sem sair da sua loja Shopify.

Depois de configurada, os clientes podem se inscrever diretamente na barra, e você pode até recompensá-los com um código de cupom automático para incentivar as inscrições ✨

✅ Antes de começar

Antes de criar sua Barra de Captura de E-mails, certifique-se de que:

• O app Hoppy Announcement Banner está instalado na sua loja Shopify
• O seu tema do Shopify tem o Announcement Banner app embed (incorporação do app Announcement Banner) ativado

Se você ainda não ativou a incorporação do app, vá para:

Shopify Admin (painel de administração do Shopify) → Sales Channels (Canais de venda) → Online Store (Loja online) → Themes (Temas) → Edit Theme (Editar tema) → App Embeds (Incorporações de apps)

Em seguida, ative a opção Announcement Banner e clique em Save (Salvar).

🛠️ Etapa 1 — Criar uma nova Barra de Captura de E-mails

Abra o app Hoppy Announcement Banner no seu Shopify Admin.

Depois:

→ Clique em Create New Announcement (Criar novo anúncio)

→ Selecione Email Collection Bar (Barra de captura de e-mails)

→ Escolha um Preset (Modelo predefinido) que combine com o estilo da sua loja, ou clique em Make your Own (Criar o seu próprio) para começar do zero

Assim que selecionado, a página de configuração será aberta automaticamente.

⚙️ Etapa 2 — Configurar o conteúdo

Depois de abrir a página de configuração, você estará na aba Content (Conteúdo).

Esta seção controla o que os visitantes veem e como o formulário de captura de e-mails se comporta.

🏷️ Nome do anúncio

Este campo é apenas para uso interno.

Os clientes nunca verão esse nome.

Use qualquer nome reconhecível, como:

• Newsletter Signup Bar (Barra de inscrição na newsletter)
• Welcome Offer Banner (Banner de oferta de boas-vindas)
• Email List Builder (Construtor de lista de e-mails)

💡 Usar nomes internos adequados facilita a identificação das configurações mais tarde, especialmente se sua loja executar várias campanhas.

📝 Título e subtítulo

Estas são as principais mensagens exibidas aos visitantes.

• Title (Título) — O título da sua barra de captura de e-mails. Use o editor de texto rich text para formatá-lo como quiser.
• Subheading (Subtítulo) — Uma mensagem de apoio abaixo do título (opcional).

Exemplo

• Title: "Junte-se à nossa lista VIP e ganhe 15% OFF"
• Subheading: "Seja o primeiro a saber sobre lançamentos e ofertas exclusivas"

💡 Um título claro e convincente ajuda a aumentar as taxas de inscrição 📈

🔘 Texto do botão

Este é o texto exibido no botão de inscrição ao lado do campo de e-mail.

Exemplos

• "Subscribe" (Inscrever-se)
• "Get My Discount" (Ganhar meu desconto)
• "Join the Club" (Entrar para o clube)
• "Claim Offer" (Resgatar oferta)

✉️ Placeholder de e-mail

Este é o texto de dica exibido dentro do campo de e-mail antes do visitante começar a digitar.

Exemplo

• "Enter your email" (Digite seu e-mail)
• "Your email address" (Seu endereço de e-mail)

🎉 Mensagem de sucesso

Esta mensagem aparece depois que um visitante envia o e-mail com sucesso.

Exemplo

• "Welcome aboard! Check your inbox for your discount code 🎉" (Bem-vindo! Verifique sua caixa de entrada para encontrar o código de desconto 🎉)
• "Thanks for subscribing!" (Obrigado por se inscrever!)

⚠️ Se você está oferecendo um código de cupom, é uma boa ideia mencioná-lo na mensagem de sucesso para que os clientes saibam o que esperar.

🏷️ Código de cupom

Quer recompensar novos assinantes com um desconto? Você pode adicionar um código de cupom que aparece depois que eles enviam o e-mail.

→ Insira o seu Coupon Code (Código de cupom)

→ Marque Show copy button (Mostrar botão de copiar) se quiser que os clientes copiem o código facilmente com um clique

⚠️ Importante:

• O código de cupom padrão "PROMO123" é apenas um placeholder e não funcionará no checkout, a menos que um desconto com esse código exista no Shopify.
• Observe que inserir um código de cupom no nosso app não cria automaticamente um desconto no Shopify.
• Antes de exibir um código de cupom pelo nosso app, você deve primeiro criar o desconto correspondente em Shopify Admin → Discounts. Depois que o desconto for criado, você pode usar o mesmo código no nosso app para exibi-lo aos clientes após a inscrição.

❌ Ícone de fechar

Ative esta opção se quiser que os visitantes possam dispensar a barra de captura de e-mails.

Quando ativada, você também pode controlar quando a barra reaparece:

• Appear again after (Reaparecer após) — Defina um número
• Unit (Unidade) — Escolha hours (horas) ou days (dias)

Isso ajuda a evitar incomodar visitantes recorrentes, enquanto ainda oferece a novos visitantes a chance de se inscreverem.

📋 Botão de copiar

Ative esta opção se quiser que os visitantes possam copiar o código de cupom.

Isso ajuda os visitantes a copiar o código de cupom com um clique, em vez de selecioná-lo manualmente.

🎨 Etapa 3 — Personalizar o design

Clique em Continue to design (Continuar para o design) para ir até a aba Design.

Aqui você pode controlar a aparência da sua barra de captura de e-mails:

• Posição (top push, bottom etc.)
• Cores e estilos de fundo
• Tamanhos de fonte e estilo do botão
• Bordas arredondadas e espaçamento
• Animações e comportamento fixo (sticky)

💡 Para uma explicação completa de cada opção de design, consulte nossa documentação de Design & Styling.

📍 Etapa 4 — Configurar exibição e segmentação

Abra a aba Placement (Exibição) para controlar onde e quando sua barra de captura de e-mails aparece.

📐 Posição de exibição

Esta configuração controla a localização física da barra na página.

• Top Push (Topo empurrando) — Empurra o restante do conteúdo da página para baixo. A barra fica no fluxo normal do documento.
• Top Push (Sticky) (Topo empurrando fixo) — Fica fixa na parte superior da tela enquanto o cliente rola. O conteúdo da página ainda é empurrado para baixo.
• Top Overlap (Topo sobreposto) — Flutua sobre a parte superior da página sem empurrar o conteúdo para baixo.
• Top Overlap (Sticky) (Topo sobreposto fixo) — Flutua na parte superior e permanece visível durante a rolagem.
• Bottom Overlap (Sticky) (Inferior sobreposto fixo) — Aparece na parte inferior da tela e permanece ali durante a rolagem.
• Manual (Manual) — Você controla exatamente onde a barra aparece usando um trecho de código ou bloco de app.

---

🌐 Segmentação por página

Escolha em quais páginas a barra de captura de e-mails deve aparecer:

• All pages (Todas as páginas)
• Homepage only (Apenas a página inicial)
• All product pages (Todas as páginas de produto)
• All collection pages (Todas as páginas de coleção)
• Specific products (Produtos específicos)
• Specific collections (Coleções específicas)
• Custom pages (Páginas personalizadas)

🌍 Segmentação por geolocalização

Por padrão, a barra aparece para todos os visitantes em todo o mundo.

Se quiser segmentar países ou regiões específicas:

→ Desative Allow all locations (Permitir todas as localizações)

→ Selecione os países onde deseja que a barra apareça

👥 Segmentação por cliente

Controle quem vê a barra de captura de e-mails com base no comportamento do cliente:

• All visitors (Todos os visitantes)
• Logged-in customers only (Apenas clientes logados)
• Logged-out visitors only (Apenas visitantes deslogados)
• Customers with specific tags (Clientes com tags específicas)
• Customers based on lifetime spend (Clientes com base no gasto vitalício)

💡 Por exemplo, você pode mostrar a barra apenas para novos visitantes que ainda não fizeram login, o que é ótimo para construir listas.

📅 Agendamento (Opcional)

Defina uma Start Date (Data de início) e uma End Date (Data de término) se quiser que a barra de captura de e-mails fique ativa durante um período específico de campanha.

Se nenhuma data for definida, a barra aparecerá imediatamente após ser publicada e permanecerá ativa até que você a despublique.

🔗 Etapa 5 — Ativar a sincronização com clientes do Shopify (Opcional)

Se desejar que os e-mails coletados sejam adicionados automaticamente à sua lista de Shopify Customers (Clientes do Shopify):

→ Vá até a seção Integrations (Integrações) dentro do app Hoppy Announcement Banner

→ Localize a integração Shopify customer list integration (Integração com lista de clientes do Shopify)

→ Ative-a e configure:

• Email Subscription (Assinatura de e-mail) — Escolha se os inscritos são marcados como Subscribed (Assinado) ou Not Subscribed (Não assinado) para marketing por e-mail

→ Clique em Save (Salvar)

Depois de ativada, cada e-mail enviado pela sua barra de captura será sincronizado como um perfil de cliente no Shopify.

Você também pode clicar em Sync previous emails (Sincronizar e-mails anteriores) para preencher retroativamente qualquer e-mail coletado antes de ativar essa integração.

💾 Etapa 6 — Salvar e publicar

Quando a configuração estiver concluída:

1. Clique em Save (Salvar) para armazenar sua configuração
2. Clique em Publish (Publicar) para deixar a barra de captura de e-mails ativa na sua loja virtual

⚠️ Apenas salvar não torna a barra visível para os clientes. Você deve publicá-la.

🎉 Resultado final

Depois de configurada com sucesso:

✅ Os visitantes veem uma barra de captura de e-mails chamativa na sua loja virtual
✅ Os e-mails são capturados diretamente pela barra
✅ Os assinantes veem uma mensagem de sucesso (e, opcionalmente, um código de cupom)
✅ Os e-mails são sincronizados automaticamente com os Clientes do Shopify (se a integração estiver ativada)
✅ Sua lista de e-mails cresce enquanto você foca em administrar sua loja 🚀

Usar a Email Collection Bar de forma eficaz pode ajudá-lo a construir um público fiel, aumentar as compras repetidas e elevar o valor vitalício do cliente ✨

Actualizado em: 10/09/2026