Post |Dicas blog, Pc

Botões para Curtir e Twitar posts e artigos de blogs ou sites

Código para colocar aqueles botões do Twitter e Facebook em blogs ou sites, aqueles que tem um balão com a quantia de pessoas que curtiram ou enviaram.
colocar gadget com botão para curtir e twitar, facebook e twitter com contagem do números de enviados para as redesEsses botões servem para as pessoas compartilhar o conteúdo de seu artigo(postagem), se elas gostarem e acharem que amigos possam gostar também, fazendo isso elas estarão divulgando seu blog/site.

Os códigos podem ser pegos no twitter e no Facebook, mas o principal problema que eu enfrentei foi na organização dos elementos na página, e, no botão do facebook era necessário colocar o endereço Url do blog, mas, para cada pessoa que Curtia(clicava) no botão de um post(artigo) o resultado mostrado na conta dele era um link dizendo que ele havia gostado do blog e não daquele post, sendo assim, se aquele visitante quisesse retornar ou compartilhar aquele artigo ele não conseguiria, pois na conta dele só tinha o link da página inicial do blog.

Entenda alguns detalhes dos botões Curtir e Twitar

Para o botão do Facebook adaptei um javascript que irá usar window.location.href para 'pegar' a Url da página em que o visitante está e usar essa Url para criar o botão curtir, assim, se um visitante quiser curtir várias páginas(artigos ou posts) de seu blog/site ele poderá, se fosse colocar a Url da página inicial, ele só poderia curtir aquela página, mesmo estando em outra.

Próximo aos códigos abaixo estão as imagens dos botões e mais ou menos como os botões ficam no local onde são colocados, as imagens são uma ilustração do botão, e, esse poderá ficar levemente diferente dependendo do navegador ou se os sites Facebook e Twitter fizerem alguma alteração.

O facebook tem dois tipos de botões, um mais azulado e outro escuro, o escuro é mais indicado para páginas com fundo escuro, mas, acho que, já que o botão do Twitter é azul claro, seria mais interessante usar os modelos claros para ambos porque eles irão combinar um com o outro, e, dizem que preto combina com tudo, sendo assim, os botões azuis podem ficar melhor e as pessoas vão perceber ele melhor, é mais chamativo e muitos já estão acostumados.

Atenção: Você deve fazer uma modificação fácil no código do botão do Twitter, você poderá escolher um dos códigos abaixo, o que tem formato de botão que lhe agrada, e pode mudar a palavra foitestado pelo seu nome de usuário do Twitter, com cuidado para não retirar as aspas, aí, quando o visitante de seu blog twitar, o seu nome de usuário do Twitter aparecerá no tweet dele, por exemplo, se você twitar esse post(usando o botão), o texto do seu tweet ficaria mais ou menos assim:

Botões para Curtir e Twitar artigos de blogs ou sites http://goo.gl/fb/VOJlf Via @foitestado

Os seguidores dele verão o nome de usuário que você quiser(o seu ou de seu blog) e poderão clicar e lhe seguir se quiserem, aí você que é o dono do blog poderá conseguir mais seguidores para seu Twitter, mas, isso nem sempre acontece, poucos clicam e alguns visitantes de seu blog, ao twitar, poderão apagar esse trecho para caber mais palavras... Mas, é uma pequena chance, e você não deve desperdiçar nada.

Outra coisa, ao visitante clicar no botão do Twitter abrirá uma nova página e o Twitter se encarregará de colocar o título do artigo e uma Url curta que, se acessada irá retornar para o artigo de seu blog. Algumas vezes, raramente, o twitter 'não confia' naquele site/blog ou artigo e não permite essa ação, isso pode ocorrer no começo e depois de algum tempo passar, pode ocorrer mais com Url longa, com alguns caracteres 'especiais' na Url de seu blog ou com blogs/sites que ele(o sistema) ainda desconhece.

Quem quiser dar uma margem(distancia) de folga entre os botões e outros elementos de sua página, vou explicar bem abaixo, depois dos códigos.

Atualização, quem quiser Código pra colocar botão +1 do Google, Orkut, Twitar e Curtir em blogs e sites, clique
Para blogger.com botões abaixo do post, Clique aqui

