Botão de Grupo do Wathsapp no Blogger

Como colocar um botão de grupo do Wathsapp no Blogger.

---------------------------------------------------

Primeiramente, você vai precisar do link do seu grupo. 

Esse link pode ser pego pelo celular ou pelo computador. 

Vou mostrar como verificar o link das duas formas. 

---------------------------------------------------

Link Pelo Celular

como-colocar-um-botao-de-grupo-do-wathsapp-no-blogger+como-colocar-um-botao-de-grupo-do-wathsapp-no-blogger

como-colocar-um-botao-de-grupo-do-wathsapp-no-blogger +como-colocar-um-botao-de-grupo-do-wathsapp-no-blogger


Link Pelo Computador

como-colocar-um-botao-de-grupo-do-wathsapp-no-blogger

como-colocar-um-botao-de-grupo-do-wathsapp-no-blogger

---------------------------------------------------

Depois que você pegar o link do seu grupo é muito simples. 

Ali abaixo, onde está selecionado de verde, você coloca o link do seu grupo do Wathsapp. 

Vai no Blogger, seleciona a opção JavaScript HTML e coloca o código de sua preferência e salve. 

Pronto

---------------------------------------------------

Você também pode colocar um texto, que pode ficar acima, no meio ou no lado esquerdo do ícone. 

Faça as alterações conforme sua preferência.

Por exemplo, o texto fale conosco, que você pode mudar. 

Ali onde está selecionado em verde você coloca o link do seu grupo.  

<div style="height:80px – Esse valor representa a posição acima do ícone. Conforme você aumentar o valor o texto sobe mais.

<!-- Texto Acima do Ícone -->

<div style="height:80px; position:fixed; bottom: 100px; right: 25px; z-index:100;">
<font face=tahoma color="blue" style="font-size: 16px">Fale conosco!</font>

<a target="_blank" href="AQUI VOCÊ COLOCA O LINK DO SEU GRUPO">

<img alt="Botão Wathsapp" style="height:60px; position:fixed; bottom: 100px; right: 25px; z-index:100;"

src="https://www.mediafire.com/convkey/4f75/6504rhobhs1cg6xzg.jpg" />
</a></div>

---------------------------------------------------

<div style="height:100px - Esse valor representa a posição no meio do ícone. E este valor right: 90px representa a posição horizontal para não ficar em cima do ícone. Conforme você aumentar ou diminuir os valores o texto muda de posição.

<!-- Texto No Meio e ao Lado Esquerdo do Ícone -->

<div style="height:100px; position:fixed; bottom: 40px; right: 90px; z-index:100;">

<font face=tahoma color="blue" style="font-size: 16px">Fale conosco!</font>

<a target="_blank" href="AQUI VOCÊ COLOCA O LINK DO SEU GRUPO">

<img alt="Botão Wathsapp" style="height:60px; position:fixed; bottom: 100px; right: 25px; z-index:100;"

src="https://www.mediafire.com/convkey/4f75/6504rhobhs1cg6xzg.jpg" />
</a></div>

--------------------------------------------------

<div style="height:60px – Esse valor representa a posição abaixo do ícone. Conforme você diminuir o valor o texto desce mais.

<!-- Texto Abaixo -->

<div style="height:60px; position:fixed; bottom: 40px; right: 25px; z-index:100;">
<font face=tahoma color="blue" style="font-size: 16px">Fale conosco!</font>

<a target="_blank" href="AQUI VOCÊ COLOCA O LINK DO SEU GRUPO">

<img alt="Botão Wathsapp" style="height:60px; position:fixed; bottom: 100px; right: 25px; z-index:100;"

src="https://www.mediafire.com/convkey/4f75/6504rhobhs1cg6xzg.jpg" />
</a></div>

---------------------------------------------------

Qualquer dúvida ou problema favor entrar em contato. 

Comentários