Submitting First Party Data

Submitting First Party Data from a web page

Overview

To enrich user data, you can submit First Party Data to Taboola, for a given visitor.

Taboola currently supports the ability to pass:

  • A hashed Email ID
  • Demographic Data (requires user consent)
๐Ÿšง

If age < 18, do not submit any First Party Data to Taboola. Otherwise, hash all Email IDs and pass user consent for demographic data - otherwise Taboola will not use it.

Taboola Pixel using JavaScript

If you implemented Taboola Pixel via JavaScript, you can add the supported fields to your existing page_view event:

window._tfa.push({
    notify: "event",
    name: "page_view",
    id: 12345,
    unified_id: '973dfe463ec85...13b',
    demo: '{"g": "f", "a": "18"}'
})
๐Ÿ“˜

For an overview of Taboola pixel, see: Taboola pixel

For more information about Taboola pixel via JavaScript, see: Add the base pixel manually

Taboola Pixel using GTM (Google Tag Manager)

If you implemented Taboola Pixel via GTM, you can use GTM to pass the user data. Complete the steps below in order.

Create a custom variable

This section should be completed before editing the Taboola Pixel tag (next section).

  1. Open Tag Manager, and select the relevant container (and workspace).
  2. In the sidebar (left), select Variables.
  3. Under User-Defined Variables, click on New (far right).
  4. Rename the variable to something descriptive, e.g. hashed_email.
  5. Choose a variable type - e.g. Data Layer Variable - and fill in the name of the variable that will hold the current user's lowercase, hashed email.
๐Ÿ“˜

Setting up the above variable (so that it contains the needed value) typically requires custom development.

  1. Click on Save (top, right).

Edit the Taboola Pixel tag

Before you start, make sure that your team has created a custom variable (previous section).

  1. Open Tag Manager, and select the relevant container (and workspace).
  2. In the sidebar (left), select Tags.
  3. Click on an existing Taboola tag - e.g. your Taboola Base Pixel tag.

    You may have given the tag a different name. Confirm that it has a Tag Type of Taboola Pixel, and that it gets fired for each page view.

  4. In the Tag Configuration pane:
    • Expand the Advanced Settings section.
    • Under Custom Parameters, select Other Parameters.
    • Click on Add Row.
    • Under Parameter name, enter: unified_id
    • Under Parameter value, enter the variable name you prepared above, wrapped in double curly braces - e.g. {{hashed_email}}
๐Ÿšง

Enter the parameter name exactly as shown (unified_id). Enter the variable name exactly as you defined it under the Variables tab.

  1. (Optional) To pass demographic data, add another row:
    • Parameter name: demo
    • Parameter value: {{demo_data}} (or the name of your GTM variable containing the JSON string, e.g. {"g": "f", "a": "18"})
  2. Click on Save (top, right).
๐Ÿ“˜

Useful links

Hashing with SHA256

For legal and privacy reasons, all Email IDs must be converted to lowercase and hashed via SHA256. The sample code snippets below illustrate.

Sample code snippets

Code Sample 1 - Convert to lower case and hash (Client-side JavaScript):

<html>
<head>
    <title>SHA-256 Hash Example</title>
</head>
<body>
    <input type="text" id="input" placeholder="Enter text to hash">
    <button onclick="hashInput()">Hash</button>
    <p>Hashed Output: <span id="output"></span></p>

    <script>
        async function hashString(message) {
            const encoder = new TextEncoder();
            const data = encoder.encode(message.toLowerCase());
            const hashBuffer = await crypto.subtle.digest('SHA-256', data);
            const hashArray = Array.from(new Uint8Array(hashBuffer));
            const hashHex = hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
            return hashHex;
        }

        // Call the function when the button is clicked
        async function hashInput() {
            const input = document.getElementById('input').value;
            const output = await hashString(input);
            document.getElementById('output').textContent = output;
        }
    </script>
</body>
</html>

Code Sample 2 - Convert to lower case and hash (Server-side PHP):

<?php
// Function to hash an email address

/*
Sample input:
[email protected]

Sample output:
973dfe463ec85785f5f95af5ba3906eedb2d931c24e69824a89ea65dba4e813b
*/

function hashEmail($email) {
    // Convert the email address to lowercase
    $emailLower = strtolower($email);
    
    // Hash the lowercase email address using SHA-256
    $hashedEmail = hash('sha256', $emailLower);
    
    // Return the hashed email address
    return $hashedEmail;
}

// Example usage

$email = "[email protected]";
$hashedEmail = hashEmail($email);
echo "The hashed email address is: " . $hashedEmail;
?>

Verifying the output

  1. You can use an online service to verify that your script is producing the correct result. (Enter the email address in lowercase - the service performs hashing only.)
  2. Sample input: [email protected]
  3. Sample output: 973dfe463ec85785f5f95af5ba3906eedb2d931c24e69824a89ea65dba4e813b