como adicionar um botão Flutuante do whatsApp na loja integrada (Plano Gratuito)

Para instalar um botão flutuante do WhatsApp na Loja Integrada siga o passo a passo a seguir.

Ajuste o código com a url gerada

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<a href="https://wa.me/5511999999999" class="whatsapp-button" target="_blank" rel="noopener">
        <i class="fab fa-whatsapp"></i>
</a>
<style>
.whatsapp-button {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    font-size: 30px;
    line-height: 60px;
    box-shadow: 2px 2px 3px #999;
    z-index: 1000;
    text-decoration: none;
}

.whatsapp-button i {
    line-height: 60px;
}

.whatsapp-button:hover {
    background-color: #1ebd5b;
    box-shadow: 2px 2px 5px #555;
}

</style>

Você vai precisar ajustar o Telefone no código, com o seu número. Está em negrito para facilitar.

Adicione o código no painel da loja integrada

No painel acesse a página para incluir código HTML na Loja Integrada.

Preencha uma descrição e deixe os campos como estão. Em conteúdo adiciona o código que você ajustou anteriormente e clique em “Criar código”.

Pronto, seu botão flutuante do WhatsApp deve estar funcionando!

Veja o resultado final (exemplo)

Conteúdo criado por…

Pedro Licio

Analista de Sistemas, pós-graduado pela PUC-RJ, expert prata oficial em produtos do Google Ads (Product Expert desde 2021 ), trabalha com E-commerces desde 2014, é ex lojista Top Seller da LI, vendeu sua loja e através de sua experiência como empreendedor digital, presta consultoria a lojistas dos mais diversos segmentos.

Siga-Me