Tek satır kurulum, sınırsız özelleştirme

1. Paketi kurun

npm install @cerez-io/sdk

2. Uygulamanın girişinde başlatın

init çağrısını başka hiçbir izleyici kodundan (Google Analytics, Meta Pixel, GTM) önce yapın. YOUR_SITE_KEY yerine panelde Kurulum sayfasındaki site anahtarınızı yazın.

import { init, on, hasConsent } from '@cerez-io/sdk';

init({ key: 'YOUR_SITE_KEY' });

on('consent', () => {
  if (hasConsent('analytics')) {
    startAnalytics();
  }
});

3. Tek sayfa uygulamada gezinti

İstemci tarafı gezintiden sonra page() çağırın; ilk yükleme otomatik sayılır. Örnek Vue Router içindir.

import { page } from '@cerez-io/sdk';

router.afterEach(() => page());

Next.js

init tarayıcıda çalışmalıdır; sunucuda çağrılırsa hiçbir şey yapmaz. Bileşeni kök layout'a bir kez ekleyin.

'use client';

import { useEffect } from 'react';
import { init } from '@cerez-io/sdk';

export default function CerezIo() {
  useEffect(() => {
    init({ key: 'YOUR_SITE_KEY' });
  }, []);

  return null;
}

Diğer işlevler: getConsent(), hasConsent(kategori), showBanner(), on('consent', fn). Seçenekler (host, lang, autoBlock, nonce, userId) paketin npm sayfasında anlatılır.

Inline Script Engelleme

<!-- Inline script için: type="text/plain" + data-cb-category -->
<script type="text/plain" data-cb-category="marketing">
    fbq('init', 'PIXEL_ID');
    fbq('track', 'PageView');
</script>

Gömülü İçerik (iframe) Engelleme

YouTube, Vimeo, Google Maps ve sosyal ağ gömmelerinde src yerine data-cb-src yazın ve kategoriyi data-cb-category ile belirtin. İçerik onay verilene kadar yüklenmez; yerinde aynı boyutta bir yer tutucu ile "İzin ver ve göster" ve "Tercihler" düğmeleri görünür. İzin verilince aynı kategorideki tüm gömmeler yüklenir, onay geri alınınca yer tutucuya dönülür. YouTube için youtube-nocookie.com adresi önerilir.

<iframe data-cb-src="https://www.youtube-nocookie.com/embed/VIDEO_ID"
  data-cb-category="marketing" width="560" height="315" title="Video"></iframe>

Klavye ve Odak