Como colocar o pássaro do twitter no seu blog

Oie pessoal vamos falar de como colocar pássaro do Twitter voando pelo seu blogmas que tabem podemos colocar outra imagem voando na tela enquanto outras pessoas navegam emseu blog. É claro se quiser outra imagem terá de ter um programa para editar a imagem e depois hospeda-la essa imagem para usar no código. 
Mas vamos começar por partes: primeiro vamos fazer da imagem clássica do Twitter voando pelo seu site. Para fazer isso entre na pagina layout, adicionar gadget, HTML/javascript e cole esse código:
 

                            

<script src="https://oloblogger.googlecode.com/files/tripleflap.js" type="text/javascript"></script> <br /> <script type="text/javascript">  var birdSprite='https://oloblogger.googlecode.com/files/birdsprite.png';  var targetElems=new Array('img','hr','table','td','div','input','textarea','button','select','ul','ol','li','h1','h2','h3','h4','p','code','object','a','b','strong','span');  var twitterAccount = 'https://twitter.com/fabianoroberto';  var twitterThisText ='';  tripleflapInit();  </script>


 


Você só precisa alterar o endereço do seu perfil no Twitter que está nesta linha: var twitterAccount = 'https://twitter.com/SuperTudoTutoriais';  


Essa outra imagem nós retiramos do código usado no blog:https://pivotattack.blogspot.com que foi usado como exemplo em um comentário feito em nosso tutorial: 

Então se quiser usar com alguma outra imagem precisará criar a imagem você mesmo.


Uma dica que pode ajudar a fazer a imagem personalizada é usar um programa que permita transparência. Crie uma imagem no tamanho 256×320 e salve a imagem padrão do pássaro dotwitter (https://oloblogger.googlecode.com/files/birdsprite.png) depois monte sua imagem usando a do twitter semitransparente por cima, assim ficar mais fácil posicionar corretamente os desenhos dentro da imagem e quando terminar é só retirar a imagem do twitter. 


criar imagem semi transparente

Veja no exemplo abaixo que sobrepondo as imagens os desenhos se encaixam perfeitamente.


Depois que fizer e hospedar a imagem só precisam alterar essas linhas no código:

var birdSprite='https://oloblogger.googlecode.com/files/birdsprite.png'; colocando o endereço da imagem que desejar.

Nesta outra linha: var twitterAccount = 'https://twitter.com/fabianoroberto'; coloque o endereço do twitter ou qualquer outro site ou pagina do seu blog que desejar 
E colocar no seu blog da mesma maneira que o código original com a imagem do twitter: Paginalayout – adicionar gadget – HTML/javascript.

Sabemos que essa segunda opção usando imagem personalizada voando pela tela dá trabalho, mas não tem outro jeito de fazer porque o código já foi desenvolvido nesta base de tamanho e padrão de imagem. Espero que gostem.