WikiPlus

Pré-visualização Open Graph

Visualize como seu site aparece nas redes sociais. 100% grátis, funciona no seu navegador.

Processamento local
1.4s em média
4.8 de 5 — com base em 1,247 usos

Por Sergio Robles — Fundador

Pré-visualização Facebook

example.comDigite o título da página...Digite a descrição da página...

Pré-visualização Twitter

Digite o título da página...Digite a descrição da página...example.com
<meta property="og:type" content="website">

<meta name="twitter:card" content="summary_large_image">
Seus arquivos são processados localmente no seu navegador. Nunca enviamos ou armazenamos seus dados.

O que é Pré-visualização Open Graph?

O OG Preview do WikiPlus mostra exatamente como seu link aparece quando compartilhado no Facebook, X, LinkedIn, Slack, Discord, WhatsApp e iMessage. Ele busca e renderiza as tags Open Graph ao vivo de qualquer URL. Profissionais de marketing verificam uma campanha antes do lancamento. Sem surpresas com imagem faltando. Social media managers depuram por que a preview de um post quebrou apos atualizar o CMS. Consultores de SEO auditam tags og:image faltantes ou grandes demais em sites de clientes. Voce pode usar o buscador de URL ao vivo ou colar meta tags direto. As previews renderizam no seu navegador. URLs de pre-lancamento e textos de campanha ficam privados. O buscador puxa a resposta HTTP ao vivo da URL enviada. Ele usa proxy no servidor para contornar CORS. Depois faz o parse das meta tags do head e renderiza uma preview fiel para cada plataforma. Cada preview mostra o comportamento real de fallback quando og:image esta faltando, e grande demais ou tem a proporcao errada.

Quando devo usar esta ferramenta?

  • Verificar a pré-visualização de uma postagem de blog antes de anunciá-la no Twitter
  • Depurar por que uma URL compartilhada mostra a imagem errada no LinkedIn
  • Confirmar que o Facebook leu a imagem Open Graph atualizada após o deploy
  • Fazer QA na pré-visualização de uma landing page de cliente antes de uma campanha

Como pré-visualizar tags Open Graph?

  1. 1Cole a URL completa da pagina que voce quer visualizar.
  2. 2Clique em buscar para puxar as meta tags e Open Graph da pagina.
  3. 3Veja os mockups renderizados para Facebook, Twitter e LinkedIn.
  4. 4Identifique campos faltando como og:image ou twitter:card no relatorio.
  5. 5Corrija as meta tags no seu site e rode o preview de novo.

Perguntas frequentes

O que e um preview Open Graph e por que importa?

An Open Graph preview is the rich link card that appears automatically when you paste a URL into Facebook, LinkedIn, WhatsApp, Discord, Slack, X, iMessage, Telegram, Reddit, or virtually any modern messaging platform that supports link unfurling. Instead of displaying a bare URL, the platform renders a structured card containing a large image, a title, a short description, and the source domain. This transformation is driven entirely by meta tags placed in the HTML head of the linked page — specifically og:title, og:description, og:image, og:url, og:type, and optionally og:image:width and og:image:height. The visual impact on engagement is substantial. Research consistently shows that posts with rich image previews receive two to three times more clicks than posts sharing bare URLs, because the card communicates content, context, and credibility before the user decides whether to follow the link. For marketing teams, a broken or missing OG preview on a campaign URL is a direct revenue leak — every social post, email footer link, or Slack announcement that fails to render a preview loses a significant fraction of its potential click-through traffic. For developers and SEO practitioners, OG previews are also a signal of overall meta-tag health. A page with correctly configured OG tags is also more likely to have a coherent title, description, and canonical setup. The WikiPlus OG Preview tool lets you inspect and debug the OG card for any URL before you share it publicly, catching missing images, truncated titles, and wrong aspect ratios while you can still fix them.

Por que meus previews as vezes mostram imagem errada ou conteudo antigo?

