Postagens | Dicas blog, Imagem, Pc Windows

Códigos pra colocar +1 botão do Google, Facebook, Twitter e Orkut em blogs e sites

Código para colocar botão de enviar pro Orkut, Twitter, Facebook e para votar no +1 do Google em blogs ou sites.

Esses botões são bons porque quando a pessoa compartilhar com os amigos um conteúdo do seu blog eles aumentam a chance de seu blog receber mais e novas visitas.

Os códigos dos botões são para adicionar na área de gadgets ou, para quem faz páginas em Html deverá colocar no HTML entre as tags <body> </body>, já quem usa plataformas como o blogger, esses tem locais específicos, que são a área de gadget do tipo HTML/JavaScript, para ver como colocar códigos na área de gadgets do blogger, clique aqui.

Quem quiser apenas os botões curtir e twitar, clique aqui

Os botões, são uma maneira das pessoas marcar seus conteúdos preferidos e enviar para redes sociais, três deles fazem uma contagem de quantas pessoas curtiram, twitaram, no caso do botão +1 do Google, esse é uma maneira do Google saber os artigos que as pessoas gostaram e usar isso como métrica para elevar esses artigos um pouco mais acima nos resultados de busca, o botão para enviar para o Orkut é uma novidade e maneira da pessoa mandar uma anotação para o Orkut, sobre um conteúdo que tenha gostado, e, como muitos brasileiros usam o Orkut, acho que não devemos deixar de aproveitar essa oportunidade, infelizmente, esse ainda não criou um botão com contagem.
compartilhar no orkut
Para testar os botões =>
Se os botões não funcionarem aqui, é devido a página que ficou pesada em função do uso excessivo de estilo, imagem e tipos de códigos apresentados nesse post.
Em alguns navegadores, especialmente o Google Chrome, talvez você precise estar logado numa conta do Google para ver o botão +1
Atenção: Você pode 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 o nome de usuário do twitter, onde diz data-via='foitestado' substitua foitestado pelo seu nome de usuário do Twitter, com cuidado para não retirar as aspas e não alterar o endereço das imagens que tem o endereço foitestado.com, 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/FQ3xt Via @foitestado

Onde diz Enviar para Orkut você pode alterar para algo como Orkutar, mas adicione apenas letras, outros caracteres podem fazer o código não funcionar, essa frase o usuário vê quando passa o mouse sobre o botão, pelo menos na maioria dos navegadores.
Com cuidado, você também pode excluir esses trechos que deixei em vermelho, <!-- inicio facebook -->, isso são só anotações para saber onde inicia um botão, mas se for excluir essa anotação, não esqueça nem um caracter.

Usei imagens(ilustrações) de botões para mostrar como eles ficarão, porém, podem ficar um pouco diferente dependendo de alguns fatores como navegador e suas configurações ou estilo do blog.

Botões grandes, +1 do Google, Orkut, Facebook e Twitter

Os botões grandes, além de terem mais destaque aumentando assim a chance de um clique, eles também são mais fáceis de organizar, você verá que eles ficam bem em pares, na horizontal e vertical e os quatro botões até na horizontal tem uma largura boa para usar como gadget na lateral do blog.
Nos dois códigos abaixo permitem que outras coisas fiquem ao lado, para que eles continuem ao lado mas impeçam outras coisas de ficarem do lado deles você pode substituir width:240px; por width:100%;display:block;
+1 do Google, Orkut, Facebook e Twitter grandes na horizontal a esquerda
Botões enviar para orkut, twitter, facebook e dar pontos no google + umO código abaixo é para os botões ficarem do lado esquerdo de qualquer coisa, desde que sobre espaço para essa 'coisa'. A largura da DIV que contém os botões é aproximadamente 250 pixel
<div style="width:240px;float:left;margin:3px 4px;"><!-- inicio facebook --><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;float:left;margin-right:4px'></iframe>"); //--></script><!-- fim facebook --><!-- inicio twitter --><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='width:55px;float:left;margin-right:5px'><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div><!-- fim twitter --><!-- inicio orkut --><script type="text/javascript"><!--
urlc=window.location.href;urltt=document.title;document.write("<a class='ork123' title='Enviar para Orkut' href='//promote.orkut.com/preview?nt=orkut.com&tt="+urltt+"&du="+urlc+"' rel='nofollow' target='_blank' style='text-decoration:none;float:left'><img src='//foitestado.com/blogs/share/orkut-8.png' alt='compartilhar no orkut' style='width:50px;height:62px;border:0;background:transparent;padding:0;margin:0 4px 0 0;'/></a>");
//--></script><!-- fim orkut --><!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script><div style='width:55px;height:65px;float:left;margin:1px 0 0 0;'><div class="g-plusone" data-size="tall" data-count="true"></div></div><!-- fim +1google --></div>
+ 1 do Google, Orkut, Facebook e Twitter grande na horizontal a direita
Botão envie para orkut, twitter, facebook e marcar pontos no google mais umO código abaixo é para os botões ficarem do lado direito de qualquer coisa, desde que sobra espaço para algo. A largura da DIV que contém os botões é uns 250 pixel.

