ForHosting KIT · Monitorar sites

Gerador de tags Twitter Card para prévias sociais

Digite um título como Build & Ship e receba as tags do Twitter Card prontas para colar no cabeçalho da sua página, com o & escrito como &. Escolha o cartão resumo compacto ou o de imagem grande; tags opcionais vazias ficam de fora. Grátis no seu navegador.

Grátis
Funciona no seu navegador
Sem cadastro
Seus dados não saem do seu aparelho

Executar grátis Ver a API

Use pelo WebAPIE-mailTelegramApp em breve

Crie um conjunto completo de meta tags Twitter Card sem decorar nomes de propriedades nem se preocupar com caracteres inseguros em atributos HTML. Escolha um tipo de cartão compatível, informe o título da prévia e, se desejar, inclua uma descrição e uma URL absoluta de imagem. O gerador entrega registros estruturados e um bloco HTML pronto para colar. O processamento é determinístico e não faz solicitações de rede; assim, a mesma entrada sempre produz o mesmo código e seus dados não são enviados a serviços externos de visualização.

Escolha o formato adequado para a prévia

Comece pelo tratamento visual desejado quando um link for compartilhado. O cartão summary é a alternativa compacta: ele atende bem artigos, documentação, páginas de produtos e outros links nos quais título e descrição devem continuar em destaque, enquanto a imagem funciona como miniatura de apoio. Este gerador aceita deliberadamente esses dois formatos de uso geral, pois ambos podem ser descritos por completo com tipo, título, descrição e imagem.

Outros tipos de Twitter Card exigem campos adicionais que não pertencem a este contrato. Se você enviar um tipo incompatível, a capacidade retornará um erro de entrada tipado em vez de produzir silenciosamente uma marcação incompleta. Isso torna a automação mais segura: um erro de digitação ou uma escolha incompatível não passa adiante como um conjunto de tags aparentemente correto, mas incapaz de representar o cartão pretendido.

Forneça conteúdo seguro para HTML

O título é obrigatório e precisa conter texto além de espaços em branco. Descrição e imagem são opcionais; quando você não as fornece, as respectivas tags são omitidas, e a saída nunca preenche campos ausentes com tags vazias ou valores nulos. Caminhos relativos podem funcionar no seu próprio site, porém rastreadores sociais precisam de um endereço que possam solicitar de forma independente, por isso o gerador os rejeita.

O texto é escapado para uso em um atributo HTML delimitado por aspas duplas. E comerciais, aspas, sinais angulares e apóstrofos são convertidos em referências de caracteres, preservando o conteúdo visível sem permitir que ele rompa o atributo. Os registros estruturados mantêm valores normalizados e legíveis, enquanto o bloco HTML contém a representação escapada destinada à marcação.

Essa distinção ajuda quando um aplicativo precisa examinar ou armazenar os metadados separadamente do trecho inserido no cabeçalho.

Instale e confira as tags geradas

Copie as linhas HTML retornadas para o elemento head da página que será compartilhada. Após a publicação, examine o código-fonte por uma URL pública para confirmar que o servidor realmente envia as tags no HTML inicial. Código executado no navegador que acrescenta metadados somente depois do carregamento pode ficar invisível aos rastreadores, e uma imagem privada ou protegida não poderá ser acessada mesmo que sua URL seja sintaticamente válida.

O gerador valida os metadados fornecidos, mas não acessa seu site, baixa a imagem, mede suas dimensões nem prevê como uma rede social recortará a prévia. O cache também é controlado pela plataforma que consulta a página; portanto, uma prévia antiga pode persistir depois da atualização das tags.

Casos de uso

Adicione tags sociais a um site estático

Gere registros e HTML previsíveis para cada página sem chamar um serviço de rede nem manter um modelo de tags.

Identifique tipos de cartão incompatíveis

Rejeite opções incompatíveis ou digitadas incorretamente antes que metadados incompletos cheguem à produção.

Perguntas frequentes

A imagem é obrigatória?

Não. Quando image é omitido, o resultado não inclui twitter:image.

O que acontece quando a descrição é omitida?

A tag twitter:description é totalmente omitida. A saída não cria uma tag vazia nem um campo nulo.

O gerador escapa aspas e o caractere &?

Sim. Caracteres capazes de romper um atributo HTML são codificados na saída HTML, enquanto os registros mantêm valores legíveis.

A ferramenta verifica a aparência do cartão publicado?

