Já expliquei aqui em outras postagens como criar um blog se
ainda não tem um blog recomendo que leia e aprenda passo a passo como fazer um
blog clicando aqui!
Vamos aprender hoje como colocar aqueles botões de seguir o
blog aqueles que vemos pela internet , não sei expressar corretamente o nome
destes botões antes de escrever este poste dei uma breve pesquisada na internet
e achei as seguintes perguntas:
Como colocar botão de seguidores no blog?
Como colocar Botão de seguir o blog?
Como colocar Botão de siga me no blog?
Como adicionar botão de seguir personalizado no blog?
Bom acessei os lugares e vi que trata se de um tutorial
extenso e complicado onde você tem que criar o seu botão sozinho desde as
imagens ate a parte do código para depois inserir no seu blog.
Por isso resolvi criar o meu próprio Botão personalizado
para seguir o blog isso mesmo e para facilitar para todos que estiverem lendo
este artigo a procura de um tutorial simples e rápido e também porque sei que
tem pessoas que tem dificuldades em construir um botão de siga me do zero.
Criei um menu de botões de redes sociais diferente dos de
mais sendo eles: Youtube, Facebook, Google+ e FeedBurner. Nota se que estes botões
tem um efeito quando se passa o mouse encima muito legal.
Observe que logo a seguir o que vai ver é apenas uma imagem ilustrativa para ver o seu modelo em funcionamento e o seu afeito efeito olhe do lado direito do meu blog na coluna lateral modelo em perfeito funcionamento.
1-Passo copie o código para um bloco de notas:
<style
type="text/css">
<!--
.style1
{color: #333333}
-->
</style>
<table
align="center" border="0" cellpadding="0"
cellspacing="0" style="width: 219px;"><tbody>
<tr><td><div
align="center"><a href="Coloque aqui o link do perfil do
seu Facebook" target="_blank"><img
src="http://i1089.photobucket.com/albums/i357/pauloecarina2009/Vejacomoganhar2_zps4b456fa5.jpg"
width="53" height="52"
border="0"></a><a href="Coloque aqui o link do
perfil do seu Google+" target="_blank"><img
src="http://i1089.photobucket.com/albums/i357/pauloecarina2009/Vejacomoganharsssss_zpsc6a693fc.jpg"
width="52" height="52" border="0"></a><a
href="Coloque aqui o link do perfil do seu FeedBurner" target="_blank"><img
src="http://i1089.photobucket.com/albums/i357/pauloecarina2009/Vejacomoganhar_zps0b59789e.jpg"
width="52" height="52"
border="0"></a><a href="Coloque aqui o link do
perfil do seu Canal do Youtube" target="_blank"><img
src="http://i1089.photobucket.com/albums/i357/pauloecarina2009/Vejacomoganhar3_zpsd849e1b6.jpg"
width="53" height="52"
border="0"></a></div>
</td> </tr>
<tr>
<td><div
align="center">
<h6><a
href="http://vejacomoganhar.blogspot.com.br/2015/02/como-colocar-botao-de-seguir-o-blog.html"
target="_blank" class="style1">Colocar no meu Blog!
</a></h6>
</div></td>
</tr>
</tbody></table>
<blockquote> </blockquote>
<style>
img
{opacity:1; filter:alpha(opacity=100);}
img:hover
{opacity:0.8; filter:alpha(opacity=80);}
</style>
2-Passo depois de copiado altere as seguintes linhas do código seguindo a ordem a baixo:
1-Coloque aqui o link do perfil do seu Facebook
2-Coloque aqui o link do perfil do seu Google+
3-Coloque aqui o link do perfil do seu FeedBurner
4-Coloque aqui o link do perfil do seu Canal do Youtube
Muito cuidado para não apagar nada do código ou tudo pode dar errado
coloque os links corretamente;
Cada um em seu lugar de forma que para que cada link fique no lugar
correto de cada botão, ou seja, se colocar o seu link do Google+ no lugar no
link do Facebook quando alguém clicar vai ser direcionado para o site errado;
Escrevi dentro do código os lugares certos e em ordem para facilitar o
máximo para você;
Agora que já editou o código para inserir no seu blog basta ir no:
- Painel do blogger
-Visão Geral
-Layout
-Adicionar um Gadiget
Agora cole o código e salve e pronto pode ser tanto na lateral do seu
blog como no meio das postagens coloque aonde mais Le agradar;
Detalhe importante: O efeito de que os botões acende vai ter efeito
sobre qualquer tipo de botão do seu blog se preferir remove-lo basta remover as
ultimas linhas do código porem os botões ficaram somente de uma cor e sem o
efeito fica seu critério faca como desejar;
Apagar o código a baixo para remover o Efeito de quando passamos o mouse encima do botão!
<style>
img
{opacity:1; filter:alpha(opacity=100);}
img:hover
{opacity:0.8; filter:alpha(opacity=80);}
</style>
E não se esqueça este botão de seguir o blog tem muita importância
dentro de um blog, pois da à opção de nossos leitores seguirem nossas redes
sociais pela internet, é uma forma de conquistarmos leitores fieis e que sempre
retornam para o nosso blog, espero ter ajudado se gostou siga-me nas redes
sociais se tiver alguma duvida pode perguntar.
Nenhum comentário:
Postar um comentário