Jika Anda berencana menggunakan salah satu alat analytics berikut, silakan merujuk ke kode yang disediakan dalam dokumen untuk pengaturan yang benar.
DAFTAR ISI
- Catatan Penting
- Facebook pixel
- Google Analytics
- Google Tag Manager
Catatan Penting
Tag <noscript> harus dihapus karena cookie banner SunnyDay adalah solusi berbasis JavaScript. <noscript> dirancang untuk browser yang tidak mendukung JavaScript, dan memasukkannya dapat secara tidak sengaja mengatur cookie tanpa persetujuan pengguna.
Mengintegrasikan Alat Pemasaran dengan Persetujuan Cookie
Saat mengintegrasikan alat pemasaran dengan cookie consent banner, Anda dapat memeriksa kategori cookie mana yang telah disetujui pengguna. Ikuti panduan implementasi yang disediakan untuk alat pemasaran populer.
Catatan Implementasi:
Kode di bawah ini harus menggantikan kode tracking Meta Pixel, Google Tag Manager (GTM), atau Google Analytics (GA) Anda yang sudah ada. Sisipkan di kode header halaman atau pengaturan kode tracking head untuk funnel, website, atau webinar. Template ini memastikan integrasi yang tepat dengan cookie consent banner.
Facebook pixel
JavaScript
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version=’2.0′;
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document, ‘script’,
‘https://connect.facebook.net/en_US/fbevents.js’);
fbq(‘consent’, ‘revoke’);
fbq(‘init’, ‘{your-pixel-id-goes-here}’);
fbq(‘track’, ‘PageView’);
window.addEventListener(‘LCCookieConsentDoneFB’, function (cookieConsent) {
fbq(‘consent’, cookieConsent.detail.fb)},!1)
</script>
Google Analytics
JavaScript
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag(“consent”, “default”, {
ad_storage: “denied”,
ad_user_data: “denied”,
ad_personalization: “denied”,
analytics_storage: “denied”,
});
window.addEventListener(
“LCCookieConsentDoneGTag”,
function (cookieConsent) {
if (cookieConsent.detail.gtag === ‘grant’) {
gtag(“consent”, “update”, {
ad_storage: “granted”,
ad_user_data: “granted”,
ad_personalization: “granted”,
analytics_storage: “granted”,
},
!1
}
});
</script>
<script async src=”https://www.googletagmanager.com/gtag/js?id=TAG_ID”></script>
<script>
gtag(“js”, new Date());
gtag(“config”, “TAG_ID”);
</script>
Google Tag Manager
JavaScript
<script>
window.dataLayer = window.dataLayer ||
[];
function gtag() {
dataLayer.push(arguments);
}
gtag(“consent”, “default”, {
ad_storage: “denied”,
ad_user_data: “denied”,
ad_personalization: “denied”,
analytics_storage: “denied”,
});
window.addEventListener(
“LCCookieConsentDoneGTM”,
function (cookieConsent) {
if (cookieConsent.detail.gtm === ‘grant’) {
gtag(“consent”, “update”, {
ad_storage: “granted”,
ad_user_data: “granted”,
ad_personalization: “granted”,
analytics_storage: “granted”,
});
}
},
!1
);
</script>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({‘gtm.start’:
new Date().getTime(),event:’gtm.js’});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=’dataLayer’?’&l=’+l:”;j.async=true;j.src=
‘https://www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script’,’dataLayer’,’GTM-XXXXXX’);
</script>
Membaca Kategori Cookie
Kode di bawah ini bersifat opsional jika Anda ingin membaca persetujuan atau kategori yang telah diterima pengguna untuk custom code atau JavaScript pihak ketiga lainnya.
JavaScript
// Helper function to get consented categories
function getConsentedCategories() {
const categoriesCookie = document.cookie
.split(‘;’)
.find(row => row.startsWith(‘cookie-categories=’));
if (categoriesCookie) {
// Convert cookie value to array
return categoriesCookie.split(‘=’)[1].split(‘,’);
}
return [];
}
// Helper function to check if category is allowed
function isCategoryAllowed(category) {
const categories = getConsentedCategories();
return categories.includes(category);
}
// Helper function to get cookie config
function getCookieConfig() {
const cookieConfig = document.cookie
.split(‘;’)
.find(row => row.startsWith(‘cookie-config=’));
if (cookieConfig) {
return cookieConfig.split(‘=’)[1];
// Returns: all, essential, or custom
}
return undefined; // Return undefined if user hasn’t made a choice yet
}
Catatan Penting:
- Kategori cookie disimpan dalam cookie cookie-categories.
- Kategori dipisahkan koma (misalnya, “essential, advertising, analytics”).
- Selalu periksa persetujuan awal saat memuat alat pemasaran Anda.
- Dengarkan peristiwa perubahan persetujuan untuk memperbarui pengaturan alat.
- Hapus semua tag <noscript> karena dapat melewati pemeriksaan persetujuan.