Códigos para blog/site que irá gerar botão Curtir no Facebook e tweet

Teste os botões aqui ao lado =>

Próximo aos códigos tem uma ilustração(imagem) dos botões, para testar o funcionamento use o botão acima.

No blogger, esses códigos são adicionados como gadget, Html/JavaScript, clique

Em páginas de sites o código vai em qualquer local entre as tags <body></body> Mas para testar ele deve estar numa página na web.

Facebook twitter, curtir ou tweet, layout escuro, cores preto e cinza
Botão Curtir escuro e tweet, vertical, esquerdo
Modelo do botão Curtir Facebook escuro(dark) e tweet, quadrado vertical e do lado esquerdo, para blogs e sites<div style='width:55px;float:left;margin:1px 4px 2px 3px;'><script type="text/javascript"><!--
urlb=window.location.href;
document.write("<iframe src='//www.facebook.com/plugins/like.php?href="+urlb+"&amp;layout=box_count&amp;action=like&amp;colorscheme=dark&amp;font=arial' scrolling='no' frameborder='0' allowtransparency='true' style='width:55px;overflow:hidden;height:65px;'></iframe>");
//--></script><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div></div>

botão para curtir no facebook e enviar pro twitter
Botão Curtir e tweet, vertical, esquerdo
Modelo do botão Curtir Facebook claro e tweet, quadrado vertical e do lado esquerdo, para blogs ou site<div style='width:55px;float:left;margin:1px 4px 2px 3px;'><script type="text/javascript"><!--
urlb=window.location.href;
document.write("<iframe src='//www.facebook.com/plugins/like.php?href="+urlb+"&amp;layout=box_count&amp;action=like&amp;font=arial' scrolling='no' frameborder='0' allowtransparency='true' style='width:55px;overflow:hidden;height:65px;'></iframe>");
//--></script><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div></div>

Facebook twitter, curtir ou tweet, layout escuro, preto e cinza
Botão Curtir escuro e tweet, vertical, lado direito
Modelo do botão Curtir Facebook escuro(dark) e tweet, quadrado vertical e do lado direito, para blog e sites<div style='width:55px;float:right;margin:1px 4px 2px 3px;'><script type="text/javascript"><!--
urlb=window.location.href;
document.write("<iframe src='//www.facebook.com/plugins/like.php?href="+urlb+"&amp;layout=box_count&amp;action=like&amp;colorscheme=dark&amp;font=arial' scrolling='no' frameborder='0' allowtransparency='true' style='width:55px;overflow:hidden;height:65px;'></iframe>");
//--></script><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div></div>

botão para curtir no facebook e enviar pro twitter
Botão Curtir e tweet, vertical, lado direito
Modelo do botão Curtir Facebook claro e tweet, quadrado vertical e do lado direito, para blog e sites<div style='width:55px;float:right;margin:1px 4px 2px 3px;'><script type="text/javascript"><!--
urlb=window.location.href;
document.write("<iframe src='//www.facebook.com/plugins/like.php?href="+urlb+"&amp;layout=box_count&amp;action=like&amp;font=arial' scrolling='no' frameborder='0' allowtransparency='true' style='width:55px;overflow:hidden;height:65px;'></iframe>");
//--></script><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div></div>

votar e enviar pro twitter e facebook, cor escura, Dark

Botões Curtir e Tweet na Horizontal

Modelo do botão Curtir Facebook escuro e tweet padrão, estreito(horizontal) e do lado esquerdo, para blog e sites<div style='width:205px;float:left;margin:1px 4px 2px 3px;height:20px;'><script type="text/javascript"><!--
urlb=window.location.href;
document.write("<iframe src='//www.facebook.com/plugins/like.php?href="+urlb+"&amp;layout=button_count&amp;action=like&amp;colorscheme=dark&amp;font=arial' scrolling='no' frameborder='0' allowtransparency='true' style='float:left;width:90px;overflow:hidden;height:20px;'></iframe>");
//--></script><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='float:left;width:110px;'><a class='twitter-share-button' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div></div>

