Como adicionar o botão +1 do Google ao seu site

0
0 Flares 0 Flares ×

Veja como colocar o botão “+1? do Google em suas páginas e dar a oportunidade para leitores, usuários e clientes recomendarem as suas páginas para os amigos e muitas outras pessoas através da melhora do seu ranking nas páginas de busca do próprio Google.

O que é o botão “+1??

Uma das novidades mais interessantes do ano, o botão “+1? criado pelo Google, possibilita que usuários indiquem que uma página, post ou site é relevante, interessante para eles. É bem parecido com o botão “Curtir” do Facebook, porém está ligado à rede social do próprio Google, a Google+ (Plus). Ele já pode ser visto em grande parte dos portais e blogs e é uma ótima ferramenta para melhorar a interação dos usuários com o seu site.

Qual a vantagem em usá-lo?

Quando clica no botão “+1?, é como se o usuário dissesse para o Google “Ei, eu acho que essa página tem um conteúdo interessante e pode ajudar outras pessoas”. E a empresa já deu indicações de que o número de usuários que clicam no botão “+1? de uma determinada URL tem impacto no seu ranking de buscas. Ou seja, se vários usuários clicarem no botão “+1? da sua página é bem provável que você suba algumas posições nas páginas de busca. E mais, se um dos meus contatos tiver clicado no botão “+1? de uma das páginas do seu site, essa página aparecerá como recomendada pra mim quando eu fizer uma busca no Google.
Depois de clicar no botão o usuário pode ainda fazer um comentário sobre a página, fazendo assim um post no seu perfil do Google+ (se tiver um perfil lá) e gerarando ainda mais tráfego para seu endereço.

Código

Vou mostrar aqui como usar a opção de carregamento assíncrona do botão, aquela em que o botão será adicionado após o carregamento da sua página, deixando-a mais rápida e impedindo que qualquer problema nos servidores do Google possam vir a prejudicar seu site.
São basicamente duas partes. A primeira é o botão em si, que usa a seguinte tag:

1.<g:plusone size="medium" annotation="inline"></g:plusone>

 

 

Basta colocar este trecho de código no lugar onde você quer que o botão apareça. Abaixo do título da página ou ao final do texto do post, por exemplo. Perceba que ela tem duas propriedades, size e annotation. Logo mais vou explicar como você pode usá-las para obter a melhor configuração para o seu caso.

Depois, ao final da página coloque o código que irá carregar substituir a tag acima pelo botão em si. Note que este código deve vir sempre depois da tag do botão.

01.<script type="text/javascript">
02.window.___gcfg = {lang: 'pt-BR'};
03.
04.(function() {
05.var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
07.var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
08.})();
09.</script>

Note aqui que colocamos, logo no início da tag, a opção “lang” configurada com o valor ‘pt-BR’. Isso é importante pois configura o botão para usar o idioma “Portugês do Brasil”.

Tamanho e tipo

Usando as propriedades size e annotation é possível alterar o tamanho e o tipo do botão “+1?. Existem 4 tamanhos (size) disponíveis: Small (pequeno) 24px de largura, Medium (médio) 20px, Standard (padrão) 24px e Tall (largo) 60px. Além disso você pode escolher entre três maneiras diferentes de exibir a o número de pessoas (annotation) que já clicaram e marcaram aquela página com ‘+1?: Inline (linha de texto), Bubble (balão) e None (nenhum). Combinando essas opções você terá 12 tipos diferentes de botão:

Tupo o que você precisa fazer é escolher qual das combinações melhor se ajusta ao seu layout e alterar a tag do botão ajustando estas propriedades.

Alguns exemplos:

1.<g:plusone size="standard" annotation="bubble"></g:plusone>

 

 

1.<g:plusone size="medium" annotation="inline"></g:plusone>

 

 

1.<g:plusone size="tall" annotation="bubble"></g:plusone>

 

 

1.<g:plusone size="small" annotation="none"></g:plusone>

 

 Por Domênico Citrângulo

0 Flares Twitter 0 Facebook 0 Google+ 0 0 Flares ×

Deixe seu comentário sobre esté Post do Blog

Comente a Publicação