<div style="width:240px;float:right;margin:3px 4px;"><!-- inicio facebook --><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;float:left;margin-right:4px'></iframe>"); //--></script><!-- fim facebook --><!-- inicio twitter --><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='width:55px;float:left;margin-right:5px'><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div><!-- fim twitter --><!-- inicio orkut --><script type="text/javascript"><!--
urlc=window.location.href;urltt=document.title;document.write("<a class='ork123' title='Enviar para Orkut' href='//promote.orkut.com/preview?nt=orkut.com&tt="+urltt+"&du="+urlc+"' rel='nofollow' target='_blank' style='text-decoration:none;float:left'><img src='//foitestado.com/blogs/share/orkut-8.png' alt='compartilhar no orkut' style='width:50px;height:62px;border:0;background:transparent;padding:0;margin:0 4px 0 0;'/></a>");
//--></script><!-- fim orkut --><!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script><div style='width:55px;height:65px;float:left;margin:1px 0 0 0;'><div class="g-plusone" data-size="tall" data-count="true"></div></div><!-- fim +1google --></div>
+ 1 do Google, Orkut, Facebook e Twitter grande na horizontal centralizado
Botão envie para orkut, twitter, facebook e marcar pontos no google mais um
O código abaixo é para os botões ficarem no centro da área onde forem colocados e impedir que qualquer coisa fique ao lado.
<div style='width:100%;'><div style="width:240px;display:block;margin:0 auto;"><!-- inicio facebook --><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;float:left;margin-right:4px'></iframe>"); //--></script><!-- fim facebook --><!-- inicio twitter --><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='width:55px;float:left;margin-right:5px'><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div><!-- fim twitter --><!-- inicio orkut --><script type="text/javascript"><!--
urlc=window.location.href;urltt=document.title;document.write("<a class='ork123' title='Enviar para Orkut' href='//promote.orkut.com/preview?nt=orkut.com&tt="+urltt+"&du="+urlc+"' rel='nofollow' target='_blank' style='text-decoration:none;float:left'><img src='//foitestado.com/blogs/share/orkut-8.png' alt='compartilhar no orkut' style='width:50px;height:62px;border:0;background:transparent;padding:0;margin:0 4px 0 0;'/></a>");
//--></script><!-- fim orkut --><!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script><div style='width:55px;height:65px;float:left;margin:1px 0 0 0;'><div class="g-plusone" data-size="tall" data-count="true"></div></div><!-- fim +1google --></div></div>
+1 do Google, Orkut, Facebook e Twitter grandes na vertical a esquerda
botões +1 go google, enviar pro orkut, twittar e curtir no facebookO código abaixo é para que todos os botões fiquem verticalmente, as vezes a gente acha aquele local com espaço sobrando e que nada cabe... Esse aí ocupa menos de 65 pixel, fica no lado esquerdo e permite outras coisas do lado dele.<div style="width:55px;float:left;margin:2px 5px 0 2px;"><!-- inicio twitter --><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='width:55px;float:left'><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div><!-- fim twitter --><!-- inicio facebook --><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;float:left'></iframe>"); //--></script><!-- fim facebook --><!-- inicio orkut --><script type="text/javascript"><!--
urlc=window.location.href;urltt=document.title;document.write("<a class='ork123' title='Enviar para Orkut' href='//promote.orkut.com/preview?nt=orkut.com&tt="+urltt+"&du="+urlc+"' rel='nofollow' target='_blank' style='text-decoration:none;float:left'><img src='//foitestado.com/blogs/share/orkut-5.png' alt='compartilhar no orkut' style='width:51px;height:61px;border:0;background:transparent;padding:0;margin:3px 0 2px 0;'/></a>");
//--></script><!-- fim orkut --><!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script><div style='width:55px;height:65px;float:left'><div class="g-plusone" data-size="tall" data-count="true"></div></div><!-- fim +1google --></div>
+1 do Google, Orkut, Facebook e Twitter grandes na vertical lado direito
botões +1 go google, enviar pro orkut, twittar e curtir no facebookO código abaixo é para que todos os botões fiquem verticalmente. Ocupa menos de 65 pixel, fica no lado direito e permite outros elementos do lado dele.<div style="width:55px;float:right;margin:2px 2px 0 5px;"><!-- inicio twitter --><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='width:55px;float:left'><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='tweet'></a></div><!-- fim twitter --><!-- inicio facebook --><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;float:left'></iframe>"); //--></script><!-- fim facebook --><!-- inicio orkut --><script type="text/javascript"><!--
urlc=window.location.href;urltt=document.title;document.write("<a class='ork123' title='Enviar para Orkut' href='//promote.orkut.com/preview?nt=orkut.com&tt="+urltt+"&du="+urlc+"' rel='nofollow' target='_blank' style='text-decoration:none;float:left'><img src='//foitestado.com/blogs/share/orkut-5.png' alt='compartilhar no orkut' style='width:51px;height:61px;border:0;background:transparent;padding:0;margin:3px 0 2px 0;'/></a>");
//--></script><!-- fim orkut --><!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script><div style='width:55px;height:65px;float:left'><div class="g-plusone" data-size="tall" data-count="true"></div></div><!-- fim +1google --></div>