Dar voto, twittar ou facebook
Modelo do botão Curtir Facebook claro e twitar padrão, horizontal e do lado esquerdo, para blogs e sites<div style='width:205px;float:left;margin:1px 4px 2px 3px;height:20px;'><script type="text/javascript"><!--
urlb=window.location.href;
document.write("<iframe src='//www.facebook.com/plugins/like.php?href="+urlb+"&amp;layout=button_count&amp;action=like&amp;font=arial' scrolling='no' frameborder='0' allowtransparency='true' style='float:left;width:90px;overflow:hidden;height:20px;'></iframe>");
//--></script><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='float:left;width:110px;'><a class='twitter-share-button' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div></div>

votar e enviar pro twitter e facebook, cor escura, Dark
Modelo do botão Curtir Facebook escuro e twitter padrão, estreito(horizontal) e do lado direito, para blog e sites<div style='width:205px;float:right;margin:1px 4px 2px 3px;height:20px;'><script type="text/javascript"><!--
urlb=window.location.href;
document.write("<iframe src='//www.facebook.com/plugins/like.php?href="+urlb+"&amp;layout=button_count&amp;action=like&amp;colorscheme=dark&amp;font=arial' scrolling='no' frameborder='0' allowtransparency='true' style='float:left;width:90px;overflow:hidden;height:20px;'></iframe>");
//--></script><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='float:left;width:110px;'><a class='twitter-share-button' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div></div>

Dar voto, twittar ou facebook
Modelo de botão Curtir Facebook claro e twitter padrão, horizontal e do lado direito, para blogs e sites<div style='width:205px;float:right;margin:1px 4px 2px 3px;height:20px;'><script type="text/javascript"><!--
urlb=window.location.href;
document.write("<iframe src='//www.facebook.com/plugins/like.php?href="+urlb+"&amp;layout=button_count&amp;action=like&amp;font=arial' scrolling='no' frameborder='0' allowtransparency='true' style='float:left;width:90px;overflow:hidden;height:20px;'></iframe>");
//--></script><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='float:left;width:110px;'><a class='twitter-share-button' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div></div>

Afastar os botões de outras coisas
Nos códigos acima, eu coloquei uma margem, mas, ela é tão fina que quase não faz diferença, deixei assim porque não sei qual será a necessidade de cada um, sendo assim, talvez você terá que entendê-la e aumentar um pouco.

O código responsável pela margem é:
margin:1px 4px 2px 3px;

Essa margem não se aplica ao botão individualmente, mas sim, a volta deles, é que os dois botões estão dentro de uma mesma DIV, e, a margem se aplicará a essa div, para os botões horizontais, a div tem uma largura de 205px e, só para constar, as margens laterais são somadas a essa largura. A div com botões verticais tem 55px de largura, somando as margens laterais que eu coloquei fica 62px.

No código de margem acima:

1px O primeiro valor é para o topo.
4px O segundo valor é a lado direita
2px O terceiro valor é a base
3px O quarto e último valor é para o lado esquerdo

No código de margem, os espaços e caracteres devem ser respeitados.
Sabendo disso, você pode alterar apenas os números para aumentar ou diminuir as margens e, assim fazer com que eles fiquem mais distantes ou perto de outras coisas.

Talvez observando a imagem abaixo fica mais fácil entender o lado que cada número representa.
Clique para aumentar
Margem em estilo Css, margin

62 comentários:

