Guia de implementação

Anúncio nativo

Native ads

Anúncio montado com peças (título, imagem, texto) e vestido com o visual do seu site, sempre com o selo que avisa que é anúncio.

Ad Manager
celular e desktop

Aprender o formato Conferir no meu site

Desktop

Celular

Entenda em 1 minuto

O que é o anúncio nativo

O anúncio nativo chega em peças soltas, e não como uma figura pronta. O anunciante manda as peças, como o título, a imagem e um texto curto. Quem decide a roupa é o seu site: cor, letra, tamanho e lugar de cada peça. É como um kit de montar: a caixa traz as peças, e você monta do jeito que combina com a sua sala. Por isso ele parece parte da página, como mais um card numa lista de artigos.

No Ad Manager existem dois jeitos de vestir esse anúncio. O primeiro são os estilos nativos, criados dentro do próprio Ad Manager, com o editor de design guiado, que tem modelos prontos, ou com HTML e CSS, para quem sabe código. O Google diz que os estilos servem tanto para a web quanto para apps. O segundo é o código de apps Android e iOS, em que o desenvolvedor do aplicativo recebe as peças pelo SDK do Google Mobile Ads e desenha tudo no código do app. Para sites, o caminho é o estilo nativo.

Como o nativo parece conteúdo, o Google é bem firme numa coisa: quem visita precisa saber que é anúncio. O selo de atribuição e o ícone AdChoices marcam o card como publicidade. Nada pode esconder, cobrir ou disfarçar esses selos, e o anúncio precisa ficar claramente separado do conteúdo. É como um cartaz de propaganda dentro de uma loja: pode ser bonito e combinar com a decoração, mas tem que deixar claro que é propaganda.

O Google criou esse formato para que o mesmo anúncio possa aparecer com visuais diferentes em cada parte do site, sem mudar o que o anunciante mandou. Na web, o Google recomenda o tamanho Flexível (fluid), que ocupa a largura da coluna e ajusta a altura sozinho. Vale a pena usar quando você quer anúncios que combinem com o desenho das suas páginas, como entre os itens de uma lista de posts, sempre com o selo de anúncio bem visível.

Passo a passo

Como implementar

Escolha o formato nativoNo Ad Manager, vá em Exibição e depois em Nativo. Use um formato padrão com as peças de que precisa. Para anúncios programáticos, o Google só aceita formatos padrão.
Crie o estiloClique em Novo estilo nativo e escolha Editor de design guiado ou HTML e CSS. No editor guiado, o caminho Começar com modelos e fazer personalizações serve anúncios tradicionais e programáticos.
Defina tamanho e segmentaçãoEscolha o mesmo tamanho dos blocos de anúncio que vão receber o nativo. O Google recomenda Flexível. Se o estilo for Flexível, o bloco de anúncio também precisa ser Flexível, e a segmentação do estilo deve combinar com a do item de linha.
Monte o visual com o seloMostre todas as peças obrigatórias do formato, incluindo o selo de anúncio.
Coloque a tag na páginaDefina o slot na GPT com o tamanho fluid e coloque a div dentro de uma coluna com largura maior que zero.

Exemplo implementado

O código e como fica na tela

O script da GPT vai no head; a div com a chamada de exibição vai no body, dentro da coluna onde o anúncio nativo deve aparecer.

<!-- No <head> -->
<script async
  src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"
  crossorigin="anonymous"></script>
<script>
  window.googletag = window.googletag || { cmd: [] };
  googletag.cmd.push(() => {
    // Slot nativo com tamanho fluido.
    googletag
      .defineSlot("/1234567/exemplo", ["fluid"], "nativo-exemplo")
      .addService(googletag.pubads());
    googletag.enableServices();
  });
</script>

<!-- No <body>, dentro de uma coluna com largura -->
<div id="nativo-exemplo"></div>
<script>
  googletag.cmd.push(() => {
    googletag.display("nativo-exemplo");
  });
</script>

No desktopAparece como um card que combina com o site, com imagem, título, texto e o selo de anúncio. No tamanho Flexível (fluid), ocupa a largura da coluna onde está.

No celularAparece do mesmo jeito, ajustado à largura da tela. Nos estilos programáticos, o ícone AdChoices fica visível no canto superior direito.

O que o Google orienta

Pode e não pode

Pode

Criar estilos nativos dentro do Ad Manager, pelo Editor de design guiado ou por HTML e CSS.
Usar o tamanho Flexível (fluid), que o Google recomenda para dar mais liberdade ao visual.
Mudar o visual do selo de atribuição para combinar com o layout, desde que continue fácil de ler.
Mostrar o mesmo anúncio com layouts diferentes em partes diferentes do site.
Criar um formato nativo personalizado para anúncios tradicionais, sabendo que ele não recebe anúncios programáticos.

Não pode

Esconder, cobrir ou disfarçar o selo de atribuição ou o ícone AdChoices.
Deixar o anúncio difícil de diferenciar do conteúdo. O Google exige que anúncios fiquem claramente separados do conteúdo.
Fazer peças do anúncio imitarem os botões de navegação da página.
Deixar de mostrar as peças obrigatórias do formato, como o selo de anúncio e o título.
Cortar imagens e vídeos, mudar a proporção deles ou deixar peças se sobrepondo.
Colocar outra parte do anúncio no canto reservado ao AdChoices.

Dicas

Para fazer do jeito certo

No formato de conteúdo programático, o título tem até 90 caracteres. Planeje o espaço pensando nisso.
Anúncios fluidos funcionam melhor dentro de uma coluna com largura maior que zero pixels.
Use texto com bom contraste e só fontes aceitas. Nos estilos programáticos, o Google não aceita fontes ou bibliotecas de terceiros.
O Google avisa que anúncios fluidos podem demorar mais para aparecer e podem mexer no conteúdo ao redor quando mudam de altura.

Cuidado

Erros comuns

Tamanho do estilo diferente do bloco

Se o estilo está como Flexível, o bloco de anúncio também precisa estar como Flexível. O Google diz que os tamanhos precisam ser iguais.

Formato personalizado esperando programático

Formato nativo personalizado não recebe anúncios programáticos. Para programático, só valem os formatos padrão.

Caixa sem largura ou com altura travada

Um anúncio fluido numa coluna de largura zero, ou dentro de uma caixa com altura fixa menor que o anúncio, pode aparecer errado.

Perguntas frequentes

O anúncio nativo precisa mesmo dizer que é anúncio?

Sim. O selo de atribuição e o AdChoices servem para que ninguém confunda o anúncio com conteúdo, e não podem ser escondidos nem disfarçados.

O código de apps Android e iOS funciona em site?

Não. O Google descreve esse caminho para apps Android e iOS, usando o SDK do Google Mobile Ads. Em sites, o caminho é o estilo nativo.

Posso usar o tamanho fluido em outros anúncios?

Segundo a documentação da GPT, hoje o anúncio nativo é o único tipo fluido que o Ad Manager aceita.

Biblioteca

Fonte oficial do Google

Tudo nesta página segue a documentação oficial do Google. Leia direto na fonte:

Seu site usa este formato do jeito certo?

A auditoria lê o site como um visitante, sem clicar em nada, e mostra o que corrigir.

Fazer uma auditoria