segunda-feira, 3 de janeiro de 2011

Como colocar um pássaro retwitter no blog


Fonte - lifeconsulting.multiply.com

Que tal um lindo passarinho azul voando sobre a página do seu blog? Legal não é? Pois é,  e ainda se torna divertido, pois quando a página é rolada, o pássaro vai até onde a página parou, ficando visível ao usuário.

Colocando no seu blog, seus leitores não estarão mais sozinhos no site! Estarão com ele, o companheiro pássaro azul!

Então, se interessou?

Vamos instalar!

Logado no blogger, vá em "Design" - "Ediar HTML" , marque a caixinha "Expandir modelos de widgets".


Agora procure pela linha <data:post.body/>  (ctrl+f para procurar).
Logo acima dessa linha cole o código abaixo.

<b:if cond='data:blog.pageType == "item"'><script src='http://oloblogger.googlecode.com/files/tripleflap.js' type='text/javascript'></script>
<script type='text/javascript'>
var birdSprite=&quot;http://oloblogger.googlecode.com/files/birdsprite.png&quot;;
var targetElems=new Array(&quot;img&quot;,&quot;hr&quot;,&quot;table&quot;,&quot;td&quot;,&quot;div&quot;,&quot;input&quot;,&quot;textarea&quot;,&quot;button&quot;,&quot;select&quot;,&quot;ul&quot;,&quot;ol&quot;,&quot;li&quot;,&quot;h1&quot;,&quot;h2&quot;,&quot;h3&quot;,&quot;h4&quot;,&quot;p&quot;,&quot;code&quot;,&quot;object&quot;,&quot;a&quot;,&quot;b&quot;,&quot;strong&quot;,&quot;span&quot;);
var twitterAccount = &quot;http://twitter.com/gediiih&quot;;
var tweetThisText = &quot;Leyendo: <data:post.url/>&quot;;
tripleflapInit();
</script>
</b:if>

Na parte destacada, coloque o seu twitter e depois salve!

Obs. O pássaro será visto apenas nas postagens.

Recomendações


Para evitar a perda do código javascript e da imagem do pássaro, baixe os arquivos abaixo.

tripleflap.js <- Código Javascript
birdsprite.png <- Imagem

Hospede-os em seu servidor, e subtitua no código. Na parte destacada de azul, coloque a URL do código javascript, e na parte em verde, coloque a URL da imagem.

Fonte - oloblogger

Marcadores: , , ,

17 Comentários:

Às 15 de janeiro de 2011 22:02 , Blogger Fênix27 disse...

Olá.
Fiquei encantada com o pssáro. Mas por 2x coloquei no blog e elê não aparece. Por favor o que devo fazer?. Meu blog: http://wwwcemsa2010.blogspot.com/. Espero que eu tenha uma resposta.
Obrigado.

 
Às 15 de janeiro de 2011 23:03 , Blogger Códigos Blogger disse...

Se você instalou corretamente como mostramos acima, com certeza dará certo. Vale lembrar que o pássaro só aparece nas postagens. Na home ele não aparece, verifique isso.

 
Às 17 de janeiro de 2011 14:51 , Blogger Fênix27 disse...

Este comentário foi removido pelo autor.

 
Às 14 de março de 2011 17:04 , Blogger Ginga codigos de jogos,msn,orkut,blogs disse...

gostei de tudo que ensina ja ate marquei como favoritos brigado funciono todos

 
Às 14 de abril de 2011 13:40 , Blogger Drw End's disse...

Nossa muito obrigada fico lindo no meu blog

 
Às 19 de abril de 2011 11:30 , Blogger Priscila Miranda disse...

tenho que substituir a parte azul e averde ou so a azul? nao deu certo, sniff

 
Às 19 de abril de 2011 12:42 , Blogger Códigos Blogger disse...

@Priscila Miranda Não precisa substituir nenhuma parte, apenas copie o código e cole onde se pede.

 
Às 24 de abril de 2011 05:22 , Blogger Priscila Miranda disse...

aeeeeeeeeeee, consegui, brigadinha!!!

 
Às 27 de abril de 2011 23:16 , Blogger dieguinho disse...

Pra colocar no tumblr e a mesma coisa? posto o link depois de que? >.<

 
Às 28 de abril de 2011 00:07 , Blogger Códigos Blogger disse...

@dieguinho Dai eu não sei amigo, pois só testei com o blogger, afinal o cblogger é só sobre o blogger. =]

 
Às 16 de maio de 2011 23:32 , Blogger Thaís disse...

Adoreiii estava procurando isso fazia tempos.
mais bah tchê muitooo bom esse blog emm
beijuss
se eu nao consegui instalar eu te pago pra vc faze issu pra mim
mil beijinhus

 
Às 5 de junho de 2011 12:40 , Blogger ۩๑»D10skull«๑۩ ® ™ disse...

:D Legal mas seu passaro, parese ser diferente quando voa, voc~e modificou o Arquivo .js dele?

 
Às 5 de junho de 2011 22:47 , Blogger Códigos Blogger disse...

@۩๑»D10skull«๑۩ ® ™ Não meu amigo, eu uso exatamente este, sem modificação nenhuma.

 
Às 4 de julho de 2011 17:05 , Blogger Polaca disse...

no html do meu blog não tem
aaaaa, pode ser porque ja mudei códigos demais?

 
Às 4 de julho de 2011 22:39 , Blogger Códigos Blogger disse...

@Polaca Certifique-se que você marcou a caixinha "Expandir modelos de widgets".

Tente só procurar por data:post.body

 
Às 9 de novembro de 2011 20:32 , Blogger Sara Nossa Terra Pacatuba disse...

Show, ficou muito bom, muito obrigauu

 
Às 13 de novembro de 2011 03:35 , Blogger Italo Kaique disse...

nem funfou no meu http://italokaiqueam.blogspot.com :(

 

Postar um comentário

Se você gostou deste artigo deixe um comentário!

Duvidas ou sugestões comentem aqui! =D
*Não insultar autor ou leitores da postagens
*Não pedir parceria por comentários
*Não publicar spam ou similar.

Assinar Postar comentários [Atom]

Links para esta postagem:

Criar um link

<< Página inicial