Gerador de Open Graph

Gere tags meta Open Graph e Twitter Card para compartilhamento em redes sociais. Visualização ao vivo de como seu link aparecerá no Facebook, Twitter e LinkedIn.

Open Graph

0/95
0/200

Image

Recommended: 1200×630 px (1.91:1 ratio)

Twitter Card

Live Preview

Fill in the fields to see how your link will look when shared

Paste these tags inside the <head> of your HTML document.

All processing happens in your browser. No data is sent to any server. Your URLs, titles, and image links are never stored or transmitted.

Como Usar Gerador de Open Graph

  1. 1Preencha o título, descrição e URL da sua página.
  2. 2Adicione uma URL de imagem para a visualização social.
  3. 3Configure as configurações do Twitter Card.
  4. 4Copie as tags meta geradas para o head do seu HTML.
ZenovayAnalytics

Analytics sem nenhum banner de cookies.

  • Acompanhamento de visitantes em tempo real
  • Privacidade em primeiro lugar, sem banner de cookies
  • Configurado em dois minutos
Conheça o Zenovay

Perguntas Frequentes

O que é o protocolo Open Graph?
Open Graph (OG) é um protocolo criado pelo Facebook que permite que as páginas da web controlem como aparecem quando compartilhadas em redes sociais. Ao adicionar tags meta OG ao head do seu HTML, você especifica o título, descrição, imagem e URL que plataformas como Facebook, LinkedIn e Twitter exibem em visualizações de link.
Quais são as propriedades Open Graph obrigatórias versus opcionais?
Obrigatórios: og:title, og:type, og:image e og:url. Recomendados: og:description, og:site_name, og:locale. Opcionais: og:image:width, og:image:height, og:image:alt. Para artigos: article:author, article:published_time, article:section. Mais propriedades existem para tipos específicos de conteúdo.
Quais são as melhores práticas para og:image?
Tamanho recomendado: 1200x630 pixels para exibição ideal em todas as plataformas. Use imagens de alta qualidade com proporção de aspecto 1,91:1. Mantenha o tamanho do arquivo abaixo de 8MB. Use URLs absolutos, não caminhos relativos. Inclua og:image:width e og:image:height para renderização mais rápida. Teste com o Sharing Debugger do Facebook.
Como faço para testar minhas tags Open Graph?
Use o Facebook Sharing Debugger (developers.facebook.com/tools/debug/) para testar e atualizar dados OG em cache. Twitter Card Validator (cards-dev.twitter.com/validator) para testes específicos do Twitter. LinkedIn Post Inspector (linkedin.com/post-inspector/) para LinkedIn. Essas ferramentas mostram exatamente como sua visualização de link aparecerá.
Qual é a diferença entre Twitter Cards e Open Graph?
Twitter Cards usam tags meta com prefixo twitter:. Open Graph usa tags com prefixo og:. Twitter voltará para tags OG se nenhuma tag específica do Twitter estiver presente. Tags exclusivas do Twitter: twitter:card (resumo ou resumo_imagem_grande), twitter:site, twitter:creator. Melhor prática: inclua tags OG e Twitter para máxima compatibilidade.