aufräumen
This commit is contained in:
parent
69f3e1b14f
commit
09e8e9230e
|
|
@ -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
|
|
||||||
<form name="company-registration" method="POST" data-netlify="true">
|
|
||||||
```
|
|
||||||
|
|
||||||
## 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
|
|
||||||
|
|
@ -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
|
|
||||||
|
|
@ -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 <button onClick={handleClick}>Click me</button>
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### 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.
|
|
||||||
Loading…
Reference in New Issue