Como usar: Prévia de Open Graph e meta tags
- 1
Cole um link
Digite o endereço de uma página pública e clique em Pré-visualizar link para ler o título, a descrição, as tags Open Graph e as tags do card do X.
- 2
Confira os cards
Compare o resultado do Google com os cards do Facebook, X, LinkedIn, Slack, Discord e estilo iMessage, e veja a lista de tags ausentes ou fracas.
- 3
Edite as tags
Clique em Editar estas tags, ou abra Escrever tags, para mudar o título, a descrição e a imagem e ver todas as pré-visualizações se atualizarem enquanto você digita.
- 4
Copie para sua página
Copie as meta tags geradas para o head da sua página, publique e verifique de novo a URL no ar.
Limites e Pro
Grátis: 20 pré-visualizações de URL por minuto, páginas de até 3 MB de HTML com tempo limite de 12 segundos, 7 pré-visualizações de plataformas por link e edição de tags ilimitada.
Sobre: Prévia de Open Graph e meta tags
O previsualizador de meta tags mostra como um link vai aparecer antes de você compartilhá-lo. Ele lê as tags usadas para montar as pré-visualizações de links: o título HTML e a meta description, as tags Open Graph como og:title, og:description, og:image e og:site_name, as tags de card do X como twitter:card e a cor do tema que o Discord usa na faixa lateral do embed. Depois ele desenha sete pré-visualizações: um resultado de busca do Google, posts de link do Facebook e do LinkedIn, um card do X no formato de imagem grande ou resumo, um unfurl do Slack, um embed do Discord e um balão estilo iMessage.
Quando um campo está ausente, as pré-visualizações usam o mesmo recurso da maioria das plataformas, por exemplo passar de og:title para o título da página, e a origem é indicada nos avisos. A imagem também é verificada: o tamanho em pixels e o tipo são lidos do cabeçalho do arquivo, então você descobre se ela está abaixo do mínimo de 200 × 200 do Facebook, grande demais para o limite de 5 MB do X, em SVG (não compatível) ou com proporção errada para um card grande de 2:1.
A aba Escrever tags funciona sem buscar nada e gera um bloco pronto de meta tags. As pré-visualizações são aproximações: as plataformas mudam seus designs, guardam os cards em cache por dias e algumas mostram textos diferentes para quem está logado. Para atualizar um card que já foi compartilhado, use o depurador da própria plataforma depois de publicar.
Privacidade
Em Verificar uma URL, o endereço vai para o nosso servidor, que baixa a página uma vez e os primeiros bytes do og:image para ler as tags e o tamanho da imagem; nada é armazenado nem registrado. As imagens da pré-visualização são carregadas no seu navegador, direto do site que as hospeda. Escrever tags roda apenas no seu navegador.
Recursos
Sete pré-visualizações
Cards do Google, Facebook, X, LinkedIn, Slack, Discord e estilo iMessage lado a lado.
Verificação da og:image
Tamanho em pixels, tipo e peso do arquivo lidos da própria imagem, com os mínimos de cada plataforma.
Gerador de tags
Digite um título, uma descrição e uma imagem e copie um bloco completo de Open Graph e card do X.