Como integrar a ExoClick com AgeGO

Este guia tem como objetivo explicar:

• Como enviar um site para a AgeGO.
• Como passar parâmetros de verificação de idade para a ExoClick e bloquear anúncios nas zonas de anúncios.
• Como integrar as zonas de anúncios da AgeGO e da ExoClick em conjunto para mostrar anúncios SFW aos utilizadores antes de eles verificarem a sua idade.

Como enviar um site para a AgeGO

Para enviar um site para a AgeGO, faça login no painel da AgeGO. Depois, vá para “Meus Sites” e clique em “Novo Site”:

ExoClick AgeGO 1

Nestas definições, precisa de pelo menos adicionar o Nome e o Domínio de Nível Superior. Depois de concluir estas definições, clique em “Criar”. O site será adicionado à sua conta.

Por predefinição, todos os sites têm o estado “Pronto” quando são criados. No entanto, isso não significa que o seu site já possa usar a AgeGO. Para ativar a AgeGO no seu site, precisa de contactar a AgeGO através do formulário de contacto e fornecer o ID do Site correspondente ao seu site.

Pode encontrar o ID do Site junto ao nome do seu site:

ExoClick AgeGO 2

Depois de o seu site ser aprovado, o estado passará para “Em execução” e poderá seguir as instruções de integração para integrar a AgeGO no seu site. Esta solução oferece atualmente dois métodos, Modal (simples ou avançado) e S2S, e as instruções de configuração de cada método estão disponíveis no painel da AgeGO. Para os fins deste guia, vamos falar sobre o Modal método.

Como passar o estado de verificação de idade e exibir anúncios SFW

Ao usar um sistema de verificação de idade (AgeGO ou outro fornecedor), pode querer continuar a exibir anúncios para quaisquer utilizadores (os que não verificaram a sua idade e os que verificaram).

Para identificar um utilizador como tendo (ou não tendo) concluído a verificação de idade, use o data-ex_av parâmetro nas suas zonas de anúncios. Este parâmetro permite 3 valores:

• "0": Sem Verificação de Idade (Indefinido)
• "1": Verificação de Idade - Verificado
• "2": Verificação de Idade - Não verificado

Depois, para bloquear anúncios para certos utilizadores (neste contexto, os que não verificaram a sua idade), use o data-block-ad-types parâmetro. Este parâmetro permite vários valores, mas, para este guia, vamos usar apenas o valor 101.

Portanto, se quiser exibir um anúncio SFW e quiser identificar esse utilizador como alguém que ainda não verificou a sua idade, integrará os parâmetros assim:

• Formatos de anúncios assíncronos (banner, FPI, multi-formatos, etc.):

<script async type="application/javascript" src="https://a.magsrv.com/ad-provider.js"></script> 
 <ins class="eas6a97888e2" data-zoneid="XXXXXXXX" data-ex_av="2"  data-block-ad-types="101"></ins> 
 <script>(AdProvider = window.AdProvider || []).push({"serve": {}});</script>

• In-Stream: https://s.magsrv.com/v1/vast.php?idzone=XXXXXX&ex_av=2&block_ad_types=101
• Popunder (link): https://s.pemsrv.com/v1/link.php?cat=&idzone=XXXXX&type=8&ex_av=2&block_ad_types=101
• Link Direto: https://s.zlinkt.com/v1/d.php?z=XXXXXXX&ex_av=2&blocked_ad_types=101

Nota: Tem de usar ambos data-ex_av e data-block-ad-types ao exibir anúncios SFW; caso contrário, o utilizador não será identificado corretamente e os anúncios não serão bloqueados.

E se quiser exibir todos os tipos de anúncios a um utilizador verificado, vai fazê-lo assim:

• Formatos de anúncios assíncronos (banner, FPI, multi-formatos, etc.):

<script async type="application/javascript" src="https://a.magsrv.com/ad-provider.js"></script> 
<ins class="eas6a97888e2" data-zoneid="XXXXXXX" data-ex_av="1"></ins> 
<script>(AdProvider = window.AdProvider || []).push({"serve": {}});</script>

• In-Stream: https://s.magsrv.com/v1/vast.php?idzone=XXXXXXXX&ex_av=1
• Popunder (link): https://s.pemsrv.com/v1/link.php?cat=&idzone=XXXXXXX&type=8&ex_av=1
• Link Direto: https://s.zlinkt.com/v1/d.php?z=XXXXXXX&ex_av=

Como criar uma experiência SFW

O tutorial seguinte explica como criar uma “experiência SFW”, ou seja, como garantir que apenas anúncios SFW sejam exibidos quando o utilizador ainda não tiver verificado a sua idade. Note que este método é apenas uma recomendação e pode alterar a configuração se precisar de seguir um fluxo de utilizador diferente.

Para esta configuração, vamos precisar de criar um ficheiro de script separado. Neste exemplo, chamámo-lo main.js:

