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: , , ,