Gerador de Open Graph — tags OG e Twitter Card com pré-visualização

Desenvolvimento

Um gerador de Open Graph cria as meta tags og:* e twitter:* que as plataformas sociais leem para exibir cards de link, a partir de um título, uma descrição, uma URL e uma imagem.

Tradução assistida por IA em revisão

Esta página foi traduzida com ajuda de IA e ainda não recebeu revisão profissional. Consulte as fontes citadas antes de usá-la em uma decisão importante.

O que é

Open Graph é o protocolo de meta tags que Facebook, Slack, KakaoTalk e serviços semelhantes leem ao desenhar um card de pré-visualização de link (título, descrição, imagem), e os Twitter Cards são a extensão específica do X. Esta ferramenta gera as tags og:title, og:description, og:url, og:image, og:site_name e twitter:card, e mostra uma pré-visualização do card a partir dos seus dados. O resultado real pode variar conforme o cache e a política de cada plataforma.

saída = conjunto de <meta property="og:*"> + conjunto de <meta name="twitter:*">

Como usar

  1. 1Digite o título do card, a descrição, a URL da página e a URL da imagem.
  2. 2Escolha o og:type e o formato do Twitter Card.
  3. 3Gere, copie as tags para o <head> e verifique com o validador de Open Graph.

Referência

Gerador de Open Graph — tags OG e Twitter Card com pré-visualização Referência
TagObrigatóriaNotas
og:titleobrigatóriatítulo do card de compartilhamento
og:typeobrigatóriatipo de conteúdo (website, article, ...)
og:imageobrigatóriaimagem do card — recomenda-se 1200×630px (1.91:1)
og:urlobrigatóriaURL canônica da página
twitter:cardrecomendadaformato de card do X (summary, summary_large_image)

Fontes e padrões

Perguntas frequentes

Meus dados ou a URL da imagem são enviados a um servidor?

Não. A geração das tags e a pré-visualização do card são executadas no seu navegador. A imagem de pré-visualização é carregada diretamente pelo seu navegador a partir da URL que você digitou e nunca passa por este serviço.

Qual é o tamanho recomendado para og:image?

1200×630 pixels (proporção 1.91:1) é a recomendação mais usada; as imagens devem ter pelo menos 600×315 pixels para exibir um card grande na maioria das plataformas.

Ainda preciso das tags de Twitter Card se já tenho tags OG?

O X recorre às tags Open Graph quando as tags twitter:* estão ausentes, mas definir twitter:card de forma explícita é a maneira segura de controlar o formato do card.

Ferramentas relacionadas