Introdução
Quando seu blog começa a ganhar leitores, surgem três necessidades naturais:
| Necessidade | Ferramenta Google |
|---|---|
| Saber quantas pessoas visitam e de onde vêm | Google Analytics 4 |
| Aparecer no Google e ser indexado corretamente | Google Search Console |
| Gerar receita sem invadir a experiência do leitor | Google AdSense |
As três ferramentas compartilham a mesma conta Google e se complementam. Este guia cobre as três do zero — da criação da conta à integração real com Hugo + PaperMod — incluindo os arquivos exatos que precisam ser criados ou editados.
Pré-requisitos
Antes de começar, confirme que você tem:
- Blog Hugo publicado em domínio próprio (
https://seudominio.com.br) com HTTPS ativo - Tema PaperMod instalado (qualquer versão recente)
- Conta Google (Gmail serve)
- Pelo menos algumas páginas publicadas (o Google rejeita sites vazios)
enableRobotsTXT = truenohugo.toml✅ (este blog já tem)
Estrutura de arquivos relevante para este tutorial:
| |
Parte 1 — Google Search Console (indexação e SEO)
O Search Console diz ao Google que seu site existe, quais páginas indexar e fornece relatórios de desempenho orgânico: cliques, impressões, posição média para cada palavra-chave.
Passo 1.1 — Criar a propriedade no Search Console
- Acesse search.google.com/search-console e clique em “Adicionar propriedade”.
- Escolha “Prefixo de URL” e informe
https://seudominio.com.br(com HTTPS, sem barra no final). - Na tela de verificação, selecione o método “Tag HTML”.
O console exibirá algo como:1<meta name="google-site-verification" content="AbCdEfGhIjKlMnOpQrStUvWxYz1234567" /> - Copie apenas o valor do
content— no exemplo acima:AbCdEfGhIjKlMnOpQrStUvWxYz1234567.
Não clique em “Verificar” ainda (o site precisa estar publicado com a tag primeiro).
Passo 1.2 — Adicionar a verificação ao hugo.toml
Abra hugo.toml na raiz do projeto e, dentro do bloco [params] existente, adicione a linha:
| |
O PaperMod renderiza automaticamente essa meta-tag no <head> de todas as páginas.
Como verificar que a tag foi inserida: publique o blog, abra qualquer página no browser, pressione
Ctrl+Upara ver o código-fonte e procure porgoogle-site-verification. Ela deve aparecer dentro do<head>.
Passo 1.3 — Verificar a propriedade
- Volte ao Search Console e clique em “Verificar”.
- O status deverá mudar para “Verificado” ✅.
- Se falhar, aguarde alguns minutos (o cache do CDN pode atrasar a atualização) e tente novamente.
Passo 1.4 — Enviar o sitemap
O Hugo gera sitemap.xml automaticamente na raiz de public/. Precisamos informar ao Google:
- No painel do Search Console, vá em Índice → Sitemaps.
- No campo “Adicionar novo sitemap”, digite
sitemap.xmle clique Enviar. - Aguarde; após processamento, o status muda para “Sucesso” e exibe a contagem de URLs encontradas.
Este blog já tem
enableRobotsTXT = truenohugo.toml, então o Google também receberá umrobots.txtcorreto automaticamente. Confirme emhttps://seudominio.com.br/robots.txtque não háDisallow: /.
Passo 1.5 — Verificar a indexação de páginas individuais
Após alguns dias, use a Inspeção de URL (ícone de lupa no topo do Search Console):
- Cole a URL completa de qualquer artigo.
- Se aparecer “URL não está no Google”, clique em “Solicitar indexação”.
- O Google coloca a URL na fila de rastreamento — normalmente aparece indexada em 24–72 horas.
Parte 2 — Google Analytics 4 (estatísticas de visitas)
O GA4 registra sessões, usuários únicos, páginas mais visitadas, origem do tráfego, dispositivos, duração de sessão e muito mais.
Passo 2.1 — Criar a conta e a propriedade GA4
- Acesse analytics.google.com → “Começar a medir”.
- Preencha o nome da conta (ex.:
Blog zocate.li). - Crie a Propriedade:
- Nome: nome do seu blog
- Fuso horário:
(GMT-03:00) Horário de Brasília - Moeda:
Real Brasileiro (BRL)
- Em Plataforma, selecione Web.
- Informe a URL do site e o nome do stream de dados (ex.:
zocate.li). - Anote o ID de medição no formato
G-XXXXXXXXXX— você vai precisar dele no próximo passo.
Passo 2.2 — Integrar o GA4 ao Hugo
O Hugo possui suporte nativo ao Google Analytics via o bloco [services]. O PaperMod lê automaticamente essa configuração, portanto basta adicionar ao hugo.toml:
| |
Onde colocar: fora do bloco
[params], no nível raiz dohugo.toml. Veja o exemplo completo na Parte 4.
Como o PaperMod controla quando o script é carregado
O PaperMod injeta o script do GA4 somente quando params.env = "production". Este blog já tem isso definido em hugo.toml:
| |
Quando você executa hugo server localmente, o Hugo carrega o ambiente development e aplica as overrides de config/development/hugo.toml. Para desativar o GA em desenvolvimento e não poluir suas métricas, adicione ao arquivo config/development/hugo.toml:
| |
Após essa adição, seu config/development/hugo.toml fica assim:
| |
Verificar se o GA4 está sendo carregado em produção
Publique o blog e inspecione o HTML de qualquer página:
| |
Você deve ver algo como:
| |
Passo 2.3 — Confirmar coleta de dados no painel GA4
- Acesse o GA4 e vá em Relatórios → Tempo real.
- Abra seu blog em outra aba (com o ambiente production publicado).
- O painel de “Tempo real” deve mostrar 1 usuário ativo. ✅
Passo 2.4 — Vincular GA4 ao Search Console
Isso permite ver no Analytics quais termos de busca trouxeram visitantes orgânicos.
- No GA4: Administrador (engrenagem) → Vínculos de produtos → Search Console.
- Clique em Vincular → selecione sua propriedade do Search Console → Confirmar.
- Após alguns dias, o relatório “Aquisição → Aquisição de tráfego → Search Console” mostrará palavras-chave e posições.
Parte 3 — Google AdSense (monetização suave)
O AdSense exibe anúncios contextualmente relevantes. O modo Anúncios automáticos é o mais “suave”: o Google escolhe posicionamento e formato com mínima intrusão ao leitor.
Passo 3.1 — Criar a conta AdSense
- Acesse adsense.google.com → “Começar agora”.
- Informe a URL do site (
https://seudominio.com.br) e o idioma principal (Português). - Preencha dados fiscais (CPF ou CNPJ) e endereço — o Google exige isso para emitir pagamentos.
- Aceite os termos e envie o pedido de análise.
Critérios de aprovação:
— Site com HTTPS e domínio próprio ✅
— Conteúdo original (sem cópia de outros sites) ✅
— Política de Privacidade publicada e acessível ✅
— Sem conteúdo proibido (violência, adulto, pirataria)
— Volume mínimo de conteúdo (geralmente ≥ 20–30 artigos)
A análise pode levar de alguns dias até 2–3 semanas. O Google pode pedir revisão adicional.
Passo 3.2 — Escolher a estratégia de posicionamento
O AdSense oferece duas abordagens:
| Abordagem | Como funciona | Prós | Contras |
|---|---|---|---|
| Anúncios automáticos | Google decide onde e quando exibir | Zero configuração | Pode inserir ads no meio de blocos de código |
| Unidades manuais | Você define posição e formato exatos | Controle total da experiência | Requer configuração no template |
Para um blog técnico, a abordagem manual é recomendada: evita que anúncios apareçam dentro de trechos de código e mantém a leitura fluida.
Obtendo o Publisher ID
- No painel AdSense, clique em Anúncios → Por unidade de anúncio.
- O seu Publisher ID (
ca-pub-XXXXXXXXXXXXXXXXX) aparece no canto superior direito do painel. - Anote-o — será usado no
hugo.toml.
Criando as unidades de anúncio manuais
Crie duas unidades:
Unidade 1 — In-Article (exibida no meio do post, após o 4º parágrafo):
- Clique em “Criar unidade de anúncio” → “In-article”.
- Dê o nome
in-article-post. - Copie o valor de
data-ad-slotexibido no snippet — ex.:1234567890.
Unidade 2 — Display (exibida antes dos comentários):
- Clique em “Criar unidade de anúncio” → “Display”.
- Dê o nome
display-pre-comments, formato Responsivo. - Copie o valor de
data-ad-slot— ex.:0987654321.
Passo 3.3 — Adicionar o AdSense ao hugo.toml
Adicione o Publisher ID e os dois slot IDs ao hugo.toml, dentro do bloco [params]:
| |
Enquanto os slots estiverem com string vazia
"", nenhum anúncio é renderizado — seguro para commits parciais.
Passo 3.4 — Atualizar layouts/partials/extend_head.html
O PaperMod expõe o hook extend_head.html para injetar código no <head> sem modificar o tema. O arquivo deve conter o Google Consent Mode v2 (obrigatório para GDPR/LGPD) seguido do script do AdSense:
| |
Consent Mode v2 é exigido pelo Google para publishers que atendem usuários europeus (GDPR). Os padrões são todos
denied; o banner de cookies (implementado noextend_footer.html) chamagtag('consent', 'update', ...)quando o usuário aceita.
GA4: não inclua aqui — o PaperMod injeta automaticamente via[services.googleAnalytics].
Passo 3.5 — Criar os partials de anúncio
Crie dois arquivos em layouts/partials/:
layouts/partials/adsense-inarticle.html — anúncio In-Article:
| |
layouts/partials/adsense-display.html — anúncio Display:
| |
Passo 3.6 — Atualizar layouts/_default/single.html
Este arquivo controla o layout de cada post. Edite-o para injetar os dois anúncios:
- In-Article: via JavaScript, inserido dinamicamente após o 4º parágrafo do conteúdo
- Display: posicionado entre as tags do post e a seção de comentários
| |
Por que usar
<template>? O elemento<template>não é renderizado pelo browser até ser clonado via JS. Isso evita que o AdSense tente inicializar o anúncio antes de ele estar posicionado no DOM, eliminando erros deadsbygoogle.push.
Passo 3.7 — Verificar que os anúncios aparecem em produção
Após publicar:
| |
Saída esperada:
| |
Se não aparecer, confirme que env = "production" está em hugo.toml e que o build foi feito em modo production.
Parte 4 — Configuração final do hugo.toml
Consolidando todos os passos anteriores, o seu hugo.toml deve ter as seguintes adições:
| |
E o config/development/hugo.toml com a override de ambiente:
| |
Parte 5 — Atualizar a Política de Privacidade
Com AdSense e Analytics ativos, a política de privacidade precisa mencionar o uso de cookies de terceiros. A página /privacy/ já existe neste blog — adicione uma nova seção 2.4 (ou equivalente) com o seguinte conteúdo:
| |
Este blog já possui
/privacy/e/terms/linkados no footer. Após editar, o conteúdo passa a estar em conformidade com os Termos do Programa AdSense e com a LGPD (Lei nº 13.709/2018).
Parte 6 — Testar localmente
Verificar que os scripts NÃO aparecem em desenvolvimento
| |
Abra http://localhost:1313, pressione Ctrl+U e confirme que não há referência a googletagmanager nem pagead2 no HTML. ✅
Simular o ambiente de produção localmente
| |
Agora os scripts devem aparecer no HTML (o override de env = "development" é ignorado pois você forçou production). Confirme com Ctrl+U.
Validar o build final
| |
Examine public/index.html e confirme a presença dos scripts no <head>.
Parte 7 — Checklist de validação completo
Execute cada item após a publicação em produção:
Search Console
- Propriedade verificada — status “Verificado” no painel
- Sitemap enviado — status “Sucesso” com contagem de URLs
-
robots.txtacessível emhttps://seudominio.com.br/robots.txtsemDisallow: / - Inspeção de URL em pelo menos 3 artigos — todos com status “URL está no Google” ou “Solicitar indexação” acionado
Google Analytics 4
- Relatório “Tempo real” mostra atividade ao navegar no blog em produção
- ID
G-XXXXXXXXXXaparece no<head>do HTML em produção - ID não aparece no HTML em desenvolvimento local (
hugo server) - Search Console vinculado ao GA4 (em Administrador → Vínculos de produtos)
Google AdSense
- Snippet
ca-pub-XXXXXXXXXXXXXXXXXaparece no<head>em produção - Snippet não aparece em desenvolvimento local
- Dados fiscais e endereço preenchidos no painel AdSense
-
ads.txtacessível emhttps://seudominio.com.br/ads.txtcom a linhagoogle.com, pub-XXXXXXXXXXXXXXXX, DIRECT, f08c47fec0942fa0 - Revisão solicitada no painel AdSense após publicar o código
- Unidade In-Article criada no painel — slot ID preenchido em
googleAdSenseInArticleSlot - Unidade Display criada no painel — slot ID preenchido em
googleAdSenseDisplaySlot - Anúncio In-Article aparece após o 4º parágrafo em posts com ≥ 4 parágrafos
- Anúncio Display aparece antes dos comentários
Privacidade e conformidade
- Página
/privacy/menciona Google Analytics e Google AdSense - Página
/privacy/contém link parahttps://www.google.com/settings/ads - Política de Privacidade acessível no footer do blog ✅ (já existe)
Segurança
- HTTPS ativo e certificado válido (cadeado no browser)
-
extend_head.htmlusaif eq .Site.Params.env "production"para não vazar em dev
Parte 8 — Boas práticas de SEO para amplificar os resultados
Com o Search Console ativo, as práticas abaixo têm impacto direto mensurável:
description em todos os posts
O PaperMod usa o campo description do front matter como <meta name="description">. O Google exibe esse texto nos resultados de busca:
| |
alt descritivo em todas as imagens
O Google indexa imagens. Sempre preencha:
| |
keywords para reforçar o tema
O PaperMod suporta o campo keywords no front matter (renderizado como meta-tag):
| |
slug amigável
Use slugs descritivos e sem stop words desnecessárias:
| |
Dados estruturados (Schema.org)
O PaperMod já injeta automaticamente:
Articlecom autor, data e headlineBreadcrumbListpara navegação
Verifique em search.google.com/test/rich-results colando a URL de qualquer artigo.
Core Web Vitals
No Search Console, acompanhe “Experiência na página → Core Web Vitals”. Para um blog Hugo estático os scores costumam ser excelentes por padrão. As principais causas de regressão são:
| Métrica | Causa comum | Solução |
|---|---|---|
| LCP (Largest Contentful Paint) | Imagem de capa muito grande | Usar .webp ≤ 150 KB |
| CLS (Cumulative Layout Shift) | Imagens sem width/height | Sempre definir dimensões |
| INP (Interaction to Next Paint) | Scripts de terceiros bloqueantes | async obrigatório no AdSense ✅ |
Conclusão
Resumo do que foi configurado:
| Ferramenta | Arquivo modificado | O que ganha |
|---|---|---|
| Search Console | hugo.toml ([params.analytics.google]) | Indexação garantida, palavras-chave orgânicas, alertas de erros |
| GA4 | hugo.toml ([services.googleAnalytics]) + config/development/hugo.toml | Sessões, usuários únicos, páginas populares, origem do tráfego |
| AdSense | hugo.toml (googleAdSense + slots) + layouts/partials/extend_head.html + adsense-inarticle.html + adsense-display.html + layouts/_default/single.html | Receita passiva com posicionamento controlado |
| Privacidade | content/privacy/index.md | Conformidade com LGPD e Termos do AdSense |
O ciclo virtuoso: bom SEO → mais tráfego orgânico → mais dados no Analytics → mais receita no AdSense.
A aprovação do AdSense pode levar semanas; use esse tempo para publicar mais conteúdo, resolver eventuais alertas no Search Console e otimizar os Core Web Vitals. Com o tráfego crescendo, o ecossistema se retroalimenta.
Qualquer dúvida, deixe um comentário abaixo. 🚀
Ao comentar, você concorda com nossa Política de Privacidade, Termos de Uso e Política de Exclusão de Dados.