Pixel
Standard Talent.com pixel implementation
What is the Talent.com tracking pixel? A tracking pixel is an HTML code snippet which is triggered when a user visits or opens a page. It is useful for tracking user behaviour and conversions. The pixel should be placed on the final page of your application process. For example, a “Thank you for applying” page once the user has submitted their application.
Installation of the Talent.com tracking pixel
Pixel should be set up by someone from the IT Department and should take about 30 minutes.
The pixel is installed by placing an HTML snippet within the body section of the page where the pixel is being placed:
<img src="https://www.talent.com/tracker/img-pixel.php?tracker=xxx">**The tracker= parameter will be provided by the account management team**
Additional features
Optional multi-step parameter:
- Allows the pixel to be placed on additional pages. This can help track users throughout your application process. We refer to this as a multi-step pixel.
- Please reach out to your account management team for more information on setting up a multi-step pixel.
Implementation of the Talent.com pixel using JavaScript
The following code snippet is meant to serve as an example of how to implement a Talent.com pixel tracker using JavaScript. Considering the intricacies of your code base, the snippet might have un-intended consequences.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Implementation of the Talent.com pixel using JavaScript</title>
</head>
<body>
<!--This is how to make a pixel get triggered via an onclick button via JS. You need to add the onClick="" function in your HTML code.
This demo uses a stand-alone button, but we encourage you to integrate the function into your existing HTML. -->
<!-- If you do not provide an applyStep function parameter, it will default to application -->
<button onclick="triggerTalentPixelSync()">Trigger</button>
<!-- You can however, manually pass in different applySteps at different points in the application process-->
<button onclick="triggerTalentPixelSync('apply_start')">Track Application Start</button>
<button onclick="triggerTalentPixelSync('apply_submit')">Track Application Submit</button>
<script>
/**
* Synchronously create an image element and append it to the body of your page
* once the element is appended to your page, the request will trigger the pixel
* @param applyStep optional parameter to trigger pixel at different stages of the application process
*/
function triggerTalentPixelSync(applyStep = "application") {
// the pixel will be wrapped inside of a paragraph element
let talentPixelWrapper = document.createElement("p");
// the pixel itself is just an image element
let talentPixel = document.createElement("IMG");
// the URL provided by your talent account representative
// ensure that the URL contains the GET parameter "tracker" with your company name/alias
let providedURL = "https://www.talent.com/tracker/img-pixel.php?tracker=COMPANY_TRACKER";
// the final pixel url should also contain some indication of the applicationStep
let pixelURL = providedURL + "&apply_step=" + applyStep;
// set the target link
talentPixel.setAttribute("src", pixelURL);
// append the image element to the paragraph element
talentPixelWrapper.appendChild(talentPixel);
// append the pixel either to the body element of your page or another element
document.body.appendChild(talentPixelWrapper);
}
</script>
</body>
</html>