Abrir workspace

Guia de implementação

Anúncio de barra lateral

Side rail ads

Anúncio preso na lateral esquerda ou direita da tela em computadores de tela larga, no espaço vazio ao lado do conteúdo.

  • AdSense
  • Ad Manager
  • só desktop
Aprender o formatoConferir no meu site
Desktop
Celular

Entenda em 1 minuto

O que é o anúncio de barra lateral

O anúncio de barra lateral fica grudado no lado esquerdo ou direito da tela, no espaço vazio que sobra ao lado do texto. Imagine uma sala de aula com um mural na parede do lado: os alunos olham para o quadro na frente, e o mural fica ali, sem atrapalhar. A barra lateral é esse mural. A pessoa rola a página e o anúncio continua parado no mesmo lugar.

Ela é feita para telas largas, como as de computador. Muitos sites têm o texto no meio e duas faixas vazias dos lados, e a barra lateral usa esse espaço sem empurrar nem cobrir o conteúdo. No AdSense, ela faz parte dos anúncios automáticos, no grupo formatos overlay, com o nome Anúncios de coluna lateral. Você liga com um clique e escolhe à esquerda e à direita, somente à esquerda ou somente à direita.

No Ad Manager, quem mostra a barra lateral é o GPT, a Google Publisher Tag, que é o código do Google que pede anúncios. Você cria um slot, que é o espaço de anúncio, do tipo barra lateral esquerda ou direita. O próprio GPT cria a caixinha do anúncio e coloca ela perto do conteúdo, entre 5 e 25 pixels de distância. Se a janela ficar menor e o espaço sumir, o anúncio se esconde até o espaço voltar.

Vale a pena quando o seu site tem bastante espaço livre dos lados em telas grandes. O GPT pede uma tela de pelo menos 1200 por 650 pixels e um espaço vazio de pelo menos 120 por 500 pixels ao lado do conteúdo. Se o seu layout ocupa a tela toda de ponta a ponta, não sobra lugar e o anúncio simplesmente não aparece.

Passo a passo

Como implementar

  1. Coloque o código em todas as páginasO código do AdSense precisa estar em todas as páginas. Depois de ativar, os anúncios podem levar até uma hora para aparecer.
  2. Ligue no AdSenseClique em Anúncios e em Editar ao lado do site. Ative Anúncios automáticos e, em Formatos overlay, marque Anúncios de coluna lateral. Clique em Aplicar ao site e escolha Aplicar agora ou Realizar experimento primeiro.
  3. Escolha o ladoNas configurações avançadas, use Selecionar a posição do anúncio de coluna lateral: À esquerda e à direita, Somente à esquerda ou Somente à direita.
  4. No Ad Manager, crie os slots no headNo GPT, defina slots fora da página do tipo barra lateral esquerda e barra lateral direita. Confira se cada um não voltou vazio antes de usar.
  5. Use os tamanhos certosPara reservas e para programático, os tamanhos da barra lateral no computador são 180x500, 160x600 e 120x600.
  6. Teste com a demonstraçãoAcrescente no fim do endereço da página o código de demonstração mostrado no exemplo para ver uma barra lateral de teste sem mudar o código.

Exemplo implementado

O código e como fica na tela

O atributo do AdSense vai no elemento que envolve a parte da página a proteger; o bloco do GPT vai no head de quem usa Ad Manager.
<!-- AdSense: parte da página onde a barra lateral não deve sobrepor -->
<div google-side-rail-overlap="false">
  ... conteúdo ...
</div>

<!-- Ad Manager (GPT), 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(() => {
    const leftSideRail = googletag.defineOutOfPageSlot(
      "/1234567/exemplo",
      googletag.enums.OutOfPageFormat.LEFT_SIDE_RAIL,
    );
    const rightSideRail = googletag.defineOutOfPageSlot(
      "/1234567/exemplo",
      googletag.enums.OutOfPageFormat.RIGHT_SIDE_RAIL,
    );
    // Volta null se a página ou o aparelho não aceitar barra lateral
    if (leftSideRail) leftSideRail.addService(googletag.pubads());
    if (rightSideRail) rightSideRail.addService(googletag.pubads());
    googletag.enableServices();
    if (leftSideRail) googletag.display(leftSideRail);
    if (rightSideRail) googletag.display(rightSideRail);
  });
</script>

<!-- Teste: acrescente no fim do endereço da página -->
<!-- #gamLeftSideRailDemo ou #gamRightSideRailDemo -->
No desktopNo computador, o anúncio aparece numa coluna fixa ao lado do conteúdo, à esquerda, à direita ou dos dois lados, e continua visível enquanto a pessoa rola a página.
No celularNão existe no celular.

O que o Google orienta

Pode e não pode

Pode

  • Escolher à esquerda e à direita, somente à esquerda ou somente à direita no AdSense.
  • Proteger uma parte da página com o atributo oficial, para a barra lateral não ficar sobre aquela seção.
  • Testar antes com um experimento em 50% do tráfego por até 90 dias.
  • No Ad Manager, vender a barra lateral em reservas e no programático, com os tamanhos 180x500, 160x600 e 120x600.
  • Medir o resultado no AdSense com um relatório personalizado, filtrando em Formato do anúncio por Anúncios de coluna lateral.

Não pode

  • Não peça barra lateral em páginas onde você não quer que ela apareça.
  • Não rode o GPT dentro de um iframe: a barra lateral precisa do GPT na janela principal.
  • Não ocupe todo o espaço dos lados com outros elementos se quer esse anúncio: sem pelo menos 120 por 500 pixels vazios, ele não aparece.
  • Não coloque links, menus ou botões de download colados nos anúncios: o Google avisa que isso pode gerar cliques acidentais.
  • Não altere o código do AdSense além das modificações aceitas pelo Google, e não incentive cliques no anúncio.

Dicas

Para fazer do jeito certo

Cuidado

Erros comuns

Testar numa tela pequena

O GPT pede uma tela de pelo menos 1200 por 650 pixels. Em janelas menores, o anúncio não aparece.

Layout de ponta a ponta

Se o conteúdo ocupa a largura toda, não sobra o espaço vazio de 120 por 500 pixels e a barra lateral não tem onde ficar.

Não conferir se o slot veio vazio

O GPT devolve null quando a página ou o aparelho não aceita barra lateral. O código precisa conferir isso antes de usar o slot.

Código só em algumas páginas

No AdSense, o código precisa estar em todas as páginas para os anúncios automáticos funcionarem.

Perguntas frequentes

A barra lateral aparece no celular?

Não. No AdSense ela é só para computador, e no Ad Manager ela é um formato de computador que precisa de tela larga.

Preciso criar uma div para ela no GPT?

Não. A barra lateral cria a própria caixinha e coloca ela o mais perto possível do conteúdo.

Posso usar só um lado?

Sim. No AdSense há as opções somente à esquerda e somente à direita, e no GPT você pode definir só o slot do lado que quiser.

Qual a distância entre o anúncio e o conteúdo?

No Ad Manager, o slot fica entre 5 e 25 pixels do conteúdo principal.

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