Quadrado com botão grande do Facebook, Twitter, Orkut e +1 do Google

Um quadrado com esses modelos de botões é um bom jeito para colocar os botões do lado de algo, um espaço sobrando com pequena largura de 120 pixel
Quadro com botões +1, Orkut, Twitter e curtir do lado esquerdo
botão curtir no facebok, enviar para orkut ou twiter e votar em mais um do googleO código abaixo cria os botões e fará eles ficarem do lado esquerdo e deixa a sobra de largura para outras coisas, como gadgets ou textos...
<div style="width:113px;float:left;margin:3px;"><!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script><div style='width:55px;height:67px;float:left;padding-top:1px'><div class="g-plusone" data-size="tall" data-count="true"></div></div><!-- fim +1google --><!-- inicio facebook --><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:68px;float:left'></iframe>"); //--></script><!-- fim facebook --><!-- inicio orkut --><script type="text/javascript"><!--
urlc=window.location.href;urltt=document.title;document.write("<a class='ork123' title='Enviar para Orkut' href='//promote.orkut.com/preview?nt=orkut.com&tt="+urltt+"&du="+urlc+"' rel='nofollow' target='_blank' style='text-decoration:none;float:left'><img src='//foitestado.com/blogs/share/orkut-5.png' alt='compartilhar no orkut' style='width:49px;height:61px;border:0;background:transparent;padding:0;margin:0 4px 2px 0;'/></a>");
//--></script><!-- fim orkut --><!-- inicio --><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='width:55px;float:left'><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='Tweet'></a></div><!-- fim twitter --></div>
Quadro com botões +1, Orkut, Twitter e curtir do lado direito
botões curtir no facebok, envio para orkut ou twiter e aprovar com + um do googleO código abaixo cria os botões e fará eles ficarem do lado direito, deixando sobra de largura para outras coisas, como gadgets ou textos...<div style="width:113px;float:right;margin:3px;"><!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script><div style='width:55px;height:67px;float:left;padding-top:1px'><div class="g-plusone" data-size="tall" data-count="true"></div></div><!-- fim +1google --><!-- inicio facebook --><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:68px;float:left'></iframe>"); //--></script><!-- fim facebook --><!-- inicio orkut --><script type="text/javascript"><!--
urlc=window.location.href;urltt=document.title;document.write("<a class='ork123' title='Enviar para Orkut' href='//promote.orkut.com/preview?nt=orkut.com&tt="+urltt+"&du="+urlc+"' rel='nofollow' target='_blank' style='text-decoration:none;float:left'><img src='//foitestado.com/blogs/share/orkut-5.png' alt='compartilhar no orkut' style='width:49px;height:61px;border:0;background:transparent;padding:0;margin:0 4px 2px 0;'/></a>");
//--></script><!-- fim orkut --><!-- inicio --><script src='//platform.twitter.com/widgets.js' type='text/javascript'></script><div style='width:55px;float:left'><a class='twitter-share-button' data-count='vertical' data-via='foitestado' href='//twitter.com/share' rel='nofollow' title='Tweet'></a></div><!-- fim twitter --></div>

