Cette fonctionnalité fait partie d'une version bêta ouverte et peut donc encore changer.
Ces instructions s'adressent aux administrateurs et aux éditeurs qui souhaitent savoir comment configurer l'extrait de code pour la collecte des données fournies par les utilisateurs sur leur site Web à l'aide de Google Tag Manager.
Par rapport aux autres options de configuration, mettre à jour votre code permet de s'assurer que les adresses e-mail, les numéros de téléphone et/ou les noms et adresses sont disponibles sur la page lorsque Analytics collecte les données fournies par les utilisateurs.
Présentation
Pour configurer l'extrait de code à l'aide de Google Tag Manager, procédez comme suit :
- Identifiez et définissez les champs de données fournies par l'utilisateur dans le code de votre site Web.
- Transmettez à Google Analytics chacun des champs de données fournies par l'utilisateur dans une variable JavaScript personnalisée.
Remarque : Vous pouvez envoyer des données client hachées ou non à Google Analytics. Lorsque vous envoyez des données non hachées, Google les hache pour vous avant de les stocker sur ses serveurs. Vous pouvez aussi hacher les données de votre côté avant de les envoyer à Google.
Avant de commencer
Ces instructions supposent que vous respectez les conditions suivantes :
- Vous avez accès au code source de votre site Web.
- Vous avez activé la collecte et autorisé l'utilisation des données fournies par les utilisateurs.
- Vous avez configuré une balise "Google Analytics : Événement GA4" dans votre conteneur Google Tag Manager.
- Vous disposez du rôle Administrateur pour la propriété Google Analytics.
Hashing the data
You can send hashed or unhashed data from a website. If you send unhashed data, Google normalizes and hashes the data before the data reaches Google's servers. To ensure Analytics interprets the data correctly and to comply with the User-provided data policy, you must use the correct key name (in the next section).
To hash the data:
- Use hex SHA256.
To normalize the data:
- Remove leading or trailing whitespaces.
- Convert the text to lowercase.
- Format phone numbers according to the E.164 standard.
Defining the fields in your code
You must provide at least one of these fields:
- Email (preferred).
- Address (first name, last name, postal code, and country are required). You can optionally provide street address, city, and region as additional match keys.
- A phone number can also be provided along with an email or full name and address.
Make sure the data is available when the Google tag fires. If the data is collected on a previous page, make sure it’s available in your code on the current page so you can configure the field.
Fields to set
The following table describes each field you can set. The key name shows how you must reference the field in your code. You must pass the data as a String type. When defining name and address, make sure to define each component as an individual variable (for example, first name, last name, and so on).
Note: If you want to send unhashed data and let Google normalize and hash the data, use the first key name for each data field. For example, email in the Email address data field below. If you want to send hashed data, use the key name that begins with sha256_.
| Data Field | Key Name | Description |
|---|---|---|
| Email address | email |
User email. Example: ‘[email protected]’ |
sha256_email_address |
Hashed user email. Example: ‘a8af8341993604f29cd4e0e5a5a4b5d48c575436c38b28abbfd7d481f345d5db’ |
|
| Phone number | phone_number |
User phone number. Must be in E.164 format, which means it must be 11 to 15 digits including a plus sign (+) prefix and country code with no dashes, parentheses, or spaces. Example: ‘+11231234567’ |
sha256_phone_number |
Hashed user phone number. Example: ‘e9d3eef677f9a3b19820f92696be53d646ac4cea500e5f8fd08b00bc6ac773b1’ |
|
| First name | address.first_name |
User first name. Example: 'John' |
address.sha256_first_name |
Hashed user first name. Example: ‘96d9632f363564cc3032521409cf22a852f2032eec099ed5967c0d000cec607a’ |
|
| Surname | address.last_name |
User last name. Example: 'Doe' |
address.sha256_last_name |
Hashed user last name. Example: ‘799ef92a11af918e3fb741df42934f3b568ed2d93ac1df74f1b8d41a27932a6f’ |
|
| Street address | address.street |
User street address. Example: '123 New Rd' |
| City | address.city |
User city name. Example: `Southampton’ |
| Region | address.region |
User province, state, or region. Example: `Hampshire’ |
| Postal code | address.postal_code |
User post code. Example: 'SO99 9XX' |
| Country | address.country |
User country code. Example: 'UK'. Use 2-letter country codes, per the ISO 3166-1 alpha-2 standard. |
Mettre à jour la balise d'événement avec une variable JavaScript personnalisée
Avant de mettre à jour votre conteneur Tag Manager, découvrez comment mettre à jour le code JavaScript personnalisé que vous allez ajouter à votre conteneur.
- Connectez-vous à Google Tag Manager.
- Dans l'onglet Espace de travail, cliquez sur Balises à gauche.
- Ouvrez la balise Google Analytics : Événement GA4 que vous utilisez pour collecter les données client. Assurez-vous que la balise d'événement utilise l'ID de mesure du flux Web où les données utilisateur sont collectées.
- Cliquez sur Inclure les données fournies par l'utilisateur depuis votre site Web.
- Dans le menu déroulant Données utilisateur, sélectionnez ou créez une variable "Données fournies par l'utilisateur".
- Si vous créez une variable, sélectionnez Code dans la variable "Données fournies par l'utilisateur".
- Dans le menu déroulant Source de données, cliquez sur Nouvelle variable.
- Cliquez sur Configuration de la variable > JavaScript personnalisé.
- Attribuez un nom à la variable JavaScript personnalisée en haut de la page.
- Dans la zone de texte JavaScript personnalisé, saisissez l'extrait de code. En savoir plus
- Enregistrez les nouvelles variables, puis la balise d'événement.
- En haut à droite, cliquez sur Envoyer pour publier les modifications.
Créer l'extrait de code pour collecter les données fournies par les utilisateurs
Vous pouvez utiliser le code suivant lorsque vous configurez la variable JavaScript personnalisée à l'étape 10 :
function () {
return {
"email": votreVariableAdresseE-mail , // remplacez "votreVariableAdresseE-mail" par le nom de la variable qui reflète l'adresse e-mail de l'utilisateur
"phone_number": votreVariableNuméroDeTéléphone, // procédez de la même manière pour "votreVariableNuméroDeTéléphone" et les noms de variables ci-dessous
"address": {
"first_name": votreVariablePrénom,
"last_name": votreVariableNom,
"street": votreVariableAdressePostale,
"city": votreVariableVille,
"region": votreVariableRégion,
"postal_code": votreVariableCodePostal,
"country": votreVariablePays
}
}
}
Vous pouvez également coder le champ en dur avec une chaîne ou utiliser une fonction au lieu de variables.
// Implement
<script>
gtag('set', 'user_data', {"sha256_email_address": votreVariableAdresseE-mailNormaliséeEtHachée,"sha256_phone_number": votreVariableNuméroDeTéléphoneNormaliséeEtHachée,"address": {"address.sha256_first_name": votreVariablePrénomNormaliséeEtHachée,"address.sha256_last_name": votreVariableNomNormaliséeEtHachée,"city": votreVariableVille,"region": votreVariableRégion,"postal_code": votreVariableCodePostal,"country": votreVariablePays}
});
</script>Si vous souhaitez fournir des valeurs de données utilisateur hachées, vous pouvez utiliser l'extrait suivant :
async function processUserData() {
const userData = {'sha256_email_address': await adresseE-mailHachée(adresseE-mail.trim()),'sha256_phone_number': await numéroDeTéléphoneHaché(numéroDeTéléphone),'address': {'address.sha256_first_name': await prénomHaché(prénom),'address.sha256_last_name': await nomHaché(nom),'city': ville,'region': région,'postal_code': codePostal,'country': pays,},
};
return userData;Le numéro de téléphone doit utiliser le format E.164, c'est-à-dire comporter entre 11 et 15 chiffres précédés du signe plus (+) et du code pays, sans tirets, crochets, ni espaces.
Next steps
Validate that user-provided data collection is set up correctly. Show me how.