Pular para o conteúdo
Toolars
Explorar

Gerador de metadados Open Graph

Open Graph Meta Generator

13 tipos Open Graph e campos opcionais de imagem, áudio, vídeo, localidade e MIME; confira o HTML escapado.

Processamento local

Detalhes do processamento

Os dados da ferramenta são processados no seu dispositivo.

Esta ferramenta pode baixar recursos. Os serviços de conta são separados.

Informações de privacidade
Reportar erro

Caminho da tarefa / da entrada ao resultado

Como gerar meta tags Open Graph

  1. 01

    Escreva o título e a descrição

    Preencha o Título (até 120 caracteres) e a Descrição (até 300). O título é obrigatório — gerar sem ele para com um erro identificado — enquanto a descrição é opcional e vira og:description quando presente. Os dois campos param de aceitar entrada nos seus limites. 13 · og:type · URL de áudio / URL de vídeo / Idioma e região (pt_BR) / Idiomas alternativos (separados por vírgulas) / Determinante / Tipo MIME da mídia / Largura (px) / Altura (px) / Texto alternativo da imagem

  2. 02

    Adicione as URLs

    Insira a URL canônica, que deve ser um endereço HTTP ou HTTPS absoluto, e uma URL de imagem opcional, que também deve ser absoluta quando presente. Endereços inválidos são rejeitados com um erro identificado antes de qualquer coisa ser gerada, então um caminho relativo ou um domínio solto nunca escapa para dentro das tags.

  3. 03

    Defina o nome do site e o tipo

    13 tipos Open Graph e campos opcionais de imagem, áudio, vídeo, localidade e MIME; confira o HTML escapado.

  4. 04

    Gere as tags

    Pressione Gerar meta tags. A marcação é montada localmente como um elemento meta por linha, com todo valor escapado para atributo, e a saída final deve ficar dentro do limite local de 16.000 caracteres. Carregar exemplo preenche um exemplo completo de artigo e o gera com um clique.

  5. 05

    Revise e copie

    Confira o cartão de compartilhamento representativo — ele mostra o nome do site, ou o hostname da URL canônica quando nenhum nome de site está definido, acima do título e da descrição — e leia a marcação gerada no painel de saída. Editar qualquer campo limpa a marcação até você gerar de novo. Depois use Copiar meta tags para a área de transferência ou Baixar HTML para salvar as tags como toolars-open-graph-meta.html para o head da sua página. Exporte o resultado atual. HTML / Open Graph.

Fatos da ferramenta

Processamento
No seu navegador
A entrada sai deste dispositivo
Nunca
Retenção
Nada é armazenado
Preço
Grátis

Sua entrada fica no navegador.

Gerador de metadados Open Graph usa seu caminho de execução local verificado e não cria um histórico oculto de entradas ou saídas.

Execução local

Roda dentro da aba atual do navegador.

Sem processamento oculto

Os dados ativos da ferramenta nunca viram um registro de documento do Toolars.

Não precisa de conta

Use o fluxo principal sem criar um perfil. Os favoritos sincronizam com sua conta depois que você entra.

Redefinição imediata

Limpe a aba e os dados de trabalho ativos desaparecem.

O que Gerador de metadados Open Graph realmente faz

Uma desenvolvedora está prestes a lançar uma landing page e quer que o link se expanda direito quando a equipe o postar no chat. Ela escreve um título de 70 caracteres, uma descrição de duas frases e a URL de produção, define o tipo como Website e gera as seis linhas de tags. O Gerador de metadados Open Graph monta as linhas og:title, og:type, og:url, og:description, og:image e og:site_name com escape seguro, e mostra um cartão de compartilhamento representativo ao lado da marcação para ela conferir o truncamento antes de colar o trecho no head. O texto em rascunho e a URL não lançada ficam na aba do navegador — sem pings de validação, sem uploads.

Perguntas frequentes

Quais tags são geradas?
13 tipos Open Graph e campos opcionais de imagem, áudio, vídeo, localidade e MIME; confira o HTML escapado. 13 · og:type · URL de áudio / URL de vídeo / Idioma e região (pt_BR) / Idiomas alternativos (separados por vírgulas) / Determinante / Tipo MIME da mídia / Largura (px) / Altura (px) / Texto alternativo da imagem Este cartão é ilustrativo. Imagens, áudio e vídeos remotos não foram carregados nem verificados.
Como o conteúdo recebe escape?
Todo valor recebe escape para atributo antes de entrar na marcação: e comercial, aspas duplas e simples, e sinais de maior e menor são substituídos por suas formas de entidade. Isso impede que títulos com aspas ou caracteres especiais quebrem a tag, e cada valor é aparado de espaços ao redor primeiro.
Quais são as regras de validação e os limites?
O Título é obrigatório; a URL canônica deve ser uma URL HTTP ou HTTPS absoluta, assim como a URL de imagem quando presente. Os comprimentos são limitados a 120 caracteres para o título, 300 para a descrição e 100 para o nome do site, e a marcação final deve ficar dentro de 16.000 caracteres.
O que o cartão de compartilhamento representativo mostra?
O cartão imprime o nome do site acima do título e da descrição, recorrendo ao hostname da URL canônica quando o campo Nome do site está vazio. É uma pré-visualização representativa de como os valores se leem juntos, desenhada localmente — não uma renderização pixel a pixel de nenhuma plataforma específica, já que cada plataforma corta e trunca de um jeito.
Algo é enviado ou buscado?
Não. A marcação é montada e o cartão de compartilhamento pré-visualizado inteiramente dentro desta aba do navegador; a URL da imagem é escrita nas tags, mas nunca buscada aqui. Nenhuma conta é necessária, e Redefinir restaura os valores de exemplo padrão.

Tarefas relacionadas, não um beco sem saída.

Passe para outro espaço de trabalho focado sem voltar ao índice completo.

Filtros do Instagram

Instagram Filters

Aplique 12 predefinições locais com intensidade ajustável. Aplique um filtro Canvas real a uma imagem local sem enviá-la ou contatar uma plataforma.

Editar

Gerador de publicações do Instagram

Instagram Post Generator

Componha um conceito original de post e exporte um mockup local claramente rotulado. Imagens: 0–4; Avatar; Layout de exportação.

Criar

Gerador de stories do Instagram

Instagram Story Generator

Estruture um conceito de story vertical sem criar um registro falso da plataforma. Segmentos da história: 1–12; Posição horizontal / Posição vertical; Cor do texto.

Criar

Gerador de mensagens diretas do Instagram

Instagram DM Generator

Esboce um layout de conversa para roteiros e protótipos, nunca como prova de uma troca real. Mensagens: 1–40; Citação da resposta; Estado; Imagens.

Criar