5 minutos

Facebook Open Graph: Compartilhe o conteúdo de seu site no Facebook

Entenda o que é Facebook Open Graph: Compartilhe o conteúdo de seu site no Facebook! Acompanhe as novidades do blog e compartilhe as dicas com os amigos!
Facebook Open Graph: Compartilhe o conteúdo de seu site no Facebook
Escrito por
Gabriel Heitzmann
Publicação
8/2/2024

Quando se faz uma postagem num site ou blog, deve-se entender que para propagá-la na internet será necessário utilizar diversas estratégias de divulgação para fazê-la ter um bom alcance. O Facebook é uma das redes sociais mais importantes para se fazer divulgação e é por isso que vamos te ensinar a configurar o Facebook Open Graph para que a sua página apareça da melhor maneira possível na rede social.

Este tutorial é para usuários menos experientes que querem fazer uma configuração simplificada para a otimização de suas páginas para serem compartilhadas no Facebook.

Vamos lá!

O que é Facebook Open Graph?

Facebook Open Graph

Que o Facebook é a rede social mais popular do mundo, você já sabe. Quem não quer fazer as publicações no Facebook terem a maior quantidade de acessos possível, não é?

O Facebook Open Graph é uma ferramenta cujo objetivo é configurar um post de divulgação de uma postagem de seu site para aparecer no Facebook de maneira perfeita.

Você poderá configurar uma descrição, imagem, título e URL para que a caixa - objeto gráfico - tenha todo o conteúdo necessário para garantir acessos!

Leia mais em: O que é OpenGraph e como usá-lo para SEO

Como usar o Facebook Open Graph?

Você irá configurar o código-fonte de sua página para garantir a formatação correta na hora de compartilhá-la no Facebook. A ideia é sintetizar o conteúdo da sua publicação para não ter surpresas no momento de divulgá-la na rede social.

Vou te ensinar como configurar o Facebook Open Graph para garantir que o objeto gráfico seja gerado de maneira perfeita e cumpra com seus objetivos. Passaremos pelo título, descrição, imagem e URL. Acompanhe =)

Adicione as meta tags Facebook Open Graph

Você irá adicionar as meta tags entre as tags <head> e </head>.  

Local

Você deverá definir o local ou o idioma da publicação, usando o código a seguir:

<meta property="og:locale" content="en_US">

Você deverá adicionar pt_BR caso seja este o idioma definido no código de seu site. Para verificar qual idioma definido para o seu site, busque pela tag <html lang="">. O conteúdo entre as aspas será o idioma configurado para seu site. </html>

Tipo

Facebook Open Graph

Esse código irá dizer para o Facebook Open Graph se o conteúdo é uma página de site ou artigo em blog.

Para definir um artigo:

<meta property="og:type" content="article">

  • Você também poderá configurar para que seja exibido o nome do autor do artigo:

<meta property="article:author" content="Nome do autor">

  • Se quiser, poderá adicionar também as tags deste artigo:

<meta property="article:tag" content="Tags">

  • Poderá exibir também a data de publicação, usando o código a seguir:

<meta property="article:published_time" content="date_time">

Para definir um site, basta adicionar:

<meta property="og:type" content="website">

Título

Para configurar o título de sua postagem, você deverá usar o seguinte código:

<meta property="”og:title”" content="”WebPeak" -="" inovação="" em="" seo”="">

Onde você lê “WebPeak - Inovação em SEO”, deve alterar para o título da postagem que você fez. Lembre-se de manter as aspas pois elas indicarão que trata-se de um conteúdo de texto e não de parte do código.

Imagem

Para que sua postagem seja cativantes aos olhos dos usuários do Facebook, ela deverá ser ilustrada com uma imagem que ajude a sintetizar a postagem e chame a atenção de quem lê. Para adicionar uma imagem ao código do Facebook Open Graph, você vai precisar da URL dela. Basta inserir esta url no código abaixo.

<meta property="“og:" image”="" content="”https://cdn.prod.website-files.com/5a4661af7b791a00019cfaee/5b3cf2ece6dc5bd50a7641c8_facebook-open-graph-compartilhe-o-conteudo-de-seu-site-no-facebook.jpg" "="">

Adicione a URL de sua imagem entre as aspas após content=.

Existem algumas especificações quanto à imagem que você poderá usar:

Preferencialmente, ela deverá ser quadrada;

O tamanho deverá ser de 600x600 pixels;

Os formatos .jpeg, .png, .gif e .bmp são os únicos aceitos.

URL

Facebook Open Graph

Neste item você deverá linkar a url para qual o usuário será direcionado ao clicar na postagem.

https://www.webpeak.com.br/ferramenta-de-seo-all-in-one>

Após content= entre as aspas você deverá digitar a url da página para qual o usuário será direcionado após clicar na sua postagem.

Uma dica útil é, para caso queira o direcionamento para uma página específica quando alguém tenta compartilhar uma publicação de seu site. Você pode direcionar qualquer página de seu site para outra de maior relevância.

Descrição

Aqui você vai sintetizar de fato o conteúdo de sua postagem, para que uma breve descrição apareça na postagem do Facebook. 

Você poderá usar parte da postagem já feita ou bolar uma nova que atenda a esse objetivo de maneira mais rápida, atraindo a atenção de quem passar pela sua publicação. Sua descrição não deve ultrapassar 200 caracteres.

<meta property="og:description" content="Descubra o que SEO pode fazer pelo seu negócio de maneira definitiva.">

Basicamente, são essas as informações que você deverá adicionar para que o Facebook Open Graph funcione na sua página e que ela seja otimizada para ser compartilhada na rede.

Adicionando todas essas meta tags no entre o <head> e </head> de seu site, sua publicação deverá aparecer já no formato adequado para ter sucesso no Facebook. Usar o Facebook Open Graph é bastante fácil até para quem entende pouco de programação web, podendo ser você mesmo quem fará essa configuração se tiver acesso ao código-fonte de seu site ou blog.

Existem maneiras mais fáceis de fazer essa configuração em plataformas que simplificam a otimização. No Wordpress, por exemplo, essa configuração é muito mais fácil. A plataforma já te possibilita a formatação via plugin, o que facilita muito a vida dos usuários. Caso queira conhecer o plugin, basta clicar aqui.

Uma página bem configurada para ser compartilhada no Facebook com certeza vai ter um alcance muito maior, especialmente se você for patrocinar esta publicação, não perca tempo e configure o Open Graph no código de seu site ou blog para vender mais!

Olha só como vai ficar o resultado final:  

Facebook Open Graph

Gostou? Comente o que achou e não deixe de compartilhar. Acompanhe nossas postagens e fique por dentro de inúmeras dicas que vão te fazer vender muito mais!

Aposte em SEO para alavancar o seu negócio. Assine nossa newsletter e não perca tempo para ter acesso ao melhor conteúdo e as melhores dicas para alavancar o seu negócio.

Até a próxima!

Fique no controle!
Reduza seus custos com diversas ferramentas de marketing e centralize o gerenciamento com a Webpeak.

Somos a Melhor Tecnologia de Marketing do Mercado!
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Eleve Resultados na Internet com a WebPeak

ico SEO webpeak

4.9 é nossa avaliação média no Google e Facebook

"A parceria na trajetória de sucesso teve início em 2018 e perdura até hoje. Eles focaram e entenderam os desafios do negócio. Superaram expectativas."

case de sucesso embracon

Helder Santos

Marketing Manager