Install the cookie consent engine
This is a static external script hosted at ComplyToolbox.xyz. It can control marked scripts and iframes on your website; it does not automatically discover or block unmarked trackers.
1. Install the script before optional tags
<script defer src="https://complytoolbox.xyz/consent/ct-consent.js" data-ct-site="Example Store" data-ct-policy-url="/privacy/" data-ct-version="1" data-ct-accent="#07756a"></script>
Put this in <head>. The privacy policy URL must resolve on your own site. Change data-ct-version when you materially change the consent purposes or vendor list so visitors choose again.
2. Prevent execution before consent
Replace each optional vendor’s script element; do not leave its original executable script elsewhere on the page. For externally hosted analytics:
<script type="text/plain" data-ct-category="analytics" data-ct-src="https://example.net/analytics.js"></script>
For inline scripts, omit data-ct-src and place the inline code inside the inert script element. A strict CSP may require nonces or other changes. A marketing iframe can be gated as follows:
<iframe title="Marketing video" data-ct-category="marketing" data-ct-src="https://video.example/embed/123"></iframe>
Supported categories: functional, analytics and marketing. Necessary scripts should not be tagged as optional. Identify categories truthfully from your actual vendor inventory.
3. Use the API after the script loads
// Read browser-local preference data (null before a choice)
window.ComplyToolboxConsent.getConsent();
// Only your own optional code can use the appropriate category
window.ComplyToolboxConsent.hasConsent('analytics');
window.ComplyToolboxConsent.openPreferences();
// For dynamic script/iframe elements added after first page load
window.ComplyToolboxConsent.refresh();
window.addEventListener('ct:consent-change', (event) => {
console.log(event.detail.consent); // do not upload without privacy review
});
Preferences are stored per browser origin using localStorage for up to 180 days, including selected categories, consent policy version and a timestamp. Browser storage can be blocked or cleared; this is not a reliable server-side consent archive.
4. Validate the integration
- Open a new private window and use Developer Tools → Network. Confirm no optional requests fire before a choice.
- Press Reject optional. Confirm optional tags remain inert even on reload.
- Press Accept all and confirm only the expected vendor tags activate.
- Open Cookie preferences and withdraw previously granted permission. The page reloads to avoid re-running marked scripts, but already-set vendor cookies may remain.
- Test keyboard controls, small screens, strict Content Security Policy, iframe embeds, tag managers and all third-party services.