Botão WhatsApp e Instagram Flutuante (código como instalar)

Aplicativos
1

Aprenda como instalar um botão FLUTUANTE do WhatsApp e do Instagram no canto inferior de todas as páginas da sua loja virtual.

A comunicação com o seu cliente vai ficar mais fácil, convertendo em mais vendas. E colocamos uma mensagem automática para você saber que estes clientes estão vindo do seu site:

“Oi! Vim do site e desejo receber atendimento”

Copie gratuitamente o meu código do botão flutuante do WhatsApp e Instagram: https://forms.gle/DKzDc2T4km1RniZ69

Confira como ficou os botões na minha loja: https://www.caverupa.com.br/

Dicas no vídeo:
0:00 Introdução
0:56 Como funciona o botão WhatsApp e Instagram no site
1:53 Como instalar botão flutuante do WhatsApp
4:35 Como mexer no código HTML e CSS do botão WhatsApp
7:10 Como personalizar o botão do WhatsApp

Ficou alguma dúvida? Comente aqui em baixo :grinning:

Te ajudei? Deixe um agradecimento!! :sparkles:

6 curtidas
2

Que conteúdo topppp @vitorbotegamarketing

1 curtida
3

Vitor bom dia! primeiro queria agradecer pelo ótimo conteúdo! Apenas fiquei com uma dúvida, o meu botão na versão Desktop do site funciona como o esperado. Porém na versão mobile o botão acaba ficando “atrás” de alguns elementos. Vou te mandar um print. Tem como fazer ele ficar na frente de todos os elementos do site? Notei que ele fica atrás dos banners.

foi esse o código que coloquei:

<!-- Inicio botão Whatsapp - Ajuda Vitor -->
<a href="https://wa.me/5512997375380?text=Oi!%20Vim%20do%20site%20e%20desejo%20receber%20atendimento" style="position:fixed;width:50px;height:50px;bottom:15px;right:15px;border-radius:50px;text-align:center;font-size:30px;box-shadow: 1px 1px 2px #888;
  z-index:1000;" target="_blank">
<img src="https://cdn.awsli.com.br/978/978650/arquivos/whatsapp.svg" width="60" height="60" alt="Fale Conosco pelo WhatsApp">
</a>
<!-- fim botão WhatsApp -->

Publicado no rodapé em todas as paginas como HTML

caso queira dar uma olhadinha, o site é www.webstorebrazil.com

Muito obrigado pela ajuda!!

IMG_0277.PNG
IMG_0277.PNG1242×2688 84.4 KB

1 curtida
4

vi que já resolveu o problema adicionando uma propriedade z-index no style.

image

5

Adorei pessoal, não conhecia essa propriedade z-index:999997;
Vou começar a usar
valeu!!

6

opa, boa noite vitor, vi que você colocou também o botão de ligação, como faço pro botão aparecer de baixo do whats?

image
image1920×1080 164 KB

7

Como faço para mudar o botão de lugar?

8

Manda um print para onde quer colocar

9

Arrumei ja, tem codigo para colocar um botão de troca e devolução?

1 curtida
10

Vou te chamar no privado.