docs

Denakop technical documentation

View the Project on GitHub denakop/docs

IAB

Esta é a documentação de como implementar os formatos IAB no seu site.


Tag Principal

Copie e cole o snippet de código abaixo dentro da tag head do seu site:

<!-- IMPLEMENTAÇÃO COMEÇA AQUI -->
<script
  async
  src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"
></script>
<script async src="https://v3.denakop.com/prebid.js"></script>
<script async type="text/javascript" src="/1/iab.denakop.com.js"></script>
<script>
  var denakop = denakop || { cmd: [] };
</script>
<!-- IMPLEMENTAÇÃO TERMINA AQUI -->

Postitial

Para mostrar o formato Postitial siga as intruções do snippet abaixo:

<script>
  denakop.cmd.push(function () {
    denakop.usePostitialBanner();
  });
</script>

Under Banner

Para mostrar o formato Under Banner siga as intruções do snippet abaixo:

<script>
  denakop.cmd.push(function () {
    denakop.useUnderBanner();
  });
</script>

Side Banner

Para mostrar o formato Side Banner siga as intruções do snippet abaixo:

<script>
  denakop.cmd.push(function () {
    denakop.useSideBanner({
      containerWidth: <CONTAINER_WITDH>
    });
  });
</script>

Onde

Exemplo Side Banner

<script>
  denakop.cmd.push(function () {
    denakop.useSideBanner({
      containerWidth: 1130,
    });
  });
</script>

In-Text Banner

Para mostrar o formato In-Text Banner coloque o snippet abaixo dentro da tag body exatamente onde você quer que o anúncio apareça

<div id="<DIV_NAME>">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: "<DIV_NAME>",
        name: "intext",
      });
    });
  </script>
</div>

Onde

Exemplo In-Text Banner

<div id="denakop-ad-intext">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: "denakop-ad-intext",
        name: "intext",
      });
    });
  </script>
</div>

Scroll Banner

Para mostrar o formato Scroll Banner coloque o snippet abaixo dentro da tag body exatamente onde você quer que o anúncio apareça

<div id="<DIV_NAME>">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: "<DIV_NAME>",
        name: "scroll",
      });
    });
  </script>
</div>

Onde

Exemplo Scroll Banner

<div id="denakop-ad-scroll">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: "denakop-ad-scroll",
        name: "scroll",
      });
    });
  </script>
</div>

Avançado

Tamanhos Customizaveis

Para forçar o tamanho de anúncios utilize a seguinte configuração de Snippet abaixo:

<div id="<DIV_NAME>">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: '<DIV_NAME>',
        name: 'scroll',
        sizes: <CUSTOM_SIZES>
      });
    });
  </script>
</div>

Onde

Exemplo Tamanhos Customizaveis

<div id="denakop-ad-scroll">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: "denakop-ad-scroll",
        name: "scroll",
        sizes: [[496, 80]],
      });
    });
  </script>
</div>

Tamanhos Customizaveis Por Tipo de Dispositivo

Para forçar o tamanho de anúncios por tipo de dispositivo, utilize a seguinte configuração de Snippet abaixo:

<div id="<DIV_NAME>">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: '<DIV_NAME>',
        name: 'intext',
        sizes: <CUSTOM_SIZES>
      });
    });
  </script>
</div>

Onde

Exemplo Tamanhos Customizaveis Por Tipo de Dispositivo

<div id="denakop-ad-intext">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: "denakop-ad-intext",
        name: "intext",
        sizes: {
          desktop: [[496, 80]],
          tablet: [[120, 600]],
          mobile: [[250, 250]],
        },
      });
    });
  </script>
</div>

Refresh do Banner Customizado

Para forçar o refresh do banner customizado, utilize a seguinte configuração do Snippet abaixo:

<div id="<DIV_NAME>">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: '<DIV_NAME>',
        name: 'intext',
        refresh: <CUSTOM_REFRESH_TIME>
      });
    });
  </script>
</div>

Onde

Exemplo Refresh do Banner Customizado

<div id="denakop-ad-intext">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: "denakop-ad-intext",
        name: "intext",
        refresh: 30,
      });
    });
  </script>
</div>

Targetings Customizados Por Banner

Para forçar targeting customizado no banner, utilize a seguinte configuração do Snippet abaixo:

<div id="<DIV_NAME>">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: '<DIV_NAME>',
        name: 'intext',
        targetings: <CUSTOM_TARGETINGS>
      });
    });
  </script>
</div>

Onde

Exemplo Targetings Customizados Por Banner

<div id="denakop-ad-intext">
  <script type="text/javascript">
    denakop.cmd.push(function () {
      denakop.displayAd({
        divId: "denakop-ad-intext",
        name: "intext",
        targetings: { teste: "123" },
      });
    });
  </script>
</div>

Configurações Globais

Para definir as configurações globais do Denakop utilize a configuração do Snippet abaixo:

<script>
  denakop.cmd.push(function () {
    denakop.setPageConfig(
      { 
        lazyLoad: <ENABLE_LAZY_LOAD>,
        targetings: <CUSTOM_PAGE_TARGETING>,
        networkCode: <NETWORK_CODE>
      }
    );
  });
</script>

Onde

Exemplo Configurações Globais

<script>
  denakop.cmd.push(function () {
    denakop.setPageConfig(
      { 
        lazyLoad: true,
        targetings: { teste: "123" },
        networkCode: "21715141650" 
      }
    );
  });
</script>