Código de botões para Curtir e Twittar posts e artigos de blogs ou sites2011-05-03T11:40:00-03:00
  1. oi, eu queria perguntar como remove as postagens lado a lado, eu baixei um template, mais ele estava com "read more" ai eu consegui remover mais estou com esse problema das postagens lado a lado,o link é http://donmadrugatest.blogspot.com/,
    as postagens estao baguçadas e etc, esse é o modelo de testes, obrigado e desculpe postar aqui, é que nao tem nenhuma forma de contato.

    att synce.

    Responder
  2. Don Synce

    Se você colocou um código para isso acontecer, você deve remover o mesmo, ou preferencialmente pegar uma cópia desse modelo antes de ter adicionado o código para isso.

    Se seu modelo já estava assim ficará muito difícil mudar ele, porque ele já pode ser criado para ter essa estrutura e o que a pessoa fez é difícil saber e, modificações em cima do mesmo pode bagunçar mais ainda.

    Olhei seu template e ele parece estar com um código que não parece apropriado para o blogger, talvez ele use JavaScript para criar algo, mas vi no Css classes que não estão em uso, assim como Ids e classes no Html que mostram que pode haver um problema.

    Para mudar um modelo é preferível pegar um do blogger, se você usar um template baixado da web ele pode vir com alguns problemas. Além disso o blogger oferece a opção de personalizar sem uso de códigos, para quem tem pouca prática com códigos é preferível fazer isso e só usar códigos em últimos casos.

    Responder
  3. Olá, coloquei o botão em meu blog. Porém eu gostaria que ele só aparecesse quando um visitante lesse o artigo. No caso ele está aparecendo no home também.

    Responder
  4. Yohan Assal

    Eu não vejo um problema nisso, vejo uma oportunidade para a pessoa que visita a HomePage do blog Curtir ou Twittar ela também, assim é mais uma chance de seu blog ser divulgado por um visitante.

    Estou pensando em um código só para o post, mas é muito mais complicado de explicar e para colocar no blog e, infelizmente, no momento estou com pouco tempo para fazer isso.

    Responder
  5. Oi, eu quero apenas um link(javascript) que envie a pessoa p/ uma janela(outra página) para dar o share, eu ja consegui para o facebook, mas não consigo p/ o twitter... abre sempre na mesma janela que o meu site e isso não é o que quero... rs... será que pode me ajudar? Segue o código para o facebook para quem quiser:
    javascript:var d=document,f='http://www.facebook.com/share',l=d.location,e=encodeURIComponent,p='.php?src=bm&v=4&i=1281707146&u='+e(l.href)+'&t='+e(d.title);1;try{if(!/^(.*\.)?facebook\.[^.]*$/.test(l.host))throw(0);share_internal_bookmarklet(p)}catch(z) {a=function() {if(!window.open(f+'r'+p,'sharer','toolbar=0,status=0,resizable=1,width=626,height=436'))l.href=f+p};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else{a()}}void(0)

    Responder
  6. Sítio da Vitória

    O código acima para twitar abre em nova página ou janela, porém, alguns navegadores podem ser configurados para links não abrirem em outra página, aí é uma opção do usuário.

    No código acima, a parte referente ao Twitter começa com(não copie esse abaixo):

    <script src='//platform.twitter.com

    E termina com essa parte:

    href='//twitter.com/share' rel='nofollow' title='tweet'></a></div>

    Mas cuidado, se copiar apenas ele para não levar o fim do código da div que coloquei, tem duas divs, uma que faz parte do código do Twitter e outra que é parte do código que personalizei.

    Responder
  7. Era exatamente isso que eu estava procurando, o like do facebook que funcionasse pra cada post diferente, que não pegasse tudo(ou ele fica só repetindo), mas não deu certo =\ Eu to usando o modelo antigo(em html) no blogspot. Esse código só serve em xml?

    Outra coisa, sabe como fazer(a mesma coisa) pro botão compartilhar?

    Se puder me dar esse help te agradeço mto! :)

    Responder
  8. Priscila Nunes

    Testei o código em páginas Html e funcionou, talvez tente novamente, as vezes o blogger modifica alguns caracteres ao salvar quando usa determinado navegador.

    Quanto ao botão de compartilhar a que você se refere eu não sei qual o código dele.

    Só sei que, para esse botão acima do Facebook é possível mudar o nome curtir para Recomendar, porém, ficará complicado e difícil para quem tem pouca prática com uso de códigos, para isso, basta substituir:

    action=like

    por:

    action=recommend

    Mas, se fizer isso terá que aumentar algumas larguras em mais uns 120 pixels, são duas larguras, os valores para elas encontram-se logo após esse trecho de código style='width:
    E, também ter o cuidado de fazer isso só na parte do código que é referente ao Facebook e a Div que 'cerca'(contém) os botões, nos códigos acima, é referente ao Facebook e essa Div todo código que está acima desse trecho:

    </iframe>");
    //--></script>


    Sendo assim, acima desse trecho de código você terá que ver as larguras e somar a elas mais 120 para cada, isso porque o botão ficará mais largo.

    Responder
  9. Estou com problema
    tipo no site tem
    categoria

    Cinema
    Loja de Sapatos
    etc..

    só que é inserido tudo pelo painel
    e a div é usada para tdo o cadastro
    e quando curto 1 cinema
    ai entro na loja pra curti, já fica curtido automaticamente

    eu queria o curtir e twitter em post separados!

    Responder
  10. Eduardo

    Não sei se eu entendi, mas acho que você quer que abra em nova janela para as pessoas digitarem algo, infelizmente não encontrei esse código, e, acho que muitas pessoas preferem o botão de curtir como ele é, até acho que o fato de muitas pessoas terem curtido esse post e poucas enviado ele para o twitter reforça minha opinião.

    Você terá que tentar uma busca na web por coisas como:link para curtir ou link para compartilhar no facebook, ou botão para enviar para facebook.

    Você também pode visitar a página do Facebook que indiquei no inicio do post e ver no menu lateral se tem uma opção, porém, achei aquilo meio inútil.

    Responder
  11. ola testei no meu e aparece só o botão do twitter, sabe me dizer por que?


    abraço

    Responder
  12. Dj Robson Michel

    Se você colocou o código corretamente o botão do facebook também deveria aparecer, talvez se seu blog não for publico ele não apareça.

    Responder
  13. Mas onde devo colar esse código para divulgar cada post separadamente? Ao final de cada postagem...
    Aguardo

    Responder
  14. Deborah

    No blogger, esses códigos são adicionados como gadget, Html/JavaScript, clique e veja como.

    Depois de adicionar, você retorna ou vai em >blogger, >Design e Elementos da página, aí, você pode identificar o gadget(são uns quadros) e pode arrastar ele com o mouse para um local meio alto em elementos da página, alguns modelos ele até encaixa em cima da área de postagem do blog. Pode ver essa imagem, clique, é meio pesada...

    Responder
  15. Mas eu não quero por na lateral, somente no final de cada postagem...

    Responder
  16. Deborah

    Aí ficará muito difícil, se quiser fazer terá que mexer no HTML do blogger, não aconselho porque nem sempre sai exatamente como quer e depois é difícil de desfazer, mas se quiser fazer, é bom fazer uma cópia de seu código antes e praticar em um blog de testes, porque nesses casos, um caracter errado vai dar um erro grande.

    Terá que alterar o código acima para o blogger aceitar.

    Tem dois caracteres no código acima que devem ser alterados, observe com cuidado, os caracteres que deixei em verde(no post) deverão ser alterados, sendo assim, no código acima, precisará:

    Substituir <!-- por &lt;!--

    Substituir //--> por //--&gt;


    E depois ir em blogger.com >Design >Editar HTML e marcar a opção Expandir modelos de widgets, baixar seu modelo completo, depois localizar o código abaixo e colocar acima ou abaixo de um desses códigos que mostrarei abaixo, depois salvar e ver onde ficou, um deles deixa um pouco mais acima e outro um pouco mais abaixo.

    <div class='post-footer-line post-footer-line-1'>

    ou

    <div class='post-footer-line post-footer-line-2'>

    ou

    <div class='post-footer-line post-footer-line-3'>

    Muito cuidado, precisa ser antes ou depois de um desses, nem um caracter a mais e nem um a menos depois deles.

    Responder
  17. Alex4/7/11

    Oi, gostaria de saber se no botão do facebook tem como retirar a contagem. Como vou implantá-lo agora no meu site, não queria que aparecesse.

    Responder
  18. Alex

    Não sei porque tirar a contagem de envio para o Facebook, perde toda a graça, mesmo assim, se quiser vai precisar alterar um pouco os códigos, com muita atenção, qualquer caracter errado pode dar erro...

    Se você pegou o código para os botões que ficam na horizontal(estreito e largo), pode substituir width:90px; por width:55px;

    Se você vai usar os botões verticais, pode substituir height:65px; por height:20px; e no código para o botão vertical, substitua também box_count por button_count

    Para colocar no site não sei, você usa Html para criar ele? nesse caso você deve escolher um local apropriado entre as tags <body></body> e no caso do blogger eu deixei um link nesse post logo acima de onde comecei mostrar os códigos, "gadget, Html/JavaScript"

    Responder
  19. Lucas4/7/11

    Muito bom mesmo!!
    Olha só, eu coloquei o script e funcionou perfeitamente a parte do twitter. ele ta pegando o link, mas para o facebook ele nao pega a url inteira

    por exemplo:
    tenho essa pagina:
    http://gecascavel.org.br/index.php?subaction=showcomments&id=1307496897&archive=&start_from=&ucat=5&

    quando clico no curtir e verifico no meu facebook o link que aparece é esse:
    http://gecascavel.org.br/index.php?subaction=showcomments

    ele nao identifica a id do post

    sabe o que pode estar acontecendo?

    Responder
  20. Lucas

    O problema não me parece ser com o código acima, mas sim a forma que o Facebook interpreta a sua Url, me parece que ele simplesmente ignora tudo o que vier após esse caracter & &

    Sendo assim não sei o que fazer, talvez exista uma solução em Php para isso, já que suas páginas usam essa linguagem para gerar Url e acessar o conteúdo, mas você terá que buscar algo na web.

    Responder
  21. A contagem do número de pessoas que "curtem" a minha fan page no facebook está doida, ou seja, hora aparecem que tem 4 pessoas curtindo a página, hora aparece que tem 342 pessoas curtindo, que é o número total e real de pessoas no momento. Alguém sofre com esse mesmo problema? Alguém poderia me ajuda nisso?

    Segue abaixo a fan page caso ajude:

    https://www.facebook.com/Petit.Priere.Joias?ref=ts

    Muito obrigado desde já!

    abs,

    Matheus

    Responder
  22. Esse post é muito muito bom. Parabéns.
    Gostaria de saber qual o código para colocar o botão do orkut alinhado com os do facebook e twitter. Já tentei e não consigo. Ele fica sempre desalinhado, em uma linha à parte.

    Responder
  23. Carlos Romero

    Vou estudar isso, mas ainda poderá levar uns vinte dias, uma vez que tenho outras coisas em andamento e já com atraso.

    Responder
  24. Marcos31/8/11

    O botão do facebook simplesmente não aparece quando colocado no HTML, e quanto ao Twitter não teria como fazer a msm formúla? Pq estando na home e clicando em share do twitter de qualquer postagem a url divulgada é a da home e não do post clicado.

    Grato desde já

    Responder
  25. Marcos

    Da forma como está, ambos vão pegar a Url da página que está sendo acessada, pode existir outras maneiras, o twitter não pode ser da mesma maneira porque ele usa seu próprio Script para obter a Url acessada e gerar o iframe com o botão e a contagem, pode existir outras maneiras, teria que visitar o Twitter e procurar

    Responder
  26. Carlos Romero

    Como eu havia dito, quem quiser códigos como esses acima com botão de enviar para o Orkut, clica aqui

    Responder
  27. Oi estava mesmo procurando por isso. curtir somente o post e nao o blog. Mas tentei os codigos que vc passou e nao aparece o facebook. Pode me ajudar?

    Responder
  28. Tatiana Lucia

    O código gera os botões para a Url acessada, se a pessoa estiver na página inicial será para curtir ela, se estiver acessando a página de um post será para curtir ele, como você usa o blogger, nesse caso, o código é para adicionar como gadget, pode ser na lateral ou topo, mas é na área de gadget, não no HTML do blogger, por ventura, pode não aparecer um dos botões se a página demora muito para carregar ou o sistema do facebook estar lento ou outras coisas, mas ele foi testado aqui no post, em páginas comuns de Html, já usei em outros blogs e aqui uso um similar com uma adaptação para ficar em um script externo.

    Responder
  29. Obrigadaaaaaaa!!! consegui! Agora posso abusar mais um pouco??!!! não tem como colocar ele no rodapé do post???? Por favor!!!!
    Mais uma vez obrigada
    Olha como ficou:www.meuchocolateeeu.blogspot.com

    Responder
  30. Tatiana Lucia

    Esse código é mais para gadgets, ou quem cria páginas Html colocar em cada página individualmente.

    Para colocar exatamente abaixo do post não tem uma opção de gadget, ficaria abaixo do formulário de comentários, aí não adianta muito.

    O que poderia fazer é colocar no HTML para aparecer no final do post, como eu comentei acima, mas precisa mudar dois caracteres para o blogger aceitar e funcionar, e, tem um problema, isso apareceria na Home do blog e, seus visitantes poderiam pensar que, quando eles estão na Home estariam curtindo o post e na verdade estariam curtindo a Home, não seria um grande problema para o blog, nas páginas de postagens individuais tudo bem, curtiriam o post.

    Se você usa posts resumidos do blogger, poderia tentar colocar no final de cada post, o código como está no post acima funciona, mas teria que ser na opção Editar Html da postagem, e, talvez se passar para a opção escrever o blogger 'quebraria o código'

    Responder
  31. Primeiro obrigada! Agora, vamos ao resultado, coloquei na parte de html e de fato ele quebra o codigo. Só aparece se o leitor abrir pra ler o post inteiro. Mas esta bom, afinal a gente só curte o que ler né?!É trabalhoso, mas super válido! valeu, valeu, valeu!

    Responder
  32. O botão do facebook simplesmente não apareceu aqui! Pequei o modelo de botão Curtir Facebook claro e twitter padrão, horizontal e do lado direito, mas apareceu a esquerda e só o Twitter apareceu aqui... Pode me ajudar? Tem um código novo?

    Responder
  33. NeedHelp

    Eu testei eles e o problema que encontrei foi naquele que você indicou, mas ele apareceu, os botões estavam trocados, onde aparece o botão do Twitter estava aparecendo o do Facebook e vice-versa e apenas no Internet Explorer 7 eles estavam ficando um abaixo do outro, já mudei o código.

    Responder
  34. Aonde eu coloco esses html's?

    Responder
  35. Kuro

    No meio desse post, antes de começar a mostrar os códigos eu coloquei uma frase e um link que diz:"No blogger, esses códigos são adicionados como gadget, Html/JavaScript, clique" Você pode clicar no link e erá um post que mostra como colocar códigos na lateral do blogger, o mesmo processo serve para que esses códigos sejam colocados acima do post, como eu fiz aqui no blog.

    Responder
  36. Anônimo16/1/12

    Botão Curtir Não Tá Aparecendo!
    Só o do Twitter! =/
    Logo Agora Que Finalmente Descobri Uma Ótima Localização Para Eles... =/

    Responder
  37. Me ajudemmmmmmmmmmmmm pleaseeeeeeeeeeeeee!!!
    1- SEI COLOCAR O BOTÃO CURTIR NOS MEUS POSTS, PORÉM, O BOTÃO NÃO É PARA CADA POST DIFERENTE SERVE PARA TODA A PÁGINA. COMO POSSO CONSEGUIR QUE EM CADA POST QUE EU COLOCAR TENHA UM BOTÃO "NOVO"?

    Responder
  38. AS TAGS QUE TEM AQUI EU NÃO TENHO NO MEU BLOGGER, EU USEI data:post.body E SÓ APARECEU O BOTÃO DO TWITER,COMO RESOLVER ESSE PROBLEMA?

    Responder
    ...Respostas
    1. Como eu disse o código pega a Url da página que foi acessada, aquela que fica na barra de endereços do navegador, Você pode conseguir um parecido que se aplica a postagens mesmo na home-page, veja botão compartilhar do blogger, clique aqui

    2. Esse compartilhamento eu conheço, porém, o que nao consigo é que a cada post publicado eu quero ter um novo botão curtir novo começando do zero... entendeu?

    3. Sim, mas eu não consegui fazer com que o código capturasse a url de cada postagem quando na Home do blog, hoge estou com pouco tempo, vou tentar novamente daqui alguns dias, se eu conseguir postarei, se não deixarei para trás.

    4. AGRADEÇO A SUA ATENÇÃO VC FOI ATENCIOSO, OBRIGADA. VOU AGUARDAR OK.

  39. Irmãozinho; atualiza o post, porque os botões de facebook não estão funcionando mais((( passei aqui só para dar este toque ))) abraços !!!

    Responder
    ...Respostas
    1. O botão do Facebook que está nesse post funciona e é gerado por um dos códigos que mostrei no post.

      Talvez você não estivesse logada ou outra coisa pode ter acontecido, o botão está funcionado e para ter certeza que eu não tivesse alterado eles eu testei novamente todos os códigos desse post, se quiser ver o resultado, clique aqui

  40. Este comentário foi removido pelo autor.

    Responder
  41. Perfeito!!! o melhor q eu encontrei.. deu td certo.. passei o dia todo procurando isso e encontrei aqi da forma mais simples. PARABÉNS!!!

    sutilmentefeminina.blogspot.com.br

    Responder
  42. Olá! No meu blog só aparece o Twitter, Facebook não. Como façopara aparecer o curtir do Face?

    Responder
    ...Respostas
    1. Esses códigos não são para colocar no HTML do blogger, apenas para páginas comuns em html ou área de gadgets do blogger, se você quer código de botões para HTML do blogger, clique aqui

  43. Helena22/4/12

    Obrigada por me responder! Vou tentar colocar o botão do Face!!

    Responder
  44. Olá de novo!
    Realmente não sei qual é o problema do blog. Simplesmente não da para colocar o botão do qual você me passou o link. Dessa vez, dá erro. Talvez o layout do blog tenha algum problema, já que nem os botões do proprio blogger,aquele que é só marcar para aparecer no final de cada post, também não aparece. Tem algo a sugerir?

    Responder
    ...Respostas
    1. Para os botões de compartilhamento funcionarem, no caso daquele outro código de botões para HTML do blogger, você deve ler com atenção, tem mais de um código, diferente dos códigos desse post acima, naquele outro que indiquei, um dos códigos vai no HTML do blogger e o outro vai na opção adicionar gadget do tipo HTML/JavaScript, se mesmo colocando eles corretamente der um aviso de erro, aí pode ser porque a parte do código que vai no HTML do blogger foi colocado em uma área que não permite códigos, ou o código não é para aquela área.

  45. Helena24/4/12

    Primeiramente,obrigada por sua atenção!
    Fiz extamente,passo a passo,como foi recomendado. Agora não deu erro. Mas os botões simplesmente não aparecem.

    Responder
    ...Respostas
    1. Nos códigos de botões para partilhar que está no outro post que indiquei tinha um com uma linha de código a mais e dava uma mensagem de erro ao tentar adicionar no blogger, eu corrigi ele e coloquei num blog de testes com modelo diferente e funcionou, no momento desse comentário eu estou usando aqui no blog abaixo do post e também está funcionando.

  46. Oi o botão do Twitter foi numa boa agr já o do "curtir" num foi, por favor me dá uma ajuda ae!!!!

    Responder
    ...Respostas
    1. Talvez você tenha colocado o código dos botões numa área que não aceita eles, os botões desse post são para usar como gadget ou em páginas Html comuns, existem plataformas que esse código não funciona, isso eu comentei no texto da postagem, acima.

  47. Nossa Muito Massa Aproveitando dêêm Uma Olha dinha no Meu Blog é www.maquiagemparatodasasocasioes.blogspot.com

    Responder
  48. ola!

    estou colocando os codigos em html no final da postagem, mais somente aparece o botão do twitter!!

    alguma ajuda?!

    obrigado

    Responder
  49. ps:o codigo esta indo entre:div class='post-footer-line post-footer-line-1'

    mais só aparece o twitter...

    Responder
  50. ja consegui resolver o problema,

    editei um codigo seu com outros codigos, valeu

    obrigado!

    Responder
    ...Respostas
    1. Eu criei um novo post com códigos de botões para o blogger, no texto dessa postagem acima tem um link para ele e um aviso de atualização.

  51. ola boa tarde gostaria de saber porque n esta apareçendo curtir e sim like ? obrigado....

    Responder
    ...Respostas
    1. Pelo que percebi provavelmente o Like ou curtir depende da configuração de idioma do navegador do usuário, eu mudei o idioma do Chrome para inglês e apareceu Like e ao mudar para português(Brasil) apareceu curtir.

→Dê sua opinião. Faça comentário relacionado ao post.
Comentário com e-mail será excluído
Antes de perguntar leia o texto até comentários e pesquise, a resposta virá no comentário, para ser avisado use uma conta e o link: Subscribe by email(abaixo)
Será excluído comentário não relacionado ou com Url de blog/site(Divulgar? Clique)

Comentário reflete a opinião do comentarista. Desde já, Obrigado!