0

Olá,

Estou com uma situação que preciso da ajuda.

Tenho um site responsivo onde o layout é adaptável a diversas telas, onde o conteúdo apresentado e a forma como apresentar será de acordo com a resolução do usuário! Mediante isso, tenho um código js do Ad Manager (Gerenciador de Publicidade do Google) onde tenho que incorporar códigos js. Os códigos serão incorporados de acordo com a resolução da tela do usuário.

Estou usando css para ocultar e apresentar partes do código de acordo com a resolução da tela do usuário exemplo:

@media (max-width:992px) {
body {
    padding-top: 76px;
}       
.header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
    background: #fff;
}   
.header-redesocial, .header-busca, .banner-300x250-desktop {
    display: none !important;
}
.banner-300x250-mobile {
    display: block !important;      
}

}

No caso, eu exibo um código e oculto outro de acordo com a resolução.

Problema enfrentado, mesmo ocultado o código de acordo com a resolução, os servidores do google contam como se o código fosse invocado, ou seja, inserido e apresentado para o usuário mesmo não sendo apresentado devido ao tamanho da resolução da tela do usuário!

Como fazer o código de forma correta para inserir os códigos do google de forma que o google não contabilizara a inserção? Ocultado o div apenas não está funcionando pois ele existe, só não exibe para o usuário, então o google entende que foi inserido pelo visto.

Grato.

Segue o código js a ser inserido:

<script>
      googletag.cmd.push(function() {
        googletag.defineSlot('/444444/home-630x100', [630, 100], 'div-gpt-ad-166399527555553-').addService(googletag.pubads());

</script>

código acima para apresentar os banners, sendo um código para cada bloco de anúncios, se tiver 10, tem que invocar 10 códigos no

Código abaixo para apresentar os banner: esse que preciso ocultar e apresentar de acordo com a resolução

<!-- /6666/home-mobile-300x100-01 -->
<div id='div-gpt-ad-166399527555553-0' style='height:100px; width:300px;'>
<script>
googletag.cmd.push(function() { googletag.display('div-gpt-ad-166399527555553-'); });
</script>

1 Resposta 1

1

Usando javascript é possível fazer isso analisando por exemplo o window.innerWidth para identificar a resolução, depois criar um elemento do tipo "script" e adicionar a sua página:

var scriptDinamico = document.createElement("script");
scriptDinamico.type = "text/javascript";

if (window.innerWidth > 640 && window.innerWidth < 900){
    scriptDinamico.src = "http://urldoscript/script640-900.js";
} else if (.... outras resoluções ) {
    scriptDinamico.src = "http://urldoscript/script901-1200.js";
}

document.getElementsByTagName('head')[0].appendChild(scriptDinamico);

Ao final, pode usar o appendChild para adicionar à tag head da página

2
  • editei o código e coloquei o que deve ser invocado! Aconselha a deixar tudo de uma vez no head o que precisar ou invocar quando precisar?
    – lelopes
    16/07/2019 às 20:58
  • quando está executando googletag o script já está carregado, então pode colocar apenas esse código dentro do if e não precisa carregar o script em si, só executar os comandos do googletag ao que parece 16/07/2019 às 21:06

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .