บทความนี้มีไว้สําหรับนักพัฒนาซอฟต์แวร์ที่ดูแลรักษาโซลูชันการจัดการความยินยอมในเว็บไซต์ที่ใช้ Google Tag Manager (GTM)
หน้านี้จะแนะนำประเภทความยินยอมใน Google Tag Manager และแสดงวิธีผสานรวมประเภทดังกล่าวกับโซลูชันการจัดการความยินยอม
เหตุผลที่ควรใช้เทมเพลตแท็กเพื่อขอความยินยอม
เมื่อคุณให้เทมเพลตแท็ก ผู้ใช้จะผสานรวมโซลูชันความยินยอมของคุณได้โดยไม่ต้องเขียนโค้ด ซึ่งช่วยประหยัดเวลาและแรงงานได้อย่างมาก
ผู้ใช้สามารถตั้งค่าสถานะความยินยอมเริ่มต้นได้โดยใช้เทมเพลตโหมดความยินยอมและแจ้งตัวเลือกความยินยอมของผู้เข้าชมให้ Google Tag Manager ทราบ วิธีนี้ช่วยให้แท็กของ Google และบุคคลที่สามที่รองรับโหมดความยินยอมทํางานได้ดีที่สุด
ในฐานะผู้สร้างเทมเพลต คุณสามารถใช้เทมเพลตโหมดความยินยอมสําหรับการใช้งานภายใน หรือเผยแพร่ในแกลเลอรีเทมเพลตชุมชนเพื่อให้ใช้งานได้แบบสาธารณะ ผู้ให้บริการแพลตฟอร์มการจัดการความยินยอม (CMP) ที่มีเทมเพลตโหมดความยินยอมจะมีโอกาสได้ปรากฏในเอกสารประกอบเกี่ยวกับโหมดความยินยอม และมีฟีเจอร์เครื่องมือเลือกแกลเลอรีเทมเพลตไว้ในเทมเพลต
สถานะความยินยอมและประเภทความยินยอม
แท็ก Google และแท็กของบุคคลที่สามจะปรับลักษณะพื้นที่เก็บข้อมูลตามสถานะความยินยอมของ granted
หรือ denied
โดยผู้ใช้จะมีการตรวจสอบความยินยอมในตัวสำหรับประเภทความยินยอมประเภทใดก็ได้ต่อไปนี้
ประเภทความยินยอม | คำอธิบาย |
---|---|
ad_storage |
เปิดใช้พื้นที่เก็บข้อมูล เช่น คุกกี้ ที่เกี่ยวข้องกับการโฆษณา |
ad_user_data |
ตั้งค่าความยินยอมสำหรับการส่งข้อมูลผู้ใช้ไปยัง Google เพื่อวัตถุประสงค์ในการโฆษณาออนไลน์ |
ad_personalization |
ตั้งค่าความยินยอมสำหรับโฆษณาที่ปรับตามโปรไฟล์ของผู้ใช้ |
analytics_storage |
เปิดใช้พื้นที่เก็บข้อมูล เช่น คุกกี้ ที่เกี่ยวข้องกับการวิเคราะห์ (เช่น ระยะเวลาการเข้าชม) |
functionality_storage |
เปิดใช้พื้นที่เก็บข้อมูลที่รองรับฟังก์ชันการทํางานของเว็บไซต์หรือแอป เช่น การตั้งค่าภาษา |
personalization_storage |
เปิดใช้พื้นที่เก็บข้อมูลที่เกี่ยวข้องกับการปรับเปลี่ยนในแบบของคุณ เช่น วิดีโอแนะนำ |
security_storage |
เปิดใช้พื้นที่เก็บข้อมูลที่เกี่ยวข้องกับความปลอดภัย เช่น ฟังก์ชันการตรวจสอบสิทธิ์ การป้องกันการประพฤติมิชอบ และการปกป้องผู้ใช้ในรูปแบบอื่นๆ |
สร้างเทมเพลตความยินยอมใหม่
โหมดความยินยอมจะติดตามตัวเลือกความยินยอมของผู้เข้าชม และการตรวจสอบความยินยอมของแท็กเพื่อให้มั่นใจว่าพฤติกรรมของแท็กจะปรับให้เหมาะสม ทำตามแนวทางปฏิบัติแนะนำต่อไปนี้เมื่อสร้างเทมเพลตคำยินยอมใหม่
ใช้ API โหมดความยินยอมของ Tag Manager setDefaultConsentState และ updateConsentState แทน
gtag consent
ตั้งค่าสถานะความยินยอมเริ่มต้นทันทีที่เริ่มทํางานโดยใช้ทริกเกอร์การเริ่มต้นขอความยินยอม - ทุกหน้า
CMP ต้องแจ้งผู้เข้าชมให้อนุญาตหรือปฏิเสธความยินยอมสําหรับคํายินยอมทุกประเภทที่เกี่ยวข้องโดยเร็วที่สุด
เมื่อผู้เข้าชมระบุตัวเลือกความยินยอม CMP จะต้องผ่านสถานะความยินยอมที่อัปเดตแล้ว
1. สร้างเทมเพลตใหม่
วิธีการใช้งานนี้จะใช้ 1 ช่องในเทมเพลตเพื่อเก็บสถานะความยินยอมเริ่มต้น โค้ดการใช้งานจะอ่านช่องดังกล่าวเพื่อตั้งค่าสถานะความยินยอมเริ่มต้นขณะรันไทม์ สำหรับคำสั่งอัปเดต โค้ดจะพยายามอ่านคุกกี้ที่กำหนดโดยโซลูชันความยินยอมเพื่อเลือกตัวเลือกความยินยอมของผู้เข้าชมร้านค้า นอกจากนี้ คุณยังจะตั้งค่าโค้ดเรียกกลับสำหรับ
updateConsentState
เพื่อจัดการกรณีที่ผู้เข้าชมยังไม่ได้เลือกความยินยอมหรือตัดสินใจเปลี่ยนความยินยอมด้วย
วิธีสร้างเทมเพลตความยินยอม
- เข้าสู่ระบบบัญชี Google Tag Manager
- เลือกเทมเพลตที่การนำทางด้านซ้าย
- ในแผงเทมเพลตแท็ก ให้คลิกใหม่
วิธีตั้งค่าสถานะความยินยอมเริ่มต้น
- เลือกแท็บช่อง แล้วคลิกเพิ่มช่อง > ตารางพารามิเตอร์
- เปลี่ยนชื่อเป็น
defaultSettings
- ขยายช่อง
- อัปเดตชื่อที่แสดงเป็น
Default settings
- คลิกเพิ่มคอลัมน์ เลือกการป้อนข้อความ เปลี่ยนชื่อเป็น
region
และเลือกช่องกำหนดให้ค่าของคอลัมน์ไม่ซ้ำกัน - ขยายคอลัมน์และเปลี่ยนชื่อที่แสดงเป็น
Region (leave blank to have consent apply to all regions)
ข้อความในวงเล็บคือเอกสาร สำหรับผู้ใช้เทมเพลต ดูข้อมูลเพิ่มเติมเกี่ยวกับการตั้งค่าเริ่มต้นสำหรับความยินยอมสำหรับภูมิภาคต่างๆ - คลิกเพิ่มคอลัมน์ เลือกการป้อนข้อความ แล้วเปลี่ยนชื่อเป็น
granted
- ขยายคอลัมน์และเปลี่ยนชื่อที่แสดงเป็น
Granted Consent Types (comma separated)
- คลิกเพิ่มคอลัมน์ เลือกการป้อนข้อความ แล้วเปลี่ยนชื่อเป็น
denied
- ขยายคอลัมน์และเปลี่ยนชื่อที่แสดงเป็น
Denied Consent Types (comma separated)
ไม่บังคับ: วิธีเพิ่มการรองรับการปกปิดข้อมูลในบริบทโฆษณา
- คลิกเพิ่มช่อง เลือกช่องทำเครื่องหมาย แล้วเปลี่ยนชื่อช่องเป็น
ads_data_redaction
- อัปเดตชื่อที่แสดงเป็น
Redact Ads Data
ดูข้อมูลเพิ่มเติมเกี่ยวกับลักษณะการทำงานของคุกกี้ด้วยการปกปิดข้อมูลบางส่วนโฆษณา
ไม่บังคับ: หากต้องการเพิ่มการสนับสนุนสำหรับการส่งผ่านพารามิเตอร์ URL ให้ทำดังนี้
- คลิกเพิ่มช่อง เลือกช่องทำเครื่องหมาย แล้วเปลี่ยนชื่อช่องเป็น
url_passthrough
- อัปเดตชื่อที่แสดงเป็น
Pass through URL parameters
ดูข้อมูลเพิ่มเติมเกี่ยวกับการส่งผ่านพารามิเตอร์ของ URL
วิธีเพิ่มโค้ดการใช้งาน
- เปิดแท็บโค้ดในเครื่องมือแก้ไขเทมเพลต
- แก้ไขช่องตัวยึดตำแหน่งในตัวอย่างโค้ดด้านล่าง
- คัดลอกโค้ดและแทนที่โค้ดต้นแบบในเครื่องมือแก้ไขเทมเพลต
- บันทึกเทมเพลต
// The first two lines are optional, use if you want to enable logging
const log = require('logToConsole');
log('data =', data);
const setDefaultConsentState = require('setDefaultConsentState');
const updateConsentState = require('updateConsentState');
const getCookieValues = require('getCookieValues');
const callInWindow = require('callInWindow');
const gtagSet = require('gtagSet');
const COOKIE_NAME = 'Your_cookie_name';
/*
* Splits the input string using comma as a delimiter, returning an array of
* strings
*/
const splitInput = (input) => {
return input.split(',')
.map(entry => entry.trim())
.filter(entry => entry.length !== 0);
};
/*
* Processes a row of input from the default settings table, returning an object
* which can be passed as an argument to setDefaultConsentState
*/
const parseCommandData = (settings) => {
const regions = splitInput(settings['region']);
const granted = splitInput(settings['granted']);
const denied = splitInput(settings['denied']);
const commandData = {};
if (regions.length > 0) {
commandData.region = regions;
}
granted.forEach(entry => {
commandData[entry] = 'granted';
});
denied.forEach(entry => {
commandData[entry] = 'denied';
});
return commandData;
};
/*
* Called when consent changes. Assumes that consent object contains keys which
* directly correspond to Google consent types.
*/
const onUserConsent = (consent) => {
const consentModeStates = {
ad_storage: consent['adConsentGranted'] ? 'granted' : 'denied',
ad_user_data: consent['adUserDataConsentGranted'] ? 'granted' : 'denied',
ad_personalization: consent['adPersonalizationConsentGranted'] ? 'granted' : 'denied',
analytics_storage: consent['analyticsConsentGranted'] ? 'granted' : 'denied',
functionality_storage: consent['functionalityConsentGranted'] ? 'granted' : 'denied',
personalization_storage: consent['personalizationConsentGranted'] ? 'granted' : 'denied',
security_storage: consent['securityConsentGranted'] ? 'granted' : 'denied',
};
updateConsentState(consentModeStates);
};
/*
* Executes the default command, sets the developer ID, and sets up the consent
* update callback
*/
const main = (data) => {
/*
* Optional settings using gtagSet
*/
gtagSet('ads_data_redaction', data.ads_data_redaction);
gtagSet('url_passthrough', data.url_passthrough);
gtagSet('developer_id.your_developer_id', true);
// Set default consent state(s)
data.defaultSettings.forEach(settings => {
const defaultData = parseCommandData(settings);
// wait_for_update (ms) allows for time to receive visitor choices from the CMP
defaultData.wait_for_update = 500;
setDefaultConsentState(defaultData);
});
// Check if cookie is set and has values that correspond to Google consent
// types. If it does, run onUserConsent().
const settings = getCookieValues(COOKIE_NAME);
if (typeof settings !== 'undefined') {
onUserConsent(settings);
}
/**
* Add event listener to trigger update when consent changes
*
* References an external method on the window object which accepts a
* function as an argument. If you do not have such a method, you will need
* to create one before continuing. This method should add the function
* that is passed as an argument as a callback for an event emitted when
* the user updates their consent. The callback should be called with an
* object containing fields that correspond to the five built-in Google
* consent types.
*/
callInWindow('addConsentListenerExample', onUserConsent);
};
main(data);
data.gtmOnSuccess();
ถัดไป ให้กำหนดค่าสิทธิ์ในการเข้าถึงสถานะความยินยอมและการเข้าถึงคุกกี้
วิธีเพิ่มสิทธิ์ในการจัดการสถานะความยินยอม
- เลือกแท็บสิทธิ์ แล้วคลิกเข้าถึงสถานะความยินยอม
- คลิกเพิ่มประเภทความยินยอม
- คลิกช่องแล้วเลือก
ad_storage
จากเมนูแบบเลื่อนลง - เลือกเขียน
- คลิกเพิ่ม
- ทำซ้ำขั้นตอนที่ 2-5 สำหรับ
ad_user_data
,ad_personalization
และanalytics_storage
หากต้องการประเภทความยินยอมเพิ่มเติม ให้เพิ่มด้วยวิธีเดียวกัน - คลิกบันทึก
วิธีเพิ่มสิทธิ์ในการเข้าถึงคุกกี้
- เลือกแท็บสิทธิ์ แล้วคลิกอ่านค่าของคุกกี้
- ในส่วนเจาะจง ให้ป้อนชื่อของคุกกี้แต่ละรายการที่โค้ดต้องอ่านเพื่อระบุตัวเลือกความยินยอมของผู้ใช้ บรรทัดละ 1 ชื่อ
- คลิกบันทึก
2. สร้างการทดสอบ 1 หน่วย
ดูข้อมูลเกี่ยวกับการสร้างการทดสอบสำหรับเทมเพลตได้ที่การทดสอบ
3. ผสานรวมเทมเพลตกับโซลูชันการขอความยินยอม
โค้ดต่อไปนี้แสดงตัวอย่าง 1 ตัวอย่างวิธีผสานรวมเทมเพลตนี้กับโค้ดสำหรับโซลูชันการจัดการความยินยอมโดยการเพิ่ม Listener
// Array of callbacks to be executed when consent changes
const consentListeners = [];
/**
* Called from GTM template to set callback to be executed when user consent is provided.
* @param {function} Callback to execute on user consent
*/
window.addConsentListenerExample = (callback) => {
consentListeners.push(callback);
};
/**
* Called when user grants/denies consent.
* @param {Object} Object containing user consent settings.
*/
const onConsentChange = (consent) => {
consentListeners.forEach((callback) => {
callback(consent);
});
};
อัปเดตสถานะความยินยอม
หลังจากที่ผู้เข้าชมเว็บไซต์ระบุตัวเลือกความยินยอมแล้ว ซึ่งโดยทั่วไปจะทำผ่านการโต้ตอบกับแบนเนอร์แสดงความยินยอมให้ใช้คุกกี้ทางการตลาด โค้ดของเทมเพลตควรอัปเดตสถานะความยินยอมให้สอดคล้องกับ updateConsentState API
ตัวอย่างต่อไปนี้แสดงการเรียก updateConsentState
สำหรับผู้เข้าชมที่ระบุว่าตนเองยินยอมให้ใช้พื้นที่เก็บข้อมูลทุกประเภท ตัวอย่างนี้ใช้ค่าแบบฮาร์ดโค้ดสำหรับ granted
แต่ในทางปฏิบัติ ค่าเหล่านี้ควรกำหนดขณะรันไทม์โดยใช้ความยินยอมของผู้เข้าชมที่ CMP รวบรวมไว้
const updateConsentState = require('updateConsentState');
updateConsentState({
'ad_storage': 'granted',
'ad_user_data': 'granted',
'ad_personalization': 'granted',
'analytics_storage': 'granted',
'functionality_storage': 'granted',
'personalization_storage': 'granted',
'security_storage': 'granted'
});
เกี่ยวกับลักษณะการทำงานเฉพาะภูมิภาค
หากต้องการตั้งค่าสถานะความยินยอมเริ่มต้นที่ใช้กับผู้เข้าชมจากพื้นที่หนึ่งๆ ให้ระบุภูมิภาค (ตาม ISO 3166-2) ในเทมเพลต การใช้ค่าภูมิภาคช่วยให้ผู้ใช้เทมเพลตปฏิบัติตามกฎข้อบังคับของภูมิภาคโดยไม่สูญเสียข้อมูลจากผู้เข้าชมภายนอกภูมิภาคเหล่านั้น เมื่อไม่ได้ระบุภูมิภาคในคำสั่ง setDefaultConsentState
ค่าดังกล่าวจะมีผลกับภูมิภาคอื่นๆ ทั้งหมด
ตัวอย่างเช่น ค่าต่อไปนี้ตั้งค่าสถานะเริ่มต้นของ analytics_storage
เป็น denied
สําหรับผู้เข้าชมจากสเปนและอะแลสกา และกําหนด analytics_storage
เป็น granted
สําหรับผู้เข้าชมอื่นๆ ทั้งหมด
const setDefaultConsentState = require('setDefaultConsentState');
setDefaultConsentState({
'analytics_storage': 'denied',
'region': ['ES', 'US-AK']
});
setDefaultConsentState({
'analytics_storage': 'granted'
});
เจาะจงที่สุดจะมีความสำคัญเหนือกว่า
หากมีคำสั่งความยินยอมเริ่มต้น 2 คำสั่งในหน้าเดียวกันที่มีค่าสำหรับภูมิภาคและภูมิภาคย่อย คำสั่งที่มีภูมิภาคที่เจาะจงมากกว่าจะมีผลบังคับใช้ ตัวอย่างเช่น หากคุณตั้งค่า ad_storage
เป็น 'granted'
สำหรับภูมิภาค US
และตั้ง ad_storage
เป็น 'denied'
สำหรับภูมิภาค US-CA
ผู้เข้าชมจากแคลิฟอร์เนียจะใช้การตั้งค่า US-CA
ที่เจาะจงมากกว่า
ภูมิภาค | ad_storage |
ลักษณะการทำงาน |
---|---|---|
สหรัฐอเมริกา | 'granted' |
มีผลกับผู้ใช้ในสหรัฐอเมริกาที่ไม่ได้อยู่ในแคนาดา |
สหรัฐอเมริกา-แคนาดา | 'denied' |
มีผลกับผู้ใช้ US-CA |
ไม่ระบุ | 'granted' |
ใช้ค่าเริ่มต้น 'granted' ในตัวอย่างนี้ นโยบายนี้ใช้กับผู้ใช้ที่ไม่ได้อยู่ในสหรัฐอเมริกาหรือแคนาดา
|
ข้อมูลเมตาเพิ่มเติม
คุณใช้ gtagSet API เพื่อตั้งค่าพารามิเตอร์ที่ไม่บังคับต่อไปนี้ได้
API เหล่านี้ใช้ได้เฉพาะในสภาพแวดล้อมแซนด์บ็อกซ์ของเทมเพลต GTM เท่านั้น
ส่งผ่านข้อมูลการคลิกโฆษณา รหัสไคลเอ็นต์ และรหัสเซสชันใน URL
เมื่อผู้เข้าชมไปที่เว็บไซต์ของผู้ลงโฆษณาหลังจากที่คลิกโฆษณา ข้อมูลเกี่ยวกับโฆษณาอาจต่อท้าย URL ของหน้า Landing Page เป็นพารามิเตอร์การค้นหา เพื่อปรับปรุงความแม่นยำของ Conversion แท็กของ Google มักจะเก็บข้อมูลนี้ ไว้ในคุกกี้ของบุคคลที่หนึ่งในโดเมนของผู้ลงโฆษณา
อย่างไรก็ตาม หาก ad_storage
คือ denied
แท็ก Google จะไม่บันทึกข้อมูลนี้ในเครื่อง หากต้องการปรับปรุงคุณภาพการวัดการคลิกโฆษณาในกรณีนี้ ผู้ลงโฆษณาสามารถเลือกส่งข้อมูลการคลิกโฆษณาผ่านพารามิเตอร์ของ URL ในหน้าเว็บต่างๆ โดยใช้ฟีเจอร์ที่เรียกว่า "การส่งผ่าน URL"
ในทำนองเดียวกัน หากตั้งค่า analytics_storage
เป็น "ปฏิเสธ" การส่งผ่าน URL จะใช้เพื่อส่งข้อมูลวิเคราะห์ตามเหตุการณ์และเซสชัน (รวมถึง Conversion) ได้โดยไม่ต้องใช้คุกกี้ในหน้าเว็บต่างๆ
การส่งผ่าน URL จะต้องเป็นไปตามเงื่อนไขต่อไปนี้
- หน้าเว็บมีแท็ก Google ที่รับรู้ถึงความยินยอม
- เว็บไซต์ได้เลือกใช้ฟีเจอร์การส่งผ่าน URL
- มีการใช้โหมดความยินยอมในหน้าเว็บ
- ลิงก์ขาออกจะอ้างอิงโดเมนเดียวกับโดเมนของหน้าเว็บปัจจุบัน
- gclid/dclid มีอยู่ใน URL (แท็ก Google Ads และ Floodlight เท่านั้น)
เทมเพลตของคุณควรอนุญาตให้ผู้ใช้เทมเพลตกำหนดค่าได้ว่าต้องการเปิดใช้การตั้งค่านี้หรือไม่ โค้ดเทมเพลตต่อไปนี้ใช้ในการตั้งค่า url_passthrough เป็น true
gtagSet('url_passthrough', true);
ปกปิดข้อมูลในบริบทโฆษณา
เมื่อปฏิเสธ ad_storage
จะไม่มีการตั้งค่าคุกกี้ใหม่เพื่อใช้ในการโฆษณา นอกจากนี้ ระบบจะไม่ใช้คุกกี้ของบุคคลที่สามที่ตั้งค่าไว้ก่อนหน้านี้ใน google.com และ doubleclick.net ข้อมูลที่ส่งไปยัง Google จะยังคงมี URL แบบเต็ม รวมถึงข้อมูลการคลิกโฆษณาในพารามิเตอร์ของ URL
หากต้องการปกปิดข้อมูลโฆษณาของคุณเพิ่มเติมเมื่อ ad_storage
ถูกปฏิเสธ ให้ตั้งค่า ads_data_redaction
เป็น "จริง"
เมื่อ ads_data_redaction
เป็นจริงและ ad_storage
ถูกปฏิเสธ ตัวระบุการคลิกโฆษณาที่ส่งในคำขอเครือข่ายโดยแท็ก Google Ads และ Floodlight จะได้รับการปกปิด
gtagSet('ads_data_redaction', true);
รหัสนักพัฒนาซอฟต์แวร์
หากคุณเป็นผู้ให้บริการ CMP ที่มีรหัสนักพัฒนาซอฟต์แวร์ที่ออกโดย Google ให้ใช้วิธีการต่อไปนี้เพื่อตั้งค่าให้เร็วที่สุดในเทมเพลต
คุณต้องใช้รหัสนักพัฒนาซอฟต์แวร์เฉพาะเมื่อการใช้งานของคุณจะใช้กับหลายๆ เว็บไซต์โดยบริษัทหรือบุคคลที่ไม่เกี่ยวข้อง หากจะใช้โดยเว็บไซต์หรือเอนทิตีเดียว ก็ไม่ต้องใช้รหัสนักพัฒนาซอฟต์แวร์
gtagSet('developer_id.<your_developer_id>', true);
ส่งเอกสารให้กับผู้ใช้
ผู้ใช้จะใช้เทมเพลตความยินยอมเพื่อตั้งค่าแท็กที่รวบรวมความยินยอมของผู้ใช้ได้ จัดเตรียมเอกสารอธิบายแนวทางปฏิบัติ ที่ดีที่สุดต่อไปนี้ให้กับผู้ใช้
- วิธีตั้งค่าเริ่มต้นสำหรับความยินยอมในตารางการตั้งค่า
- วิธีตั้งค่าค่าเริ่มต้นสำหรับความยินยอมสำหรับภูมิภาคต่างๆ โดยการเพิ่มแถวในตาราง
- ทริกเกอร์แท็กในทริกเกอร์การเริ่มต้นขอความยินยอม - ทุกหน้า
ขั้นตอนถัดไป
หากต้องการมอบเทมเพลตให้ผู้ใช้ Tag Manager ทุกคน ให้อัปโหลดไปยังแกลเลอรีเทมเพลตชุมชน