olemd/gdpr
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update documentation with comprehensive i18n features

Browse source 
README.md:
- Add multilingual support badge and live demo link
- Document Norwegian and English language switching
- Add i18n API section with language functions
- Include instructions for adding new languages
- Update file listing with current filenames

CLAUDE.md:
- Add internationalization system architecture details
- Document language preference persistence
- Include i18n testing commands and API usage
- Add customization points for translations
- Update key files section with favicon info

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Ole-Morten Duesund 2025-09-08 13:19:26 +02:00
commit 6e5a771321
2 changed files with 79 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

28
CLAUDE.md
View file

@ -10,7 +10,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
## Project Overview
This is a GDPR-compliant optional tracking solution that provides a privacy-first approach to website analytics. The core concept is "minimal tracking by default, enhanced tracking by consent" - users start with privacy-protected minimal tracking and can opt-in to enhanced features.
This is a GDPR-compliant optional tracking solution that provides a privacy-first approach to website analytics. The core concept is "minimal tracking by default, enhanced tracking by consent" - users start with privacy-protected minimal tracking and can opt-in to enhanced features. **Features comprehensive i18n support for Norwegian and English.**
## Architecture
@ -23,15 +23,23 @@ This is a GDPR-compliant optional tracking solution that provides a privacy-firs
- Manages cookie cleanup for tracking cookies (`_ga`, `_gid`, `_gat`, `_fbp`, `_fbc`)
- Fires custom events (`trackingModeChanged`) for external integrations
**Internationalization System**
- Complete translation system supporting Norwegian (Bokmål) and English
- Language preference persisted with key 'gdpr-language' in localStorage
- Real-time translation updates without page reload
- Language toggle button (EN/NO) in top-right corner
- All UI text, modal content, and notifications fully localized
**Two-Mode System**
- **Minimal Mode**: Essential cookies only, anonymized analytics, consent denied by default
- **Enhanced Mode**: Full tracking enabled only after explicit user consent
### Key Files
- `index.html` - Complete demo with hero section, feature explanations, and live status indicator
- `index.html` - Complete demo with hero section, feature explanations, live status indicator, and i18n support
- `integration-example.js` - Production-ready integration examples for React, Vue, WordPress, and vanilla JS
- `README.md` - Documentation covering API, customization, and legal compliance
- `README.md` - Documentation covering API, customization, i18n, and legal compliance
- `favicon.svg`, `favicon.ico` - Privacy-themed favicon with shield and lock design
## Development Commands
@ -67,10 +75,17 @@ The solution integrates with Google Analytics via consent modes:
// Check current consent status
localStorage.getItem('gdpr-tracking-consent') === 'true'
// Check current language
localStorage.getItem('gdpr-language') || 'en'
// Listen for mode changes
document.addEventListener('trackingModeChanged', (e) => {
console.log('Mode:', e.detail.mode); // 'minimal' or 'enhanced'
});
// Set language programmatically
setLanguage('no'); // Norwegian
setLanguage('en'); // English
```
## Key Implementation Details
@ -105,12 +120,19 @@ The button automatically calls `gtag('consent', 'update', {...})` when user chan
- Button styling via CSS classes `.tracking-consent-btn` and `.tracking-consent-btn.enabled`
- Modal content in `.consent-modal-content`
- Status indicator in `.tracking-status`
- Language toggle styling via `.language-toggle` and `.lang-btn`
### Behavioral Customization
- Change storage key by modifying `this.storageKey` in constructor
- Customize consent message in modal HTML
- Add additional tracking services in `enableEnhancedTracking()` method
### Internationalization Customization
- Add new languages to `translations` object with all required keys
- Modify Norwegian translations for local variants (e.g., Nynorsk)
- Add language detection based on browser locale
- Customize language button labels and positioning
### Framework Integration
The `integration-example.js` contains complete examples for:
- WordPress (functions.php and shortcode approaches)