Visualizador de Open Graph

Visualize como sua página ficará quando compartilhada no Facebook, Twitter/X, LinkedIn e Slack. Gere meta tags Open Graph e Twitter Card a partir de um formulário.

39/70
119/160

Use an absolute URL. Ideal: 1200×630px JPG/PNG under 1MB.

Facebook

example.com

My Awesome Blog Post — A Complete Guide

Learn everything you need to know about this topic in our comprehensive guide. Perfect for beginners and experts alike.

Generated Meta Tags

<!-- Open Graph / Facebook -->
<meta property="og:type" content="article" />
<meta property="og:url" content="https://example.com/blog/my-post" />
<meta property="og:title" content="My Awesome Blog Post — A Complete Guide" />
<meta property="og:description" content="Learn everything you need to know about this topic in our comprehensive guide. Perfect for beginners and experts alike." />
<meta property="og:site_name" content="My Website" />

<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="My Awesome Blog Post — A Complete Guide" />
<meta name="twitter:description" content="Learn everything you need to know about this topic in our comprehensive guide. Perfect for beginners and experts alike." />

OG Tag Checklist

og:title set (50–70 chars)
og:description set (120–160 chars)
Missing or not absolute
og:url is absolute HTTPS URL
og:site_name set
og:type selected

Como Usar Visualizador de Open Graph

  1. 1Digite o título, descrição, URL e URL da imagem da sua página.
  2. 2Visualize como o link aparecerá no Facebook, Twitter/X, LinkedIn e Slack.
  3. 3Copie os meta tags gerados para sua <head> HTML.
ZenovayAnalytics

Saiba o que seus visitantes realmente fazem.

  • 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 são tags Open Graph?
As tags Open Graph (OG) são meta tags HTML que controlam como as URLs aparecem quando compartilhadas em plataformas de mídia social como Facebook, LinkedIn, Twitter/X, Slack e Discord. Desenvolvido pelo Facebook em 2010, o protocolo OG é agora o padrão para pré-visualizações de links em toda a web. Tags principais: og:title (título), og:description (descrição), og:image (imagem de pré-visualização), og:url (URL canônica).
Qual é a diferença entre Open Graph e Twitter Cards?
Open Graph é o padrão geral usado pelo Facebook, LinkedIn, Slack, Discord e pela maioria das plataformas. Twitter Cards são meta tags específicas do Twitter/X (twitter:card, twitter:title, twitter:description, twitter:image). A maioria das implementações precisa de ambos. Boa notícia: se as tags específicas do Twitter estiverem ausentes, o Twitter usará as tags og:* como fallback.
Qual é o tamanho de imagem ideal para Open Graph?
Tamanho OG recomendado: 1200×630px (proporção 1,91:1). Mínimo: 600×315px. Tamanho máximo do arquivo: abaixo de 8 MB (limite do Facebook), idealmente abaixo de 1 MB para carregamento rápido. O LinkedIn prefere 1200×627px. Twitter/X summary_large_image: 1200×675px (proporção 16:9). Sempre use URLs absolutas (https://) para og:image.
Como valido minhas tags Open Graph?
Ferramentas de teste: Facebook Sharing Debugger (developers.facebook.com/tools/debug) — cole sua URL, varre e mostra a pré-visualização + erros. LinkedIn Post Inspector (linkedin.com/post-inspector) — mesmo para LinkedIn. Twitter Card Validator (cards-dev.twitter.com/validator) — para Twitter cards. Observação: o Facebook armazena em cache agressivamente — use 'Scrape Again' para forçar uma atualização.
O que é og:type e quando devo usar valores diferentes?
og:type informa às plataformas que tipo de conteúdo é a página. Valores mais comuns: website (padrão — página inicial ou páginas gerais). article (posts de blog, artigos de notícias — habilita article:published_time, article:author). product (itens de e-commerce). video.movie / video.episode (conteúdo de vídeo). O tipo padrão é website se não especificado.