É possível usar um manipulador de eventos JavaScript para iniciar uma chamada ao Floodlight quando os usuários realizarem alguma ação, como um clique, o download de um PDF, a seleção de um item de menu ou o envio de um formulário.
O método descrito abaixo exige que o navegador do usuário tenha o JavaScript ativado. Se o JavaScript estiver desativado, a chamada do Floodlight não será realizada.
Visão geral
A premissa básica desse método é criar dinamicamente uma tag iframe ou de imagem (no caso de tags de imagem do Floodlight) usando JavaScript e com todos os parâmetros obrigatórios, tais como variáveis personalizadas, variáveis relacionadas a vendas e inibidores de cache.
Como os parâmetros usados para definir a atividade de Floodlight (type e cat) também estão presentes no URL, também é possível usar esse método para chamar dinamicamente diferentes atividades de Floodlight da mesma página. Isso é útil para páginas baseadas em AJAX.
As funções descritas abaixo podem ser chamadas usando uma função onclick() ou onsubmit() dentro do corpo do arquivo HTML. Para eventos onclick que redirecionam para uma página de destino ou para o download de um arquivo, é necessário usar o atributo target="_blank". Caso contrário, o redirecionamento para a mesma guia do navegador impedirá a tag de disparar corretamente.
Encontre mais exemplos similares de código de trabalho implementado nesta página de demonstração (o administrador do site pode ver o código-fonte). https://storage.googleapis.com/dcm-floodlight/Floodlight_on_Click_EXAMPLE.html
Recomendamos que você implemente as declarações de função JavaScript na seção <head> da página da Web.
O exemplo a seguir usa uma variável personalizada, u1.
<script type="text/javascript" id="DoubleClickFloodlightTag">
//<![CDATA[
function FLOOD1(type, cat, u1) {
var axel = Math.random()+"";
var a = axel * 10000000000000000;
var flDiv=document.body.appendChild(document.createElement("div"));
flDiv.setAttribute("id","DCLK_FLDiv1");
flDiv.style.position="absolute";
flDiv.style.top="0";
flDiv.style.left="0";
flDiv.style.width="1px";
flDiv.style.height="1px";
flDiv.style.display="none";
flDiv.innerHTML='<iframe id="DCLK_FLIframe1" src="http://12345678.fls.doubleclick.net/activityi;src=12345678;type=' + type + ';cat=' + cat + ';u1=' + u1 + ';ord=' + a + '?" width="1" height="1" frameborder="0"><\/iframe>';
}
//]]>
</script>
</head>
<body>
<!-- Este é um exemplo de uma chamada "onclick" em uma tag âncora -->
<a href="http://address_of_page_to_load_or_file_to_download" onclick="FLOOD1('testtype', 'testcat', 'testu1');" target="_blank">Clique aqui para testar a tag</a>
</body>
Usar uma tag de imagem impedirá que as tags padrão e do editor sejam acionadas.
<script type="text/javascript" id="DoubleClickFloodlightTag">
//<![CDATA[
function FLOOD2(type, cat, u1) {
var axel = Math.random()+"";
var a = axel * 10000000000000000;
var spotpix = new Image();
spotpix.src="http://ad.doubleclick.net/activity;src=12345678;type=" + type + ";cat=" + cat + ";u1=" + u1 + ";ord=" + a + "?";
}
//]]>
</script>
</head>
<body>
<!-- Este é um exemplo de uma chamada "onclick" em uma tag âncora -->
<a href="http://address_of_page_to_load_or_file_to_download" onclick="FLOOD2('testtype', 'testcat', 'testu1');" target="_blank">Clique aqui para testar a tag</a>
</body>
Nesse caso, a chamada de uma função com o valor 1 (ou um valor genérico) para isUnique chamará a tag como um tipo de contador 24 horas de usuários únicos, enquanto passar um valor de zero ou omitir o valor chamará a tag como um tipo de contador padrão.
<script type="text/javascript" id="DoubleClickFloodlightTag">
//<![CDATA[
function FLOOD3(type, cat, isUnique) {
var axel = Math.random()+"";
var a = axel * 10000000000000000;
var flDiv=document.body.appendChild(document.createElement("div"));
var cachebust = (isUnique)?';ord=1;num=':';ord=';
flDiv.setAttribute("id","DCLK_FLDiv1");
flDiv.style.position="absolute";
flDiv.style.top="0";
flDiv.style.left="0";
flDiv.style.width="1px";
flDiv.style.height="1px";
flDiv.style.display="none";
flDiv.innerHTML='<iframe id="DCLK_FLIframe1" src="http://12345678.fls.doubleclick.net/activityi;src=12345678;type=' + type + ';cat=' + cat + cachebust + a + '?" width="1" height="1" frameborder="0"><\/iframe>';
}
//]]>
</script>
</head>
<body>
<!-- Este é um exemplo de uma chamada "onclick" em uma tag âncora -->
<a href="http://address_of_page_to_load_or_file_to_download" onclick="FLOOD3('testtype', 'testcat', 1);" target="_blank">Clique aqui para testar a tag</a>
</body>
Use o código a seguir para criar tags especificando os parâmetros qty (contagem de atividade), cost e ord, além de uma variável personalizada, u1.
<script type="text/javascript" id="DoubleClickFloodlightTag">
//<![CDATA[
function FLOOD4(qty, cost, u1, ord) {
var flDiv=document.body.appendChild(document.createElement("div"));
flDiv.setAttribute("id","DCLK_FLDiv1");
flDiv.style.position="absolute";
flDiv.style.top="0";
flDiv.style.left="0";
flDiv.style.width="1px";
flDiv.style.height="1px";
flDiv.style.display="none";
flDiv.innerHTML='<iframe id="DCLK_FLIframe1" src="http://12345678.fls.doubleclick.net/activityi;src=12345678;type=123;cat=456;qty=' + qty + ';cost=' + cost + ';u1=' + u1 + ';ord='+ ord + '?" width="1" height="1" frameborder="0"><\/iframe>';
}
//]]>
</script>
</head>
<body>
<!-- Este é um exemplo de uma chamada "onclick" para uma tag âncora -->
<a href="http://address_of_page_to_load_or_file_to_download" onclick="FLOOD4(2, 100.34, 'testu1', 'testorderid');" target="_blank">Clique aqui para testar a tag</a>
</body>
