O Facebook já é a maior Rede Social do mundo. Até mesmo no Brasil, onde o Orkut domina, a plataforma vem apresentando um crescimento exponencial no número de cadastrados. Além de ter uma quantidade enorme de usuários, o que impressiona é a quantidade de usuários ativos: 500 milhões. Segundo a própria empresa, aproximadamente 50% desses usuários entram diariamente no “livro de caras”.
É muito tráfego! Exatamente por isso as pessoas têm buscado integrar seus sites e blogs com o Facebook. Ao realizar essa integração, os responsáveis pelos websites têm dois objetivos:
- Facilitar o compartilhamento de seu conteúdo no Facebook;
- Permitir que seus visitantes “assinem” suas atualizações e as recebam diretamente em seus feeds de notícias do Facebook;
Atualmente existem mais de 700 plugins dedicados a proporcionar de alguma forma essa integração entre o Facebook e o WordPress.
Diante de tantas opções e decisões relacionadas à esse tema, decidimos criar uma série de Posts com dicas e discussões sobre a melhor forma de integrar seu site com o Facebook.
Começando do começo
O primeiro passo para se integrar um site ao Facebook, ainda pouco comentado, é descrever suas páginas utilizando o padrão de metadados criado pela empresa.
Metadados são basicamente dados que descrevem outros dados. Para ficar mais claro: imagine que você criou uma planilha de excel para controlar sua coleção de CDs. Todas informações dessa planilha são metadados que descrevem seus discos.
Em contextos digitais os metadados costumam estar incorporados no próprio item descrito. Transpondo o exemplo acima a esse contexto, e utilizando algo mais próximo, podemos citar as tags id3 dos arquivos MP3 (trazem informações sobre o nome da faixa, cantor, album etc) que são um tipo de metadados que lidamos todos os dias.
Quando falamos de páginas web, os metadados vêm sempre dentro da tag <meta>, que por sua vez está sempre dentro do elemento <head>. Esses dados, que não fazem parte do texto da página propriamente dita, servem para descrever o conteúdo de seu site de forma “compreensível” por maquinas. Padrões de metadados são uma das bases da web semântica.
O padrão de metadados do Facebook
Lançado em 2010, o Open Graph (OG) é um padrão de metadados que foi desenvolvido para ser utilizado na representação de itens virtuais e também coisas do “mundo real”. Suponhamos que você tem umá página em seu site que fala sobre São Paulo. Utilizando esse padrão de metadados você pode “informar” ao facebook, através dos seus metadados, que sua página fala sobre uma cidade.
Porque utilizar o Open Graph
A vantagem de se utilizar o OG é que sua página se integra ao “universo do Facebook” quando alguém compartilha ela por lá. Isso quer dizer que se alguém “der um like” na sua página que fala sobre São Paulo ela automaticamente vai para o perfil da pessoa que compartilhou, aparecendo na sessão “Atividades e Interesses” desse perfil.
Além disso, outro grande motivo para se utilizar esses metadados em suas páginas é que você pode controlar como elas serão exibidas no Facebook. No exemplo abaixo o mesmo artigo foi compartilhado duas vezes no Facebook. Na primeira vez ele não possuía os metadados ainda. Observe a diferença:
Ainda que a inserção do Open Graph em suas páginas signifique “mais uma coisa a se pensar”, o resultado vale à pena. Especialmente se você possui o “botão de curtir” em suas páginas.
Como utilizar o Open Graph
Para se utilizar o OG em “página estáticas” é relativamente simples. Basta adicionar os metadados ao <head> do documento.
Vejamos como ficaria o cabeçalho de um documento HTML devidamente descrito através do Open Graph:
<html xmlns:og='http://ogp.me/ns#'>
<head>
<title>São Paulo</title>
<meta property='og:title' content='São Paulo - Pontos turíticos'/>
<meta property='og:type' content='city'/>
<meta property='og:url' content='http://meusite.com/sao-paulo/'/>
<meta property='og:image' content='http://meusite.com/thumbnail_sp.jpg'/>
<meta property='og:site_name' content='Meu site'/>
<meta property='fb:admins' content='000000000'/>
<meta property='og:description' content='São Paulo é a mais cidade do brasil. Conheça os principais pontos turísticos.'/>
</head>
</html>
A documentação completa pode ser consultada na seção de desenvolvedores do site do Facebook.
OG no WordPress
Como utilizador do WordPress você sabe que ele utiliza um sistema de temas. Você não precisa inserir manualmente os metadados em cada uma das páginas. O que precisamos fazer é aproveitar os metados que os posts já possuem naturalmente e exibi-los em nosso HTML dentro dos padrões do Facebook.
Para alcançar esse objetivo você pode editar manualmente as páginas do seu tema, utilizar o sistema de Hooks do seu framework ou utilizar um plugin. Usar ou não plugin é sempre uma decisão que deve ser levada em conta, afinal, encher seu site de plugins não é uma boa prática e dificulta a manutenção.
Nesse caso, no entanto, para garantir que a funcionalidade continue disponível independente do tema escolhido, é interessante utilizar um plugin. Como citei anteriormente, existem centenas de plugins que integram de alguma forma o WordPress com o FB. Muitos deles possuem algum nível de implementação do Open Graph, mas a maioria tenta resolver todos os problemas de uma vez e acabam ficando complexos e pesados.
Escolha algo leve
Atualmente não utilizo nenhum plugin que seja dedicado exclusivamente ao Facebook aqui no Universo WP. A nossa implementação do Open Graph foi feita utilizando o plugin de SEO do Yoast, que é formidável por diversas razões. Eu já usava esse plugin anteriormente e há pouco tempo o desenvolvedor lançou essa funcionalidade. Essa é minha primeira sugestão de plugin para implementar o OG.
Caso você não deseje utilizar esse plugin de SEO por algum motivo, sugiro o uso de plugins específicos para isso, pois eles são mais leves do que os Plugins que integram seu site do Facebook de 1001 maneiras. Dois que testei recentemente e funcionaram foram: Open Graph WP implementation e o Open Graph, sendo que o primeiro é mais novo.
Pronto. Agora você já tem seu site preparado para ser compartilhado no Facebook. Basta verificar o código-fonte de suas páginas e certificar-se que o plugin escolhido está exibindo os metadados da maneira mais adequada.
Nós próximos artigos da série vamos apresentar como inserir o botão de curtir em todos os posts, como inserir um “like box” em seu site e discutir a nova funcionalidade do Facebook que permite a substituição do sistema de comentários de qualquer blog pelo sistema de cometários do Facebook.
E você? Já usa o Open Graph em seus sites? Acha que vale a pena ou é um trabalho desnecessário? Na esqueça de deixar seus comentários!
Eu já utilizava o plugin de SEO do Yoast e ativei aqui o Og, acho que é válido sim usar!
Muito bom o artigo.
Como o plugin WordPress Seo inclui as meta property automaticamente e eu queria alterar a og:type para “band”, além de que como estou criando um site de uma página só por enquanto e não preciso alterar os ‘content’ das meta property, preferi colocar diretamente no functions.php através do hook wp_head do wordpress.
Ola interessante o artigo mas gostaria de saber como algumas empresas conseguem fazer seguidos automaticamente tipo o wordpress é um exemplo tem seus milhoes de pesssoas que curtiram mas na verdade sao poucas que clicaram no botao curtir a grande maioria é pega sem perceber apenas estando logado no face ele pega e curte automaticamente sabes como isso é feito???
Marcio,
Desconheço essa técnica de fazer as pessoas curtirem páginas automaticamente.
A página do WordPress, por exemplo, foi curtida por 312.112 pessoas. Nem é tanto assim comparando-se ao tanto de visitantes do site. Para se ter uma ideia, só o WordPress 3.2 foi baixado 4.129.776 vezes!
Amigo, a perfunga é, Com esse OG aí eu vou poder postar no meu WordPress e esse post vai diretamente pro meu facebook ? Seja objetivo, Sim ou Não ?
Obrigado;
Carlos
Não.
Com o Open Graph configurado certinho os metadados da suas páginas (imagem, descrição etc) aparecerão corretamente no Facebook quando elas forem compartilhadas por lá.
O principal motivo prático é que você pode definir qual imagem estará associada ao seu Posts, entre outras coisas..
Para fazer o que você quer, sugiro o uso desse plugin: WPBook Lite
Olá, instalei o plugin de SEO da Yoast, mas mesmo assim as miniaturas dos links dos meus posts continuam a não aparecer, e está configurado para aparecer normalmente, será que o que está impedindo isso nos meus links é um problema externo? você tem ideia do que pode ser?
Não sei de qual site seus você está falando (por isso não pude entrar nele para tentar te ajudar), mas de forma resumida, a maneira de você ter certeza de que está tudo certo é conferindo o código fonte de algum post seu, como um usuário deslogado.
Aperte CTRL+U para abrir o código fonte da página que você quer checar, e procurar por metadados do Facebook (Open Graph), geralmente precedidos por “OG:” (ex: og:image, og:title etc).
Quanto a esse problema ele já está resolvido, muito obrigado meeeesmoo!!! Uma outra questão que eu já venho tendo faz tempo é como eu faço para que meu blog (WordPress) apareça no Google mostrando as páginas abaixo?
Ele só aparece o link principal, título e subtítulo, com certeza ele ficaria mais amigável e profissional se aparecesse com as páginas abaixo desse link principal.