Botões +1, Orkut, Twitter e Facebook retangulares alinhado horizontalmente

botões curtir no facebook, twitar no twitter, votar em mais 1 do google e enviar para orkut

Esse é simples, porém, é para áreas um pouco largas do blog, como está ele irá ocupar todo o espaço disponível no local onde for colocado, isso porque a largura dele está em 100% e se você quiser colocar num local do seu site/blog que tenha largura maior de 358 pixel e quiser que ele fique do lado esquerdo de outra coisa, poderá mudar o valor 100% para 358px, e para ficar do lado direito de outras coisas basta substituir o primeiro left por right. Mas, como existem poucas áreas com larguras bem maiores que 358 pixel, sendo assim não é muito recomendado para esse código logo abaixo ser alterado as larguras e alinhamento.<div style="width:100%;float:left;margin:3px;height:20px;"><!-- inicio facebook --><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><!-- fim facebook --><!-- inicio twitter --><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><!-- fim twitter --><!-- inicio orkut --><script type="text/javascript"><!--
urlc=window.location.href;urltt=document.title; document.write("<a class='ork123' title='Enviar para Orkut' href='//promote.orkut.com/preview?nt=orkut.com&tt="+urltt+"&du="+urlc+"' rel='nofollow' target='_blank' style='text-decoration:none;float:left'><img src='//foitestado.com/blogs/share/orkut-7.png' alt='compartilhar no orkut' style='width:58px;height:21px;border:0;background:transparent;padding:0;margin:0 9px 0 0;'/></a>");
//--></script><!-- fim orkut --><!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script>
<div style='width:90px;height:21px;float:left;padding-top:1px;'><div class="g-plusone" data-size="medium" data-count="true"></div></div><!-- fim +1google --></div>
Botões facebook, orkut, twitter e mais 1 retangulares em par
Esse não é muito recomendável usar, com muitos votos(pontos) os botões mudam de largura e fica com aparência irregular

Do modo que está abaixo fica no lado esquerdo, para ficar do lado direito basta substituir o primeiro left por right<div style="width:203px;float:left;margin:3px;"><!-- inicio facebook --><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:110px;overflow:hidden;height:20px;'></iframe>");
//--></script><!-- fim facebook --><!-- inicio orkut --><script type="text/javascript"><!--
urlc=window.location.href;urltt=document.title; document.write("<a class='ork123' title='Enviar para Orkut' href='http://promote.orkut.com/preview?nt=orkut.com&tt="+urltt+"&du="+urlc+"' rel='nofollow' target='_blank' style='text-decoration:none;float:left'><img src='http://foitestado.com/blogs/share/orkut-7.png' alt='compartilhar no orkut' style='width:58px;height:21px;border:0;background:transparent;padding:0;margin:0 2px 2px 0;'/></a>");
//--></script><!-- fim orkut --><!-- inicio twitter --><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><!-- fim twitter --><!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script><div style='width:90px;height:20px;float:left;'><div class="g-plusone" data-size="medium" data-count="true"></div></div><!-- fim +1google --></div>

