Update documentation with comprehensive i18n features
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:
parent
45b4248662
commit
6e5a771321
2 changed files with 79 additions and 5 deletions
56
README.md
56
README.md
|
|
@ -2,19 +2,30 @@
|
|||
|
||||
A lightweight, user-friendly JavaScript solution for implementing GDPR-compliant optional tracking on websites. By default, only minimal tracking is enabled, and users can opt-in to enhanced tracking with a fun "Plz trac me!" button.
|
||||
|
||||
**🌐 Now with full Norwegian and English language support!**
|
||||
|
||||
## Features
|
||||
|
||||
- 🔒 **GDPR Compliant by Default**: Minimal tracking until user consents
|
||||
- 🌐 **Multilingual Support**: Norwegian and English with instant language switching
|
||||
- 🎨 **Beautiful UI**: Gradient button with hover effects and smooth animations
|
||||
- 📱 **Mobile Responsive**: Works perfectly on all device sizes
|
||||
- ⚡ **Lightweight**: Pure vanilla JavaScript, no dependencies
|
||||
- 🔧 **Easy Integration**: Drop-in solution for any website
|
||||
- 🍪 **Cookie Management**: Automatic cleanup when tracking is disabled
|
||||
- 📊 **Analytics Ready**: Google Analytics consent mode integration
|
||||
- 💾 **Persistent Preferences**: Language and consent choices remembered between visits
|
||||
|
||||
## Demo
|
||||
|
||||
Open `gdpr-tracking-consent.html` in your browser to see the button in action!
|
||||
**🚀 Live Demo:** [https://kode.naiv.no/olemd/gdpr](https://kode.naiv.no/olemd/gdpr)
|
||||
|
||||
Open `index.html` in your browser to see the button in action!
|
||||
|
||||
**Language Support:**
|
||||
- Click **EN/NO** toggle in the top-right corner to switch languages
|
||||
- All content translates instantly without page reload
|
||||
- Language preference persists between visits
|
||||
|
||||
## Quick Start
|
||||
|
||||
|
|
@ -134,6 +145,45 @@ window.trackingConsent.enableTracking();
|
|||
window.trackingConsent.disableTracking();
|
||||
```
|
||||
|
||||
## Internationalization (i18n)
|
||||
|
||||
### Language Support
|
||||
Supports **Norwegian (Bokmål)** and **English** with:
|
||||
- Complete UI translation including consent modal
|
||||
- Proper Norwegian capitalization and compound words
|
||||
- Real-time language switching
|
||||
- Persistent language preference
|
||||
|
||||
### Language API
|
||||
```javascript
|
||||
// Switch language programmatically
|
||||
setLanguage('no'); // Norwegian
|
||||
setLanguage('en'); // English
|
||||
|
||||
// Get current language
|
||||
const currentLang = localStorage.getItem('gdpr-language') || 'en';
|
||||
|
||||
// Listen for language changes
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
// Language is automatically loaded from localStorage
|
||||
});
|
||||
```
|
||||
|
||||
### Adding New Languages
|
||||
1. Add translations to the `translations` object:
|
||||
```javascript
|
||||
const translations = {
|
||||
en: { /* English translations */ },
|
||||
no: { /* Norwegian translations */ },
|
||||
de: { /* German translations */ }
|
||||
};
|
||||
```
|
||||
|
||||
2. Add language button:
|
||||
```html
|
||||
<button class="lang-btn" onclick="setLanguage('de')" id="langDe">DE</button>
|
||||
```
|
||||
|
||||
## Browser Support
|
||||
|
||||
- Modern browsers (ES6+)
|
||||
|
|
@ -142,9 +192,11 @@ window.trackingConsent.disableTracking();
|
|||
|
||||
## Files
|
||||
|
||||
- `gdpr-tracking-consent.html` - Complete demo with all features
|
||||
- `index.html` - Complete demo with all features and i18n support
|
||||
- `integration-example.js` - Integration examples for different frameworks
|
||||
- `README.md` - This documentation
|
||||
- `CLAUDE.md` - Repository guidance for Claude Code
|
||||
- `favicon.svg`, `favicon.ico` - Privacy-themed favicon files
|
||||
|
||||
## Legal Compliance
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue