Originalmente criado pelo Facebook, o Open Graph é um protocolo de internet criado para padronizar a utilização de metadados dentro de uma página da web para representar o conteúdo de uma página.
A partir dele é possível fornecer detalhes específicos da página como por exemplo o título dela ou até mesmo o tempo de duração exato de um vídeo exibido na página, com isso todas as informações disponibilizadas acabam formando uma amostra individual de cada página na internet.
O Open Graph utiliza a seguinte sintaxe padrão: <meta property="og" content="">
Quando não existem metas de Open Graph definidas em uma página, o dado mais próximo utilizado são os primeiros identificados na página, no caso dados de SEO como Title e meta-description.
Sintaxe do title: <title> Nome do Site </title>
Sintaxe do meta-description: <meta name="description" content="Descrição do seu site" />
Como exemplo a imagem a seguir é a cadastrada como logo da loja, no caso "logo.png" (inserida na pasta "i" do Explorador de Arquivos):
Caso queira substituir o logo, basta substituir a imagem atual por uma nova imagem, porém mantendo o mesmo nome (logo) e a mesma extensão (.png).
Mas o ideal, é que informe em seu site os dados de Open Graph através de metas.
Abaixo seguem exemplos de metas para Open Graph que podem ser personalizados de acordo com a sua necessidade:
<meta property="og:locale" content="pt_BR">
<meta property="og:url" content="https://www.meusite.com.br/ola-mundo">
<meta property="og:title" content="Título da página ou artigo">
<meta property="og:site_name" content="Nome do meu site">
<meta property="og:description" content="Minha descrição para chamar atenção dos usuários.">
<meta property="og:image" content="www.meusite.com.br/imagem.jpg">
<meta property="og:image:type" content="image/jpeg">
<meta property="og:image:width" content="200">
<meta property="og:image:height" content="200">
/** CASO SEJA UM SITE NORMAL **/
<meta property="og:type" content="website">
/** CASO SEJA UM ARTIGO **/
<meta property="og:type" content="article">
<meta property="article:author" content="Autor do artigo">
<meta property="article:section" content="Seção do artigo">
<meta property="article:tag" content="Tags do artigo">
<meta property="article:published_time" content="date_time">
Uma das formas de inserir as meta tags em seu site é através da funcionalidade do Gestor de Scripts, disponibilizando as informações em “todas as páginas”:
Para mais informações a respeito de Open Graph, veja o vídeo a criado especialmente para você pelos nossos especialistas.