Creating a click conversion using the Advanced Editor

A click conversion counts the number of times a specific html element is clicked E.g. text link, button.

 

Adding a Click Conversion using custom code in the post-rendering script:

During the test set up process, you can add Click conversion goals at step 2 “Test Details by adding custom code to the post-rendering script.

Click “Edit”  within the ‘Post-Rendering Script’ section.

In order to track using JavaScript the platform has the function WT.click. Note syntax, case and that a colon is required after each.

WT.click({testAlias: value1,conversionPoint: value2,cookieInspection: “value3”,beacon:value4,data: value5});

Parameters

  • testAlias: The Test Alias is automatically generated when you create a new test and can be found in the ‘Project Details’ section.
    • Replace value1 with your Test Alias name.
  • conversionPoint:
    • This defines the label that will be given to the specific conversion point. Avoid using spaces, apostrophes or special characters where possible.
    • Replace value2 with a meaningful conversion name (E.g. Click_Button)
  • cookieInspection: Defines if the cookie is inspected before the conversion is sent.
    • Replace value3 with “False” or “True”
  • Beacon: Defines if Beacon mode is required.
    • Replace value4 with “False” (default) or “True”
  • Data: This function defines if custom data is required to be collected as the event is fired.
    • Replace value5 with data if no additional data collection is required.

Example in JS

document.getElementById(“YOUR_ID”).addEventListener(“click”, function(){

WT.click({testAlias: “TA_Mytest”,conversionPoint: “Click_BuyNow”,cookieInspection: false,beacon: false

})

Example using Jquery.

$(“body”).on(“click”, “.YOUR_CLASS“, function(){

WT.click({testAlias: “TA_Mytest”,conversionPoint: “Click_BuyNow”,cookieInspection: false, beacon: false});

});

Tips and troubleshooting

 

You may need to check that Jquery has loaded and the element available before click is executed. Wrapping the function into a routine that polls for the class (.classname) or an id (#idname). will avoid this occurrence.

intvl = setInterval(funciton(){

if(typeof window.jQuery === ‘function’ &&

window.jQuery(‘.YOUR_CLASS|#YOUR_ID‘).length) {

clearInterval(intvl);

}

}, 500);

On click conversions that take the visitor to new page in the same window, the event may be fired as the visitor is being redirected to another page. This can result in an event not being passed. Adding a small delay to the click event will avoid this being a possibility.

For mobile and touch devices, on.touch rather than on.click for the event trigger will in many cases be more robust.