function getCookie(name) {
  const value = `${document.cookie};`;
  const parts = value.split(`${name}=`);
  if (parts.length !== 2) return false;
  const token = parts.pop().split(";").shift();
  const format = token.split(".");
  if (format.length !== 3) return false;
  try {
    format.slice(0, 2).forEach(part => {
      const padded = part + "=".repeat((4 - part.length % 4) % 4);
      atob(padded.replace(/-/g, "+").replace(/_/g, "/"));
    });
    return true; 
  } catch (e) {
    return false; 
  }
}

function verifier(event, container) {
    window.AGEGO = window.AGEGO || function () {
	(AGEGO.e = AGEGO.e || []).push(arguments)
	};
     AGEGO('configure', {
	siteId: XXXXXXX, // ID do site no AgeGO
	autoBlur: true,
	verifyMode: 'inline', 
	requireAgeVerification: true, 
	allowDirectContinue: false, 
	overlay: {
		logo: 'wlogo.png', // Logotipo do seu site
		theme: 'auto'
		},
	events: {
		onVerificationFlowEnd() {
			console.log("Verificação bem-sucedida");
			window.location.reload();
			},
            	onVerificationFlowFailed() {
			console.log("Verificação falhou com o código de erro:" + error);
			},
            	onAgeVerify() {
			console.log("Iniciar processo de verificação de idade");
			},
            	onDirectContinue() {
			console.log("Ação DirectContinue");
			},
            	onUnderageSkip() {
			console.log("Ignorado");
			},
            	onVerifiedBefore() {
			console.log("Verificado anteriormente");
			}
		}
	       }
	);

            var n = document.createEvent("Event");
            n.initEvent("DOMContentLoaded", !0, !0),
            document.dispatchEvent(n);
}

const TARGET_SELECTOR = '.main, .footer; // substitua pelas classes onde o clique será interceptado

function intercept(e) {
   const container = e.target.closest(TARGET_SELECTOR);
   if (!container) return; 
        
   e.preventDefault();
   e.stopImmediatePropagation(); 
   e.stopPropagation();

   verifier(e, container);
}

Este ficheiro contém três funções: uma função para detetar cookies, uma função para carregar a sobreposição da AgeGO e uma função para detetar o clique em classes específicas. Neste caso, estamos a usar as classes .main e .footer.

Depois, no HTML do seu site, colocará o seguinte:

<!--Código da AgeGO-->
<script src="https://verifycdn.agego.com/v1/verify.js"></script>

<!-- Código com funções personalizadas-->
<script src="main.js"></script>

<!-- Código do fornecedor de anúncios-->
<script async type="application/javascript" src="https://a.magsrv.com/ad-provider.js"></script>

<!-- Zonas de anúncios. XXXX e YYYYY correspondem à classe e aos IDs de zona fornecidos pelo Painel de Administração. -->
<div id="videontv">
  <ins class="XXXXXX" data-zoneid="YYYYYY" data-block-ad-types="101"  data-ex_av="2"></ins> 
  <ins class="XXXXXX" data-zoneid="YYYYYY" data-block-ad-types="101"  data-ex_av="2"></ins> 
</div>

<!-- Código para exibir anúncios com os parâmetros corretos-->
<script>
	const agegoValue = getCookie("agego_aver");
	if (agegoValue !== false)  {
               console.log("utilizador verificado");
        	   const adInsElements = document.querySelectorAll("ins");
        	   adInsElements.forEach(ins => {
            	ins.setAttribute("data-ex_av", "1");
            	ins.setAttribute("data-block-ad-types", "0");
        		});
    	   }
             else {
                 console.log("utilizador não verificado");
                 ['pointerdown', 'click', 'touchstart'].forEach(type => {
                 document.addEventListener(type, intercept, { capture: true });
                 });
             }
	(AdProvider = window.AdProvider || []).push({"serve": {}});
</script>

Neste exemplo, os anúncios são SFW por predefinição até o utilizador verificar a sua idade. Quando o utilizador clica nas classes selecionadas que mencionámos anteriormente, a sobreposição da AgeGO aparecerá. Depois de o utilizador verificar a sua idade, a página será carregada normalmente e, desta vez, não bloqueará nenhum anúncio.

---

Algumas notas sobre este tutorial:

1. Esta configuração baseia-se no agego_aver cookie definido pela AgeGO. No entanto, isto pode ser alterado: pode definir um valor em localStorage usando os eventos do script da AgeGO e depois decidir que anúncios mostrar com base nesse valor.
2. Ambos os métodos focam-se apenas na exibição de anúncios. As miniaturas de vídeo e outros conteúdos do site não são tidos em conta neste código.
3. Atualmente, a AgeGO não tem deteção de país integrada. Precisa de decidir quando quer mostrar este código.

---

Se quiser configurar o data-ex_av e data-block-ad-types com base em diferentes eventos à sua escolha, então considere consultar os nossos outros tutoriais: bloquear dinamicamente tipos de anúncios, bloquear dinamicamente tipos de anúncios em zonas de anúncios in-stream.

Por fim, para uma integração de zona de anúncios mais genérica com uma solução de verificação de idade, consulte este outro tutorial.