Como adicionar um banner personalizado a um site Shopify

Um banner promocional chamativo é um dos fatores mais poderosos de conversão para lojas online. É a primeira coisa que o cliente vê ao abrir o seu site, então uma chamada para ação (CTA) clara pode melhorar significativamente as taxas de adição ao carrinho e as vendas em geral. Seja para levar os clientes a uma promoção de Black Friday, anunciar o valor mínimo para frete grátis ou captar leads em troca de um cupom de desconto, o banner promocional é uma das melhores ferramentas para isso.

Mas por que usar apenas um banner estático? Um cronômetro regressivo pode criar senso de urgência, conteúdos de mídia avançados podem dar mais impacto ao banner e um formulário de captura de e-mail pode gerar leads imediatamente. Infelizmente, a Shopify não facilita a inclusão de nenhum desses recursos. Os temas OS 2.0 da Shopify incluem seções nativas de “barra de anúncios” e “barra de imagem”, mas elas se limitam a um texto simples na parte superior da página e a duas imagens estáticas, algum texto e dois botões no banner. 

Se você quer incorporar um banner promocional na Shopify com um formulário de captura de leads que seja exibido de forma diferente em dispositivos móveis e desktop, ou que tenha um cronômetro regressivo ou um vídeo, não é possível fazer isso sem escrever Liquid e JavaScript personalizados. O Shopify Magic, o construtor com IA da Shopify, pode gerar um banner personalizado em Liquid na Shopify, mas não oferece suporte. E, a menos que você entenda o código criado pelo Shopify Magic, a velocidade e a acessibilidade da sua loja podem ser prejudicadas. 

Isso deixa a maioria dos lojistas com duas opções: instalar um aplicativo premium de terceiros da Shopify App Store ou usar um widget gratuito, leve e sem servidor, que protege a velocidade da sua página e a arquitetura do seu tema. 

Vamos ver como adicionar um banner a um site da Shopify.

Opção 1: instale uma integração dedicada da Shopify App Store

Adicionar uma barra de anúncios da Shopify à sua loja com um aplicativo de banner ou pop-up de terceiros é eficaz, mas tem suas desvantagens. Falaremos mais sobre isso adiante.

Veja como configurar: 

1. Acesse a Shopify App Store e procure um aplicativo de banner ou pop-up. Eu escolhi o Essential Announcement Bar, mas você pode escolher qualquer aplicativo de sua preferência. 

2. Clique em Instalar. 

3. Siga o guia de integração ou de configuração, caso exista, para entender o básico do plug-in. 

4. Configure seu banner ou pop-up no aplicativo. Você pode personalizar o texto, o design, o posicionamento e outros recursos. Quando terminar, clique em Publicar.

A barra de anúncios ou o pop-up agora aparecerá na sua loja. Até aqui, tudo bem. 

No entanto, cada aplicativo que você instala na sua loja da Shopify adiciona seu próprio CSS e JavaScript à vitrine. Isso pode afetar as Core Web Vitals, deixar o site mais lento, causar travamentos durante o processo de checkout e prejudicar o seu ranqueamento de SEO. Embora adicionar um único aplicativo raramente seja um problema, instalar dezenas deles pode ter um impacto real. Se você consegue fazer algo sem instalar um aplicativo, sobra mais espaço para instalar os aplicativos realmente necessários. 

Além disso, os aplicativos de terceiros da Shopify podem exigir assinaturas pagas. Uma versão gratuita provavelmente terá recursos limitados, funcionará apenas para as primeiras 1.500 impressões por mês, incluirá uma marca d’água ou, de alguma outra forma, não será muito eficaz. Se você quer recursos avançados ou simplesmente um banner limpo, sem marca, que suporte o alto tráfego de datas comemorativas, normalmente é preciso pagar uma mensalidade. 

Se você quer garantir que o seu banner faça o que você precisa e seja visível para todos os seus clientes, sem pagar mensalidade, existe uma opção melhor. 

Opção 2: adicione um widget de banner interativo e gratuito (recomendado)

