Como usar
- Preencha os campos com o título, a descrição e a URL canônica da página.
- Deixe Incluir Open Graph e Incluir Twitter Card marcados para gerar as tags de compartilhamento, ou desmarque o que não quiser usar.
- Escolha o tipo da página em og:type e o formato do cartão em Twitter card.
- Copie o código gerado e cole na seção head do HTML da página.
Exemplos
Artigo com texto próprio para redes sociais
Entrada
Título: Como fazer café coado em casa | Café da Serra Descrição: Aprenda a escolher a moagem, medir o café e controlar a temperatura da água para preparar um café coado equilibrado em casa. URL canônica: https://cafedaserra.com.br/blog/cafe-coado Imagem: https://cafedaserra.com.br/imagens/cafe-coado.jpg Texto alternativo da imagem: Café sendo preparado em um coador de papel Nome do site: Café da Serra Twitter @site: @cafedaserra Título para redes sociais: Seu café coado pode ficar melhor Descrição para redes sociais: Veja as medidas e os cuidados que fazem diferença na próxima xícara. Localidade: pt_BR Autor: Marina Costa
Saída
<meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Como fazer café coado em casa | Café da Serra</title> <meta name="description" content="Aprenda a escolher a moagem, medir o café e controlar a temperatura da água para preparar um café coado equilibrado em casa."> <meta name="robots" content="index, follow, max-image-preview:large"> <meta name="author" content="Marina Costa"> <link rel="canonical" href="https://cafedaserra.com.br/blog/cafe-coado"> <!-- Open Graph --> <meta property="og:type" content="article"> <meta property="og:url" content="https://cafedaserra.com.br/blog/cafe-coado"> <meta property="og:title" content="Seu café coado pode ficar melhor"> <meta property="og:description" content="Veja as medidas e os cuidados que fazem diferença na próxima xícara."> <meta property="og:image" content="https://cafedaserra.com.br/imagens/cafe-coado.jpg"> <meta property="og:image:alt" content="Café sendo preparado em um coador de papel"> <meta property="og:site_name" content="Café da Serra"> <meta property="og:locale" content="pt_BR"> <!-- Twitter --> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@cafedaserra"> <meta name="twitter:image:alt" content="Café sendo preparado em um coador de papel">
Página de homologação com noindex
Entrada
Título: Catálogo de teste | Loja Ipê Descrição: Ambiente de homologação do catálogo da Loja Ipê para revisar produtos, fotos e descrições antes da publicação. URL canônica: https://homologacao.lojaipe.com.br/catalogo
Saída
<meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Catálogo de teste | Loja Ipê</title> <meta name="description" content="Ambiente de homologação do catálogo da Loja Ipê para revisar produtos, fotos e descrições antes da publicação."> <meta name="robots" content="noindex, follow"> <link rel="canonical" href="https://homologacao.lojaipe.com.br/catalogo">
Perguntas frequentes
Qual é o tamanho recomendado para o título e a meta descrição?
O contador considera boa a faixa de 30 a 60 caracteres para o título, desde que ele não ultrapasse 580 px, e de 70 a 160 caracteres para a descrição. Esses indicadores orientam a edição; não são limites dos campos.
A prévia mostra exatamente como a página vai aparecer no Google?
A prévia é uma aproximação, não um resultado consultado no Google. O Google pode reescrever o título e a descrição.
O gerador cria meta keywords?
A ferramenta não gera meta keywords e não tem campo para palavras-chave.
Os dados preenchidos são enviados ou salvos?
As tags são geradas no navegador, sem enviar os valores dos campos ao servidor do site. Apenas as opções são salvas no navegador; os textos não são salvos. Ao abrir a prévia do Facebook ou do X, o navegador carrega a imagem diretamente da URL informada.