Quem usa o blogger e quiser os botões de partilhar abaixo de cada post(clique), ficará como esses logo abaixo.

41 comentários:

  1. obrigada pelos códigos e a possibilidade de compartilhar o que fazemos(postamos);
    vc teria o código para a rede social LINKEDIN?

    ResponderExcluir
  2. LMady

    Não vou postar ele aqui porque o post já está grande demais e os tamanhos dele é um pouco diferente dos outros botões, mas você pode pegar o código do botão linkedin nessa página, clique aqui, se você escolher um modelo e colocar depois ou antes de alguns dos códigos acima, ele ficará do lado e pode até ficar bonito(organizado).

    ResponderExcluir
  3. Obrigado Me Ajudou muito, pois tava procurando Isso a um tempao vlw muito obrigado chefia!!!!! Abraços

    ResponderExcluir
  4. Anônimo1/10/11

    o botão +1 não está funcionando

    ResponderExcluir
  5. Anônimo

    Quase todos os botões são baseados em Javascript e pode ter outro script que interfira no funcionamento de um deles.

    Eu já percebi que as vez quando tem um botão +1 de outro formato um deles pode apresentar problema, nesse caso o problema acho que é do Google e não meu. Eu só pego o código que essas redes cedem e disponibilizo de modo organizado a ficarem alinhados e/ou de modo que consigam capturar a Url e título da página.

    Eu deixei marcado onde começa um e termina outro para que possam remover ou mudar algum deles, talvez com o passar do tempo o Google perceba esse problema e resolva ele.

    ResponderExcluir
  6. Obrigado pelo compartilhamento, já adicionei os botões ao www.profissaointernet.com.br.

    Apenas uma correção:

    Os botões do Orkut e do +1 ficam um pouco acima dos outros. A solução é simples: Alterar, nos estilos CSS, a margem superior do Orkut para 5px e a margem superior do +1 para 6px.

    Sucesso!

    ResponderExcluir
  7. Anônimo10/10/11

    Bom trabalho! valeu estou seguindo!

    ResponderExcluir
  8. Davi -

    O problema do botão do google é que ele um pouco menor que os outros, mesmo assim, já diminui 1 pixel a distancia do topo para os botões Orkut e +1Google, apenas da versão horizontais e botão quadrado

    ResponderExcluir
  9. Muito bom ...Me ajudou muito...obg!

    ResponderExcluir
  10. Oi ,problemas! coloquei os botões mas quando a pessoa curti no blog na pagina do facebook só apareceu o endereço do blog como um todo sem mencionar o post e anda por cima com outra imagem. ai, me ajuda!

    ResponderExcluir
  11. Tatiana Lucia

    Infelizmente não podemos interferir e manipular qual parte do texto ou imagem é enviada para o Facebook, é o sistema deles quem decide que parte da página será curtida, mas se o código for inserido corretamente o link de retorno geralmente funciona bem.

    ResponderExcluir
  12. uma pena, mas... super obrigada por me ajudar! abraços!

    ResponderExcluir
  13. Galera, inclui no meu site, só que o botão do +1 não está funcionando, após clicar no botão, ele fica com exclamação vermelha.

    Alguem por me ajudar??

    http://www.ambiancebijoux.com.br

    Valew

    Marcelo Collina

    ResponderExcluir
  14. jj

    As vezes ocorre um problema no carregamento, tenta recarregar(atualizar) a página e ver se persiste, outra coisa é que a mesma pessoa só pode votar uma vez por página.

    ResponderExcluir
  15. aqui nao apareceu o botao do facebook :/

    ResponderExcluir
  16. Jean Jonathas

    As vezes ocorre um problema no carregamento, tenta recarregar(atualizar) a página e ver se persiste, outra coisa é que a mesma pessoa só pode votar uma vez por página.

    ResponderExcluir
  17. Olá, preciso de ajuda!
    Se adicionar os códigos a uma miniaplicação de html, funciona às mil maravilhas, mas se adicionar por cima da linha de código:
    <*div class='post-body entry-content'>
    Apenas aparece o Twitter e o Google +
    Se me puder ajudar agradeço :D

    ResponderExcluir
    Respostas
    1. Eu Jogador

      Vou ficar devendo, o que sei é que na página que já tiver um botão Google+ apenas um deles funciona, fora isso não sei o que pode ser, talvez a largura e altura, ou, se tenta adicionar diretamente no HTML de modelo do blogger precisa substituir alguns caracteres, nos códigos acima seriam 4 caracteres, deve ser observado com muita atenção, estão mostrados nesses trechos abaixo:

      <script type="text/javascript"><!--

      por esse:

      <script type="text/javascript">&lt;!--

      E também substituir esse:

      //--></script>

      Por esses:

      //--&gt;</script>

      Excluir
  18. Muito obrigado, achei tudo que eu queria detalhadamente.

    ResponderExcluir
  19. Anônimo1/3/12

    Boa noite
    Obrigado pelos código, ajudou muito.

    Tenho uma dúvida, como sei que o botã do facebook está indicando a minha página?

    Obrigado pela atenção!

    ResponderExcluir
    Respostas
    1. Dá uma curtida em sua página, acessa o Facebook e procura lá, se encontrar...

      Excluir
  20. Muito bom post amigo, teria como acrescentar o botão "Compartilhar " No facebook amigo além do curti deixando os dois ?

    ResponderExcluir
    Respostas
    1. Se você tem o código desse botão pode acrescentar junto ao código acima, logo após <!-- fim +1google --> mas, principalmente no modelos que ficam horizontalmente, talvez você teria que aumentar a largura da primeira div, geralmente é o primeiro número que está logo depois de width:

      Excluir
  21. eu coloco com gadet mais eu qro q ela saia da barra e fike do lado esquerdo flutuando onde eu coloco o codigo no css ? falto isso no posto o local pra por os codigos

    ResponderExcluir
    Respostas
    1. Para colocar os botões no blogger, pode usar a opção adicionar gadgets, no inicio dessa postagem eu criei um link para um post que explica como coloca códigos na área de gadgets do blogger.

      Se você quer que fique flutuando, pode no inicio do código acima, logo na primeira DIV acrescentar um estilo para isso, nos códigos acima e na primeira div, aquela que segura todos os outros elementos, logo depois de <div style=" você pode, para ficar parada do lado esquerdo, acrescentar esse código:

      position:fixed;z-index:1000;top:210px;left:5px;

      Ou para ficar parada do lado direito, acrescentar esse código:

      position:fixed;z-index:1000;top:210px;right:5px;

      nesses códigos que mostrei agora, você pode aumentar ou diminuir esses valores acima top:210px que é para a distância a contar do topo, se diminuir esse valor o gadget sobe, se aumentar ele vai mais para baixo, esse outro é para a distância da lateral 5px;

      Excluir
  22. Muito interessante. Obrigado pelas dicas"

    ResponderExcluir
  23. Ola,

    Acabei de adicionar os botões grandes na vertical lado direito, mas só apareceu o do Google+1 e do Twitter os outros não apareceram.
    Agradeceria se me desse uma ajuda.

    Meu blog
    http://renatamanfredi.blogspot.com.br

    Fico no aguardo
    Obrigado
    Bjoos

    ResponderExcluir
    Respostas
    1. Se você colocou o código dos botões de partilhar diretamente no HTML do blogger pode não dar certo,
      porque esse código é para a área de gadgets e o blogger 'rejeita' ele quando inserido no HTML.

      Se não foi esse o caso, então poderia ser um conflito de outro script em seu blog, o que poderia causar isso é a seguinte variáveis urlc, e urlb e também urltt, nos scripts acima, encontre estes trechos(nomes) e adicione um x exatamente antes e depois de cada um deles, aí, por exemplo, invés de ter urlb você terá em seu código esse trecho xurlbx, mas, atenção que esse trecho se repete várias vezes e tem os outros que tem nomes parecidos.

      Excluir
  24. Este comentário foi removido por um administrador do blog.

    ResponderExcluir
    Respostas
    1. A poucos dias um criei post com códigos dos botões que funcionam no HTML do blogger, clique aqui.

      Desculpe, mas por conter email, tive que remover seu comentário que segue abaixo:

      " como eu faço para colocar embaixo de cada post, ai a pessoa não curte o link do blog e sim do o link dopost que ela estava lendo... manda resposta para xxxx@xxxx que te dou um doçe o/
      e veja como esta ficando www (.) artdepixel.blogspot... esse dominio é de test "

      Excluir
  25. Muito bom e bem explicadinho!

    ResponderExcluir
  26. Anônimo28/5/12

    Muito bom, foi muito útil para mim, pois estou terminando um site e precisava disso.

    ResponderExcluir
  27. gostaria de saber como faco para criar um campo no meu site com os links mais curtido do site. Alguem pode me ajudar

    ResponderExcluir
    Respostas
    1. Um gadget assim dependeria do Facebook ou um desenvolvedor altamente avançado para criar, acho que ainda não tem um assim.

      Mas, para quem usa o blogger, tem o gadget de posts mais populares do blog, ele mostra as postagens que tem mais sucesso entre os leitores, não é o que você quer e nem a mesma coisa, mas, para mostrar as postagens 'melhores', ele não fará distinção entre usuários do Facebook ou outras redes, ou seja, será mostrado os posts que a maioria gostaram, e não apenas aqueles que só os usuários do Facebook mais curtiram.

      Excluir
  28. Oi! Nossa me ajudou muito ^^ estava doida atras disso a um tempão, pois meus botões nunca apareceram ... kkkk... segui tutorial direitinho e apareceu, dai o +1 teimoso não queria dar a cara, então acrescentei o codigo do button e funcionou! Uau! conseguimos ;) bjus e mais uma vez obrigada.

    ResponderExcluir
  29. Muito bom, só uma coisa todos os botões aparecem mas o do +1google fica um pouco abaixo dos outros, como acerto isso e onde acerto isso.

    ResponderExcluir
    Respostas
    1. As vezes os estilos de botões mudam por intervenção dos sites deles, no caso do google+1, os estilos foram criados baseados em como estavam na época e numa tentativa de adequar eles a ficarem parecidos. Ainda assim, algum estilo de seu blog pode agir sobre eles.

      Mas, você pode incluir ou mudar um estilo de alinhamento para alguns deles, com muita atenção, no caso do google+1 localize esse trecho:
      <!-- inicio +1google -->

      esse trecho acima é onde começa o código do botão Google+1, um pouco após esse trecho que mostrei encontre:
      div style=' e antes da próxima aspa' estão os estilos para esse elemento, ou seja, logo após style= tem um caracter abre-aspas e códigos e um fecha-aspas, entre essas duas aspas estão os estilos, verifique se no seu código tem padding-top:1px e se tiver mude para padding-top:0px ou então esse margin:1px 0 0 0 e mude para isso margin:0px 0 0 0 mas se não tiver nem um desses, aí pode acrescentar, exatamente antes do fecha-aspas, esses trechos:
      ;padding-top:0px;margin-top:0px;

      Observe que, neste ultimo caso, parte do código poderia ficar parecido com isso:

      <!-- inicio +1google --><script type="text/javascript" src="//apis.google.com/js/plusone.js">
      {lang: 'pt-BR'}
      </script><div style='width:55px;height:65px;float:left;margin:1px 0 0 0;padding-top:0px;margin-top:0px;'>

      Excluir
  30. Cara, gostei do código. Eu aprimorei ele diretamente no template do blog.

    ResponderExcluir
  31. parabéns fiz isso no meu blog e ficou show de bola
    acessem http://www.jackellinefernandes2.blogspot.com

    ResponderExcluir

→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!

Postagens Populares