Onclick Conversion Tag¶
Overview¶
If your mobile site has click-to-call button you may want to track the click on it as a conversion. To do this, you can implement a conversion tag that fires on an onclick event using JavaScript.
In this tutorial, we will show you 2 options.
OPTION 1: Bind a JavaScript function to theHTML onclick event attribute. -recommended if your website doesn't have jQuery.
OPTION 2: Bind a click event to the button element using .click() - recommended if your website has jQuery.
OPTION 1 -Without jQuery: Bind JavaScript function to HTML onclick event attribute¶
1 ■Use Math.random() function to generate transaction id■
'Transaction ID': Math.floor(Math.random()*99999999999),
2 ■Implement a function named clickoutconv■
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
var criteo_sitetype = /iPad/.test(navigator.userAgent)?"t":/Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent)?"m":"d";
function clickoutconv(vId,vPrice,vQuantity)
{
window.criteo_q = window.criteo_q || [];
criteo_q.push(
{ event: "setAccount", account: {{accountid}} },
{ event: "setSiteType", type: criteo_sitetype },
{ event: "trackTransaction", id: Math.floor(Math.random()*99999999999),
item: [{ id: vId, price: vPrice, quantity: vQuantity }]});
}
</script>
3 ■Bind onclick attribute to the HTML element■
<a href="http://" onclick="clickoutconv('productid1',1,1);return false;">Click to call</a>
■Assign product id, price and quantity in parameters of the function clickoutconv ■
【Required dynamic values】
clickoutconv('#PRODUCT ID#',#PRICE#,#QUANTITY#)
【Example】※Set 1 as integer to price and quantity if they cannot be dynamically assigned.
clickoutconv('productid1',1,1)
■You can see demo■
1, Hit "Click To Call" button.
2, In the network tab criteo widget call appears which confirms that the onclick conversion tag is correctly implemented.
OPTION 2- With jQuery: Send click event to the button element by using .click().¶
1 ■Use Math.random() function to generate transaction id■
'Transaction ID': Math.floor(Math.random()*99999999999),
2 ■Assign dynamic value to variables starting with "v_" prefix■
【Required dynamic values】
var v_pid ="#PRODUCT ID#";
var v_price = #PRICE#;
var v_quantity = #QUANTITY#;
【Example】※Set 1 as integer to price and quantity if they cannot be dynamically assigned.
var v_pid ="productid1";
var v_price = 1;
var v_quantity = 1;
3 ■Implement the tag■
<input type="button" width="270" height="60" name="submit" value="Click To Call" style="border:none;">
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
$(document).ready(function() {
var crto_itemArray = [];
var crto_sitetype= /iPad/.test(navigator.userAgent)?"t":/Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent)?"m":"d";
var v_button =$("input[value='Click To Call']");
var v_pid ="productid1";
var v_price = 1;
var v_quantity = 1;
crto_itemArray.push({id:v_pid, price: v_price, quantity: v_quantity });
v_button.click(function(){
window.criteo_q = window.criteo_q || [];
window.criteo_q.push(
{ event: "setAccount", account: {{accountid}} },
{ event: "setSiteType", type: crto_sitetype },
{ event: "trackTransaction", id: Math.floor(Math.random()*99999999999),
item: crto_itemArray }
);
});
});
</script>
■You can see demo■
1, Hit "Click To Call" button.
2, In the network tab criteo widget call appears which confirms that the onclick conversion tag is correctly implemented.