The root cause is aggressive caching by social platforms. Every major network — Facebook, LinkedIn, X, WhatsApp, and Discord — caches the OG metadata it fetches from a URL the first time that URL is shared on the platform. The cache TTL varies by platform, ranging from a few hours for WhatsApp to several days for LinkedIn and Facebook in some configurations. After you update your og:image, og:title, or og:description tags, the platform's crawler has not yet re-fetched your URL, so it continues serving the stale preview from its cache to every user who shares the link during that window. Each platform provides a dedicated tool to force an immediate cache refresh. Facebook offers the Sharing Debugger at developers.facebook.com/tools/debug — enter your URL and click Debug, then Scrape Again to request a fresh fetch. LinkedIn provides the Post Inspector at linkedin.com/post-inspector. X has the Card Validator at cards-dev.twitter.com/validator. For WhatsApp and iMessage there is no programmatic cache-busting tool; the most reliable approach is to add a cache-busting query parameter to the URL — for example, appending ?v=2 — which the platforms treat as a distinct URL and fetch fresh. The WikiPlus OG Preview tool is not subject to any caching delay. It fetches the live HTTP response of your URL at the moment you submit it, parses the current head tags, and renders a preview that reflects your actual deployed tags right now. This makes it the fastest way to verify a fix before announcing a URL publicly.

Qual tamanho e formato de imagem funciona melhor para og:image?

The industry-standard size that renders correctly across all major platforms without cropping, letterboxing, or upscaling artifacts is 1200 by 630 pixels at a 1.91:1 aspect ratio. This dimension is documented as recommended by Facebook, LinkedIn, and Discord, and is the trigger size for X's summary_large_image card format — images below 300 px wide display in the compact summary format regardless of the twitter:card setting. The file size should stay under 1 MB to avoid the degraded or missing preview that some mobile clients show when the image is slow to load on a constrained connection. The practical production target is 200–400 KB. For JPEG, quality setting 80–85 at 1200×630 consistently lands in this range for photographic content. For text-heavy OG cards with solid color backgrounds, PNG often produces a smaller file than JPEG because the flat regions compress extremely efficiently. WebP delivers the smallest file sizes and is supported by all browser-based clients including Chrome, Safari, and Firefox on both mobile and desktop. The compatibility concern with WebP is older native messenger apps — specifically Android WhatsApp versions below 2.21 and certain email clients with inline link preview rendering. If any significant portion of your audience uses these clients, JPEG remains the safer choice. Always specify the og:image URL as an absolute HTTPS URL. Relative paths fail when the social crawler fetches the image because it has no document base URL to resolve against. Include og:image:width and og:image:height as numeric attributes to allow crawlers to skip the dimension-probe request and generate previews faster on the first share.

Seu preview bate com o que Facebook e LinkedIn realmente renderizam?

The WikiPlus OG Preview is engineered to match the documented rendering specifications that Facebook and LinkedIn publish in their developer documentation, producing previews that are visually accurate for the large majority of users across the most common device and app configurations. The preview applies the correct aspect ratio crop rules — Facebook crops og:image to a 1.91:1 rectangle, LinkedIn to a 1.91:1 rectangle for standard posts and a 4:1 strip for company page previews — using the same focal-point centering behavior each platform documents. Typography, font sizes, line clamping, and domain badge placement follow the values published by each platform as of early 2025. The preview also simulates the fallback behavior for missing or malformed tags: what card format renders when og:image is absent, when the image fails to load, when og:description is empty, and when og:title exceeds the character limit. For the highest possible accuracy on a specific platform and app version, use that platform's native debugger: Facebook Sharing Debugger, LinkedIn Post Inspector, or X Card Validator. These tools render the preview using the actual production code of the platform and reflect any quarterly rendering changes immediately. WikiPlus updates its preview rules with each major platform rendering change, but there is an inherent lag of a few weeks. A practical workflow is to use WikiPlus for rapid iteration during development — fix the tags, re-preview instantly without waiting for cache purge — then confirm the final result in the platform's native debugger before launch.

O conteudo desta pagina esta disponivel sob CC BY 4.0.