Não. Ela gera e valida localmente os metadados fornecidos; não acessa a página, examina a imagem nem contata um serviço social.

Qual tipo de cartão devo escolher?

Escolha o resumo quando o título e a descrição devem dominar e a imagem é só uma miniatura, como em artigos, documentação ou páginas de produto. Escolha o resumo com imagem grande quando a arte transmite sentido, como em reportagens, lançamentos, portfólios ou receitas.

Ferramentas relacionadas

Para desenvolvedores — acesso via API

Tudo nesta página está disponível via API. Esta seção é para equipes que querem integrar a ferramenta aos próprios sistemas; quem não precisa disso pode simplesmente usar a ferramenta acima.

Endpoint

POSThttps://api.kit.forhosting.com/web/twitter-card-generate

Autenticação por token Bearer. Um único POST coloca a tarefa na fila; o resultado chega por webhook ou link assinado.

Chame do seu código

curl -X POST https://api.kit.forhosting.com/web/twitter-card-generate \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"card_type":"summary_large_image","title":"A Practical Guide to Accessible Forms"}'

const res = await fetch("https://api.kit.forhosting.com/web/twitter-card-generate", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "card_type": "summary_large_image",
    "title": "A Practical Guide to Accessible Forms"
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/web/twitter-card-generate",
    headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
    json={
    "card_type": "summary_large_image",
    "title": "A Practical Guide to Accessible Forms"
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/web/twitter-card-generate", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => '{"card_type":"summary_large_image","title":"A Practical Guide to Accessible Forms"}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"card_type":"summary_large_image","title":"A Practical Guide to Accessible Forms"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/web/twitter-card-generate", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

Exemplo de requisição

{
  "card_type": "summary_large_image",
  "title": "A Practical Guide to Accessible Forms"
}

Exemplo de resposta

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "web.twitter_card_generate",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

A API é assíncrona: cada chamada devolve um task_id na hora. Se preferir polling, consulte o status a até 1 requisição por segundo.

Preço

por chamadaUS$ 0,002

Preço publicado, sem tokens nem créditos escondidos. Tarefa que falha não é cobrada.

Limites

`timeout_sec`	30
`max_crawl_pages`	25

Erros

HTTP	Código	O que significa
`401`	`unauthorized`	Token ausente ou inválido. Confira o header Authorization.
`402`	`insufficient_balance`	Saldo insuficiente para esta tarefa. Faça uma recarga e tente de novo.
`404`	`unknown_type`	Esse tipo de tarefa não existe. Confira o campo type no catálogo.
`429`	`rate_limited`	Muitas requisições em pouco tempo. Espere um instante e tente de novo.

Notas técnicas

Escolha o formato adequado para a prévia

O summary_large_image dá muito mais espaço à imagem e combina com reportagens, lançamentos, portfólios, receitas e páginas cuja arte oferece contexto relevante.

Forneça conteúdo seguro para HTML

Uma imagem informada deve usar uma URL absoluta HTTP ou HTTPS.

Instale e confira as tags geradas

Mantenha uma tag twitter:card e uma twitter:title, seguidas de twitter:description e twitter:image quando esses valores opcionais existirem. Em publicações automatizadas, a API custa US$ 0,002 por solicitação; a versão do navegador usa a mesma lógica determinística.

Casos de integração

Prepare os metadados de um artigo novo

Transforme título, resumo e URL da imagem principal em um bloco summary_large_image pronto para colar.

Perguntas técnicas

Quais tipos de Twitter Card são aceitos?

O gerador aceita summary e summary_large_image. Qualquer outro tipo retorna um erro invalid_input.

Quanto custa a geração pela API?

Cada solicitação de API custa US$ 0,002. A versão do navegador roda localmente com o mesmo algoritmo determinístico.

Ver a documentação completa do KIT →

Executar grátis

Escolha o formato adequado para a prévia

Forneça conteúdo seguro para HTML

Instale e confira as tags geradas

Casos de uso

Adicione tags sociais a um site estático

Identifique tipos de cartão incompatíveis

Perguntas frequentes

Ferramentas relacionadas

Para desenvolvedores — acesso via API

Endpoint

Chame do seu código

Exemplo de requisição

Exemplo de resposta

Preço

Limites

Erros

Notas técnicas

Escolha o formato adequado para a prévia

Forneça conteúdo seguro para HTML

Instale e confira as tags geradas

Casos de integração

Prepare os metadados de um artigo novo

Perguntas técnicas

obrigado