Perfil personalizado para Blogger.



Para você que quer personalizar seu perfil no Blogger, vou te passar um código, onde ficará bem fácil fazer isso! Veja o modelo de como fica abaixo. Também te darei dicas de como trocar os icones, por outros do seu gosto.







-------------------------------------------inicio do código-------------------------------------------

<center>
<div class="separator" style="clear: both; text-align: center;">
<img border="0" height="230" src="LINK DA SUA FOTO AQUI" width="220" /></div>
&nbsp;<a href="http://www.facebook.com/SEUNICKAQUI" target="_blank"><img border="0" src="http://i757.photobucket.com/albums/xx217/fernandalima23/facebook-2.png" style="text-align: center;" /></a><a href="http://www.instagram.com/SEUNICKAQUI" target="_blank"><img border="0" src="http://i757.photobucket.com/albums/xx217/fernandalima23/instagram.png" style="text-align: center;" /></a><a href="http://plus.google.com/
SEUNICKAQUI" target="_blank"><img border="0" src="http://i757.photobucket.com/albums/xx217/fernandalima23/googleplus.png" style="text-align: center;" /></a><a href="http://www.twitter.com/SEUNICKAQUI" target="_blank"><img border="0" src="http://i757.photobucket.com/albums/xx217/fernandalima23/twitter-1.png" style="text-align: center;" /></a><a href="http://www.youtube.com/SEUNICKAQUI" target="_blank"><img border="0" src="http://i757.photobucket.com/albums/xx217/fernandalima23/youtube1-1.png" style="text-align: center;" /></a><br />
<div>
<br /></div>

Descrição do seu perfil aqui!<br /><center/>


--------------------------------------------fim do código-------------------------------------------

Depois de copiar o código, faça login no blogger, vá em LAYOUT, depois clique em ADICIONAR UM GADGET, clique no + em HTML/JavaScript, cole o código dentro.


Depois que você colar o código, agora  edite o código antes de salvar:


height="230" src="LINK DA SUA FOTO AQUI" width="220"


Nessa parte do código, onde tem LINK DA SUA FOTO AQUI, você irá colar, no lugar desse nome o link direto para sua imagem dentro das aspas( eu uso o http://www.photobucket.com/ para hospedar imagens), onde tem height="230" é a altura, aumentando este número 230, para 240, você aumenta a altura, assim deixa da altura que ficará melhor no seu template, já mudando o width="220" número 220 ,aumenta ou diminui a largura.


Já nessa parte do código:

http://www.facebook.com/SEUNICKAQUI 

Mude  SEUNICKAQUI para o nick do seu facebook, o meu por exemplo é annavllis, então ficará assim



Faça isso em todos os outros onde está escrito SEUNICKAQUI ,mudando para o nik da sua rede social.



Existe também no código, os links das imagens, este por exemplo:
http://i757.photobucket.com/albums/xx217/fernandalima23/youtube1-1.png é o link da imagem do ícone do youtube, todos os links das imagens começam com http e terminam em png, quando for trocar, deixe sempre dentro das " " aspas

Caso queira retirar ou acrescentar mais ícones, é só retirar ou acrescentar esta parte do código.


<a href="LINK DA SUA REDE SOCIAL AQUI" target="_blank"><img border="0" src="LINK DA IMAGEM DO SEU ÍCONE AQUI" style="text-align: center;" /></a>


Se você quiser acrescentar mais ícones, do mesmo modelo que estou usando neste código, aqui está o link de onde peguei estes http://www.softicons.com/free-icons/social-media-icons/nail-polish-social-media-icons-by-uiconstock

Caso queira outros modelos clique aqui , ou saber como salvar no seu pc os links deste site, veja o tutorial http://www.universodasdicas.com/2013/06/icones-de-redes-sociais-personalizados.html


Sua descrição do perfil, falar um pouco de você, seu nome, e mais alguma coisa, é só substituir essa frase no código: Descrição do seu perfil aqui!
Terminou de editar, é só salvar e arrastar para o local onde você quer que fique e clicar em Salvar Organização(palavras laranjadas na parte de cima).


Qualquer dúvida, é só deixar em comentário!



Espero ter te ajudado,sua visita é sempre bem vinda,volte sempre e se puder nos siga aqui e nas redes sociais e  por favor comente!





5 comentários