Uruchom PrivacyKit w kilka minut dzięki lekkim komponentom webowym, które działają zarówno w frameworkach, jak i na statycznych stronach.
Dodaj PrivacyKit do swojej witryny przy użyciu skryptów CDN lub instalując pakiet NPM. Wybierz metodę dopasowaną do konfiguracji projektu.
Dodaj skrypty do sekcji <head> swojej witryny. Działa z WordPress, Shopify, Wix i każdą witryną, gdzie możesz dodać HTML.
<html>
<head>
<!-- Dodaj web komponenty PrivacyKit: consent-dialog, consent-guard, consent-missing, compliance-monitor -->
<script type="module" src="https://cdn.privacykit.eu/v1/privacykit.esm.js"></script>
<script nomodule src="https://cdn.privacykit.eu/v1/privacykit.js"></script>
<!-- Dodaj API JavaScript PrivacyKit do programowego dostępu do zgody (opcjonalnie) -->
<script type="module" src="https://cdn.privacykit.eu/v1/index.esm.js"></script>
</head>
<body>
<!-- Dodaj consent-dialog -->
<consent-dialog></consent-dialog>
</body>
<html>Zacznij od wbudowanego motywu i wariantu układu, następnie dopracuj pojedyncze tokeny designu albo w pełni dostosuj okno dialogowe do swojej marki.
<consent-dialog theme="standard" variant="standard"></consent-dialog>Wbudowane motywy opierają się na tokenach designu. Nadpisz tylko te tokeny, których potrzebujesz, aby uzyskać niestandardowy wygląd, zachowując resztę wybranego motywu bez zmian.
<consent-dialog variant="standard" theme="standard" style="
--pk-transparency: 0%;
--pk-bg-color: #faf7f2;
--pk-paper-color: #f7eede;
--pk-text-color: #3a3530;
--pk-text-color-on-primary: #212121;
--pk-primary-color: #b08968;
--pk-secondary-color: #d6c2b2;
--pk-focus-ring-color: #866346;
--pk-font-family: 'Segoe UI', Tahoma, sans-serif;
--pk-spacing-unit: 0.6rem;
--pk-control-border-color: #d6dbe4;
--pk-control-border-width: 3px;
--pk-control-border-radius: 10px;
--pk-dialog-border-color: #d6dbe4;
--pk-dialog-border-width: 3px;
--pk-dialog-border-radius: 20px;
--pk-dialog-max-height: min(70dvh, 500px);
--pk-dialog-shadow: 0 10px 20px rgba(0, 0, 0, 50%);
">
</consent-dialog>Użyj <consent-guard>, aby kontrolować, kiedy skrypty stron trzecich i osadzona treść mogą się załadować na podstawie zgody odwiedzającego. Możesz opakować każdy tracker we własny Consent Guard albo pogrupować kilka trackerów wymagających tej samej zgody w jednym Consent Guard.
<!-- Dodaj element(y) consent-guard, aby chronić skrypty stron trzecich -->
<consent-guard consent="analytics">
<script type="text/plain" data-src="https://example.com/analytics.js?id=XXXXXX"></script>
</consent-guard>
<consent-guard consent="marketing">
<script type="text/plain" data-src="https://example.com/marketing.js?id=XXXXXX"></script>
</consent-guard>
Zmień typ script na text/plain i zastąp src przez data-src dla zarządzanych zasobów. PrivacyKit przywraca oryginalne atrybuty i automatycznie ładuje zasób po uzyskaniu wymaganej zgody.
Umiejscowienie: Dodawaj Consent Guards do <body> dokumentu, kiedy to możliwe. Wiele systemów CMS i kreatorów stron pozwala dodawać niestandardowe skrypty tylko w <head> — jeśli dotyczy to Twojej platformy, umieść Consent Guard wraz ze skryptem, który zawiera, na końcu sekcji <head>.
Opakuj osadzoną treść, taką jak elementy <iframe>, bezpośrednio tam, gdzie pojawia się na stronie. Opcjonalnie użyj <consent-missing>, aby wyświetlić alternatywną treść, dopóki wymagana zgoda nie zostanie udzielona.
<consent-guard id="yt-embed" consent="analytics+marketing">
<iframe data-src="https://www.youtube.com/embed/abc123"></iframe>
</consent-guard>
<consent-missing for="yt-embed">
<p>Aby zobaczyć tę treść, zaakceptuj cookies analityczne i marketingowe.</p>
</consent-missing>
Dodaj PrivacyKit Compliance Monitor, aby wykrywać trackery, weryfikować ochronę zgód i identyfikować niezarządzaną aktywność na swojej stronie — dając programistom i zespołom compliance dostęp do walidacji w czasie rzeczywistym bez wpływu na doświadczenie odwiedzających.
<body>
<!-- Dodaj compliance-monitor, aby stale weryfikować egzekwowanie zgody -->
<compliance-monitor></compliance-monitor>
</body>Zobacz PrivacyKit w akcji z przykładami na żywo w HTML i React.
Każde demo zawiera Compliance Monitor do inspekcji wykonania trackerów w czasie rzeczywistym, panel testowy zgody do symulowania stanów zgody i zachowania nowych użytkowników oraz interaktywne przykłady consent-guard — weryfikujące, że skrypty i osadzone treści są prawidłowo blokowane lub dozwolone na podstawie udzielonej zgody. Oba zawierają również consent-dialog stylizowany za pomocą design-tokens. Demo HTML integruje się przez CDN script-tags kompatybilne z dowolnym środowiskiem SSR.
PrivacyKit domyślnie zawiera 10-dniowy okres próbny, umożliwiając integrację i testowanie platformy przed aktywacją subskrypcji.
Po wygaśnięciu okresu próbnego PrivacyKit nadal działa w trybie ograniczonym, zamiast dezaktywować istniejące integracje.
Status aktywacji jest dostępny przez JavaScript API, logowany w konsoli przeglądarki podczas inicjalizacji i może być również sprawdzony za pomocą sprawdzania statusu aktywacji.