Botão diHITT inteligente no Blogger

Aqui no blog eu passei a utilizar o Botão diHITT inteligente ao lado dos títulos das postagens. Ele é muito bom porque facilita para o leitor votar no seu post. Quer ele também no seu blog? Então siga esse pequeno tutorial!

Vá até as ferramentas do diHITT e procure pelo "Botão diHITT inteligente". Em "Tamanho", selecione conforme você desejar. Em "Seu site usa" selecione "Blogger novo". Agora copie o código gerado.

Vá até o Blogger, abra o HTML do seu blog e faça backup (para evitar problemas). Clique em "Expandir modelos de widgets" e procure por:

<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

Agora logo após <a expr:name='data:post.id'/> adicione o seguinte trecho:

<span style='float:left;'>
<SCRIPT GERADO NO diHITT>
</span>

E logo apó o último </b:if> adicione:

<div style='clear:both;'/>

Deve ficar como no exemplo abaixo:

<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>
<a expr:name='data:post.id'/>
<span style='float:left;'>
<SCRIPT GERADO NO diHITT>
</span>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
<div style='clear:both;'/>

Aperte "Visualizar", veja se está tudo certinho, salve e está pronto! Botão diHITT inteligente no seu blog.

<UPDATE>
Como nos templates com fundo escuro o botão tem alguns problemas, o nosso amigo Pablo criou um "hack" para corrigir isso.

Esse é um exemplo de código gerado no diHITT:

<script type="text/javascript" expr:src='"http://widget.dihitt.com.br/button?size=TAMANHO&amp;ref=REFERENCIA&amp;url=" + data:post.url + "&amp;title=" + data:post.title'></script>

Logo após /button? você deve colocar o seguinte:

cor=COR&amp;fundo=FUNDO&amp;

Substitua COR pela cor em hexadecimal mas sem o #!
E substitua FUNDO por claro ou escuro.

Deve ficar mais ou menos assim:

<script type="text/javascript" expr:src='"http://widget.dihitt.com.br/button?cor=COR&amp;fundo=FUNDO&amp;size=TAMANHO&amp;ref=REFERENCIA&amp;url=" + data:post.url + "&amp;title=" + data:post.title'></script>

Na dúvida, pergunte! xD
</update>
© Instituto de Desenvolvimento do Blog do Lenon, seu potencial, nossas gambiarras.

* Testado e aprovado em modelos padrão do Blogger. Qualquer erro, dúvida, enfim, deixe seu comentário. Proibida cópia! Não seja plagiador!