Meta Tag Builder (OG + Twitter)
Gerador focado em Open Graph e Twitter Cards. Pré-visualize um card de compartilhamento antes de publicar.
Snippet:
—
O cartão que aparece quando compartilham
Você publica o link no WhatsApp ou no LinkedIn e aparece só a URL crua, ou pior, uma imagem antiga que nem é daquela página. Isso acontece quando faltam as meta tags que as redes leem antes de montar o cartão. Aqui você preenche título, descrição, imagem e URL, escolhe o tipo de twitter:card, e a ferramenta devolve as nove tags de Open Graph e Twitter prontas para colar no head, com uma prévia ao lado mostrando como o texto vai ficar.
As tags saem com os valores escapados: se o seu título tiver aspas ou um sinal de menor que, eles viram entidades HTML e não quebram o atributo content. Duas convenções pegam muita gente desprevenida. og:image precisa ser URL absoluta com https, caminho relativo não funciona. E o twitter:card com summary_large_image é o que produz o cartão grande; summary gera a miniatura quadrada ao lado do texto.
Cole o bloco dentro do head. Em og:url use a versão canônica e absoluta da página, e hospede a imagem num endereço público, sem login, no formato 1200 por 630 pixels. A moldura da prévia mostra a proporção e onde o texto é cortado; a imagem em si vale conferir no depurador da própria rede, que também serve para limpar o cache depois de publicar. Não existe botão de copiar: selecione o snippet e copie. Tudo roda no navegador.
Perguntas frequentes
Preciso das tags do Twitter se já tenho as de Open Graph?
Troquei a imagem e o link continua aparecendo com a antiga. Por quê?
Posso usar caminho relativo em og:image?
Ferramentas Relacionadas
Preview de Open Graph
Visualize como uma página aparecerá quando compartilhada no Facebook, Twitter/X, LinkedIn e WhatsApp. Preencha as meta tags e veja os cards sociais em tempo real.
Gerador de Twitter Card
Gere as meta tags do Twitter Card (summary, summary_large_image, app, player). Preview do card como aparecerá no X/Twitter. Tudo no navegador.
Gerador de Meta Tags Completo
Conjunto completo de meta tags: charset, viewport, description, OG, Twitter, theme-color, canonical e hreflang.