Se você quer um banner dinâmico e de alta conversão, com mídia avançada, cupons, formulários e cronômetros regressivos, sem pagar uma assinatura mensal, deixar o site mais lento ou se preocupar com as Core Web Vitals, a opção mais inteligente é usar um embed hospedado confiável, como o Widget de Banner da Jotform. Todo o trabalho pesado acontece fora da sua loja da Shopify, então você obtém um banner impecável e responsivo, sem nenhuma das desvantagens de usar um aplicativo de terceiros instalado. É o melhor widget de banner gratuito para a Shopify. 

Veja como configurar:

1. Acesse o Widget de Banner da Jotform e faça login na sua conta da Jotform. Se você ainda não tem uma, pode se cadastrar gratuitamente.

2. Adicione um selo, um título e uma descrição ao seu banner. Você pode tornar o banner inteiro clicável e incluir recursos como botão de CTA, cronômetro regressivo, cupom e formulário de captura de e-mail. 

3. Use a guia Estilo para ajustar a aparência do seu banner. Você pode definir uma fonte personalizada, usar CSS personalizado e desativar a marca da Jotform.

4. Use a guia Layout para controlar como os elementos aparecem no seu banner. Você também pode definir se ele ficará visível em computadores, dispositivos móveis ou em ambos. 

5. Acesse a guia Configurações, onde você pode dar um título ao seu banner. Também é possível ativá-lo ou desativá-lo, o que é útil se você quiser criar banners de promoções de datas comemorativas com antecedência. 

6. Acesse a guia Publicar e clique em Copiar código para obter o código de incorporação do seu banner. 

7. Volte para a Shopify. Selecione Loja virtual na barra lateral e, em seguida, Editar tema. 

8. Clique em Adicionar seção e, depois, em Liquid personalizado. 

9. Cole o código de incorporação na caixa Liquid personalizado. Depois, você pode posicionar o banner de anúncio onde quiser e também configurar a aparência dele. 

10. Quando terminar, clique em Salvar e o seu banner estará no ar no seu site. 

A maior vantagem do Widget de Banner da Jotform é que você tem um controle visual incomparável sobre o banner, sem precisar de uma assinatura premium nem de conhecimentos de programação. Com o editor fácil de usar, você pode personalizar a imagem de fundo do banner ou até incorporar um vídeo do YouTube ou do Vimeo. Também é possível adicionar botões de CTA, um cronômetro regressivo ou um formulário de inscrição por e-mail, tudo sem nenhum custo.

Para instalar o seu banner personalizado na Shopify, basta copiar e colar o código de incorporação na plataforma. Como a Jotform cria o banner fora do seu servidor, ele não entra em conflito com os estilos globais do site da Shopify nem afeta a velocidade de carregamento das suas páginas. Você ganha um banner poderoso que mantém suas campanhas funcionando sem problemas. 

Turbine sua loja da Shopify com widgets inteligentes e sem servidor

O diretório de Widgets para Sites da Jotform reúne ótimos widgets gratuitos para sites, incluindo o Widget de Banner da Jotform. Com os widgets da Jotform, o seu widget de feed do Instagram pode mostrar o seu produto em uso, os depoimentos podem destacar a popularidade dele, as notificações de vendas podem dar destaque a cada venda e uma tabela de medidas pode ajudar os clientes a encontrar o tamanho ideal do produto. Muitas outras ferramentas gratuitas podem maximizar suas conversões de adição ao carrinho, mantendo sua loja rápida e leve.

Ao eliminar parte do trabalho de vender na Shopify, os Widgets para Sites da Jotform permitem que você concentre seu tempo e seu orçamento em buscar bons produtos, fazer marketing online e construir uma loja virtual de sucesso. Você não precisa pagar por um simples banner em uma página de produto. 

Se você quer fazer mais com a Shopify, conheça a integração completa da Jotform com a Shopify. Com ela, você pode adicionar formulários à sua loja da Shopify, receber pagamentos e muito mais.