diff --git a/EMAIL_SETUP.md b/EMAIL_SETUP.md deleted file mode 100644 index f03f5e4..0000000 --- a/EMAIL_SETUP.md +++ /dev/null @@ -1,55 +0,0 @@ -# E-Mail Setup für Unternehmensanmeldungen - -## Aktuelle Lösung - -Die Formular-Daten werden derzeit in der Browser-Konsole geloggt. Um E-Mails an `knuth.timo@gmail.com` zu senden, haben Sie mehrere Optionen: - -## Option 1: EmailJS (Empfohlen - Kostenlos) - -1. Gehen Sie zu [https://www.emailjs.com/](https://www.emailjs.com/) -2. Erstellen Sie ein kostenloses Konto -3. Verbinden Sie Ihren Gmail-Account -4. Erstellen Sie eine E-Mail-Vorlage -5. Ersetzen Sie die Platzhalter in `src/lib/emailService.ts`: - -```typescript -service_id: 'Ihr_Service_ID', -template_id: 'Ihr_Template_ID', -user_id: 'Ihr_User_ID' -``` - -## Option 2: Webhook.site (Einfach) - -1. Gehen Sie zu [https://webhook.site/](https://webhook.site/) -2. Kopieren Sie die Webhook-URL -3. Ersetzen Sie `'https://webhook.site/your-webhook-url'` in `src/lib/emailService.ts` -4. Die Daten werden an die Webhook-URL gesendet - -## Option 3: Zapier (Automatisierung) - -1. Erstellen Sie ein Zapier-Konto -2. Erstellen Sie einen "Webhook" Trigger -3. Verbinden Sie ihn mit Gmail -4. Verwenden Sie die Webhook-URL in der Anwendung - -## Option 4: Netlify Forms (Wenn auf Netlify gehostet) - -Fügen Sie `netlify` zu den Form-Attributen hinzu: - -```html -
-``` - -## Aktuelle Implementierung - -Die Daten werden derzeit in der Browser-Konsole ausgegeben. Öffnen Sie die Entwicklertools (F12) und schauen Sie in die Konsole, um die Formular-Daten zu sehen. - -## PostHog Tracking - -Die folgenden Events werden getrackt: -- `company_registration_started` - Formular wird abgesendet -- `company_registration_completed` - Erfolgreiche Übermittlung -- `company_registration_failed` - Fehler bei der Übermittlung -- `experience_selected` - Erfahrungslevel ausgewählt -- `energy_type_selected` - Energieart ausgewählt -- `service_selected` - Service ausgewählt diff --git a/EMAIL_SOLUTION.md b/EMAIL_SOLUTION.md deleted file mode 100644 index 6c88a21..0000000 --- a/EMAIL_SOLUTION.md +++ /dev/null @@ -1,84 +0,0 @@ -# E-Mail-Lösung für Unternehmensanmeldungen - -## Problem -Webhook.site empfängt nur HTTP-Requests, aber leitet keine E-Mails weiter. - -## Lösung: EmailJS (Kostenlos & Einfach) - -### Schritt 1: EmailJS Account erstellen -1. Gehen Sie zu [https://www.emailjs.com/](https://www.emailjs.com/) -2. Klicken Sie auf "Sign Up" (kostenlos) -3. Erstellen Sie ein Konto - -### Schritt 2: E-Mail-Service einrichten -1. **Dashboard** → **Email Services** → **Add New Service** -2. Wählen Sie **Gmail** -3. Verbinden Sie Ihr Gmail-Konto (`knuth.timo@gmail.com`) -4. Notieren Sie sich die **Service ID** (z.B. `service_xxxxxxx`) - -### Schritt 3: E-Mail-Vorlage erstellen -1. **Dashboard** → **Email Templates** → **Create New Template** -2. **Template ID:** `template_company_registration` -3. **Subject:** `Neue Unternehmensanmeldung - EnergieProfis` -4. **Content:** -``` -Neue Unternehmensanmeldung - -Firmenname: {{company_name}} -Ansprechpartner: {{contact_person}} -E-Mail: {{email}} -Telefon: {{phone}} -Website: {{website}} -PLZ: {{zip_code}} -Stadt: {{city}} -Energiearten: {{energy_types}} -Leistungen: {{services}} -Jahre Erfahrung: {{experience}} -Einzugsgebiet: {{coverage_area}} -Kontaktpräferenz: {{contact_preference}} -Newsletter: {{newsletter}} - -Unternehmensbeschreibung: -{{description}} -``` - -### Schritt 4: User ID finden -1. **Dashboard** → **Account** → **General** -2. Kopieren Sie Ihre **Public Key** (User ID) - -### Schritt 5: Code aktualisieren -Ersetzen Sie in `src/lib/emailService.ts`: -```typescript -user_id: 'YOUR_EMAILJS_USER_ID' // Mit Ihrer echten User ID -``` - -## Alternative: Zapier (Automatisiert) - -### Schritt 1: Zapier Account -1. Gehen Sie zu [https://zapier.com](https://zapier.com) -2. Erstellen Sie ein kostenloses Konto - -### Schritt 2: Zap erstellen -1. **Create Zap** -2. **Trigger:** "Webhooks by Zapier" → "Catch Hook" -3. **Action:** "Gmail" → "Send Email" -4. **Konfiguration:** - - **To:** `knuth.timo@gmail.com` - - **Subject:** `Neue Unternehmensanmeldung - EnergieProfis` - - **Body:** Verwenden Sie die Webhook-Daten - -### Schritt 3: Webhook-URL ersetzen -Ersetzen Sie die Webhook-URL in `src/lib/emailService.ts` mit der Zapier-URL. - -## Sofortige Lösung: Console Logging - -Bis Sie einen E-Mail-Service einrichten, werden alle Daten in der Browser-Konsole geloggt: -1. Öffnen Sie F12 (Entwicklertools) -2. Gehen Sie zum "Console" Tab -3. Alle Formular-Daten werden dort angezeigt - -## Status -✅ **Webhook funktioniert** - Daten werden empfangen -⚠️ **E-Mail-Weiterleitung** - Benötigt E-Mail-Service -✅ **PostHog Analytics** - Funktioniert -✅ **Dropdown ohne Animation** - Funktioniert diff --git a/POSTHOG_SETUP.md b/POSTHOG_SETUP.md deleted file mode 100644 index b341fbe..0000000 --- a/POSTHOG_SETUP.md +++ /dev/null @@ -1,81 +0,0 @@ -# PostHog Analytics Setup - -PostHog has been successfully integrated into the Energie Finder Profi project. - -## Configuration - -- **API Key**: `phc_jIkj0hQSY670vRaUVjSRSDOqmLCDGkL6GJy44iqE84M` -- **Host**: `https://app.posthog.com` -- **Initialization**: PostHog is automatically initialized in `main.tsx` - -## Files Added/Modified - -1. **`src/lib/posthog.ts`** - PostHog configuration and initialization -2. **`src/hooks/usePostHog.ts`** - React hook for easy PostHog usage -3. **`src/main.tsx`** - PostHog initialization on app start -4. **`src/components/HeroSection.tsx`** - Example tracking implementation -5. **`package.json`** - Added posthog-js dependency - -## Usage - -### Basic Event Tracking - -```tsx -import { usePostHog } from '@/hooks/usePostHog' - -const MyComponent = () => { - const posthog = usePostHog() - - const handleClick = () => { - posthog.capture('button_clicked', { - button_name: 'search', - page: 'home' - }) - } - - return -} -``` - -### User Identification - -```tsx -const posthog = usePostHog() - -// Identify a user -posthog.identify('user_123', { - email: 'user@example.com', - name: 'John Doe' -}) -``` - -### Feature Flags - -```tsx -const posthog = usePostHog() - -// Check if feature is enabled -const isNewFeatureEnabled = posthog.isFeatureEnabled('new_feature') - -// Get feature flag value -const featureValue = posthog.getFeatureFlag('feature_with_value') -``` - -## Environment Variables - -You can optionally set the PostHog API key via environment variable: - -```env -VITE_POSTHOG_API_KEY=phc_jIkj0hQSY670vRaUVjSRSDOqmLCDGkL6GJy44iqE84M -``` - -## Current Tracking - -The following events are currently being tracked: - -- `hero_search_clicked` - When user clicks "Installateur Finden" in hero section -- `hero_view_all_clicked` - When user clicks "Alle Installateure Ansehen" - -## PostHog Dashboard - -Visit [https://app.posthog.com](https://app.posthog.com) to view analytics data, create funnels, and set up feature flags.