3.8 KiB
3.8 KiB
NinjaCross E-Mail Templates - Übersicht
📋 Alle verfügbaren Templates
| Template | HTML-Datei | Text-Datei | Beschreibung |
|---|---|---|---|
| Confirm signup | welcome-email.html |
welcome-email.txt |
Willkommens-E-Mail für neue Registrierungen |
| Invite user | invite-user.html |
invite-user.txt |
Einladungs-E-Mail für neue Benutzer |
| Magic Link | magic-link.html |
magic-link.txt |
Passwortlose Anmeldung per Magic Link |
| Change Email Address | change-email.html |
change-email.txt |
E-Mail-Adressen-Änderung bestätigen |
| Reset Password | reset-password.html |
reset-password.txt |
Passwort zurücksetzen |
| Reauthentication | reauthentication.html |
reauthentication.txt |
Erneute Authentifizierung für sensible Aktionen |
🎨 Design-Features
Einheitliche Gestaltung
- Dunkles Design mit Neon-Blau-Akzenten (#00d4ff)
- Gradient-Titel mit den NinjaCross-Farben
- Glas-Effekt Container mit Backdrop-Filter
- Responsive Design für alle Geräte
- Inter-Font für moderne Typografie
Sicherheits-Features
- Zeitlimits für alle Links (15 Min - 24 Std)
- Sicherheitshinweise in jeder E-Mail
- Klare Call-to-Action Buttons
- Warnungen bei verdächtigen Aktivitäten
🔧 Template-Variablen
Standard-Variablen (alle Templates)
{{ .ConfirmationURL }}- Link zur Bestätigung/Aktion{{ .SiteURL }}- URL der Website{{ .Email }}- E-Mail-Adresse des Benutzers
Spezielle Variablen
{{ .NewEmail }}- Neue E-Mail-Adresse (nur Change Email){{ .InvitedBy }}- Name des einladenden Benutzers (nur Invite User)
📱 E-Mail-Client-Kompatibilität
Unterstützte Clients
- ✅ Gmail (Web & App)
- ✅ Outlook (Web & App)
- ✅ Apple Mail
- ✅ Thunderbird
- ✅ Yahoo Mail
- ✅ Mobile E-Mail-Apps
Fallback-Strategien
- HTML-Version für moderne Clients
- Text-Version für einfache Clients
- Inline-CSS für bessere Kompatibilität
- Responsive Design für mobile Geräte
🚀 Supabase Integration
Setup-Schritte
- Supabase Dashboard → Authentication → Email Templates
- Template auswählen (z.B. "Confirm signup")
- HTML-Code ersetzen mit Inhalt aus
.htmlDatei - Text-Code ersetzen mit Inhalt aus
.txtDatei - Speichern und testen
E-Mail-Provider
- SMTP Settings in Authentication → Settings
- Supabase Edge Functions für erweiterte Funktionen
- Custom SMTP für eigene E-Mail-Server
🧪 Testing
E-Mail-Test
- Test-Account erstellen
- Template auslösen (Registrierung, Reset, etc.)
- E-Mail prüfen in verschiedenen Clients
- Links testen auf Funktionalität
Browser-Test
- HTML-Datei in Browser öffnen
- Responsive Design testen
- Links und Buttons überprüfen
- Design-Konsistenz sicherstellen
📊 Template-Statistiken
Dateigrößen
- HTML-Templates: ~8-12 KB
- Text-Templates: ~1-2 KB
- Gesamt: ~60 KB für alle Templates
Performance
- Ladezeit: < 1 Sekunde
- Rendering: Optimiert für alle Clients
- Mobile: Vollständig responsive
🔒 Sicherheit
Link-Sicherheit
- Zeitlimits: 15 Min (Reauth) bis 24 Std (Reset)
- Einmalige Nutzung: Links werden nach Verwendung ungültig
- HTTPS: Alle Links verwenden sichere Verbindungen
Datenschutz
- Keine sensiblen Daten in E-Mail-Inhalten
- Minimale Informationen in Templates
- DSGVO-konform gestaltet
🎯 Nächste Schritte
- Supabase konfigurieren mit neuen Templates
- E-Mail-Provider einrichten
- Test-E-Mails versenden
- Design anpassen falls gewünscht
- Monitoring einrichten für E-Mail-Delivery
Erstellt für NinjaCross Timer Leaderboard 🥷 Alle Templates sind bereit für den produktiven Einsatz! ✨