E-Mails

1. Wofuer ist diese Funktion

Die E-Mail-Seite ist die zentrale Verwaltungsoberflaeche fuer E-Mail-Vorlagen in Octoserv. Sie organisiert Groundhogg-E-Mails in Kampagnenkategorien und bietet einen integrierten Editor zum Erstellen und Bearbeiten von E-Mail-Templates -- alles innerhalb der Octoserv-Oberflaeche, ohne in das Groundhogg-Backend wechseln zu muessen.

Die Seite ist ueber den Navigationspunkt "E-Mails" in der Sidebar erreichbar (/octo/emails). Im Gegensatz zur Kampagnen-Seite verwendet die E-Mail-Seite ein einspaltiges Vollbreiten-Layout, da keine zusaetzlichen Funktions-Buttons benoetigt werden. Der Fokus liegt vollstaendig auf der Kategorisierung und Bearbeitung von E-Mail-Vorlagen.

E-Mail-Vorlagen sind wiederverwendbare Templates, die in Flows (Automatisierungen) oder als Basis fuer Newsletter-Broadcasts verwendet werden. Die E-Mail-Seite dient der Erstellung und Pflege dieser Templates -- der eigentliche Versand erfolgt ueber die Kampagnen-Flows oder die Newsletter-Funktion.

2. Ziel und Vorteil

• Uebersichtliche Kategorisierung: E-Mail-Vorlagen werden in Kampagnenkategorien organisiert, sodass zusammengehoerige E-Mails (z.B. alle E-Mails einer Willkommens-Serie) gruppiert werden.
• Integrierter Editor: Der Groundhogg-E-Mail-Editor oeffnet sich direkt in einem iFrame-Modal innerhalb der Octoserv-Oberflaeche. Benutzer muessen das vertraute Octoserv-Interface nicht verlassen.
• Ampelstatus: Jede E-Mail-Vorlage zeigt ueber eine farbige Statusanzeige (gruen = aktiv/bereit, rot = inaktiv/Entwurf) ihren aktuellen Zustand an.
• Schnelle Erstellung: Neue E-Mail-Vorlagen koennen direkt aus einer Kategorie heraus erstellt werden. Der Benutzer gibt lediglich einen Titel ein und wird sofort in den Editor weitergeleitet.
• Direkte Newsletter-Anbindung: Jede E-Mail-Vorlage kann als Basis fuer einen Newsletter-Broadcast verwendet werden. Der Weg von der Vorlage zum Versand ist nahtlos.
• Getrennte Sichtbarkeitssteuerung: Administratoren koennen die Sichtbarkeit von E-Mail-Kategorien unabhaengig von der Kampagnen-Seite steuern, da separate Sichtbarkeitstabellen verwendet werden.

3. Detaillierte Funktionsbeschreibung

3.1 Seitenlayout

Die E-Mail-Seite verwendet ein einspaltiges Vollbreiten-Layout. Die gesamte Seitenbreite wird fuer den Kategorienbaum mit E-Mail-Vorlagen genutzt.

Hauptelemente:

• Seitenheader: Zeigt den Titel "E-Mails" mit einem Hilfe-Button.
• Kategorien-Karte: Enthaelt den Kategorienbaum und einen Button zum Erstellen neuer Kategorien.

3.2 E-Mail-Kategorienbaum

Der Kategorienbaum wird beim Laden der Seite per AJAX (octo_load_campaigns_emails) geladen. Die Datenstruktur verwendet dieselben Groundhogg-Kampagnen wie die Kampagnen-Seite, zeigt aber die verknuepften E-Mails statt der Flows an.

Aufbau einer Kategorie:

3.3 E-Mail-Elemente

Jede E-Mail-Vorlage innerhalb einer Kategorie zeigt folgende Informationen:

3.4 Kategorie erstellen

Der Kategorie-Erstellungsprozess funktioniert identisch zur Kampagnen-Seite:

1. Ueber den Button "Kategorie erstellen" oeffnet sich ein modaler Dialog.
2. Der Benutzer gibt einen Namen (Pflichtfeld) und optional eine Beschreibung ein.
3. Nach dem Absenden (octo_create_campaign) wird die Kategorie in der Groundhogg-Campaigns-Tabelle angelegt.
4. Der Kategorienbaum wird automatisch neu geladen.

Da E-Mails und Flows dieselben Kampagnenkategorien teilen, ist eine auf der E-Mail-Seite erstellte Kategorie auch auf der Kampagnen-Seite sichtbar (sofern die Sichtbarkeit entsprechend eingestellt ist).

3.5 E-Mail-Vorlage erstellen

Ueber den Plus-Button in einer Kategorie oeffnet sich ein Dialogfenster zur Titeleingabe.

Ablauf:

1. Benutzer gibt den E-Mail-Titel ein (z.B. "Willkommens-E-Mail").
2. Per AJAX (octo_create_email) wird eine neue Groundhogg-E-Mail mit Typ "broadcast" und Status "draft" erstellt.
3. Die E-Mail wird ueber die Tabelle wp_gh_object_relationships und E-Mail-Meta mit der Kategorie verknuepft.
4. Der E-Mail-Editor oeffnet sich automatisch in einem iFrame-Modal.

3.6 E-Mail bearbeiten (iFrame-Editor)

Der Groundhogg-E-Mail-Editor wird in einem bildschirmfuellenden Modal angezeigt. Das WordPress-Admin-Interface wird per CSS ausgeblendet und durch das Octoserv-Design ersetzt.

Designanpassungen im iFrame:

• WordPress-Sidebar, Adminbar und Footer werden ausgeblendet.
• Groundhogg-Branding (Logo, SVGs) wird entfernt.
• Buttons, Tabellen und Eingabefelder erhalten das Octoserv-Styling (abgerundete Ecken, Orange als Primaerfarbe).
• Tab-Navigation wird im Octoserv-Stil dargestellt (unterstrichener aktiver Tab in Orange).

Steuerung:

• Schliessen ueber den "Schliessen"-Button, die Escape-Taste oder Klick auf den Overlay.
• Nach dem Schliessen wird der Kategorienbaum automatisch aktualisiert.
• Ein Spinner wird waehrend des Ladevorgangs angezeigt, bevor der iFrame-Inhalt sichtbar wird.

3.7 E-Mail loeschen

Nach einer Sicherheitsabfrage wird die E-Mail ueber die Groundhogg-API oder direkt in der Datenbank geloescht. Dabei werden auch die Eintraege in der Beziehungstabelle (wp_gh_object_relationships) und den E-Mail-Metadaten (wp_gh_emailmeta) bereinigt.

3.8 Sichtbarkeitssteuerung

Die E-Mail-Seite verwendet eine eigene Sichtbarkeitstabelle (wp_octo_campaign_visibility_emails), die unabhaengig von der Kampagnen-Seite funktioniert. Das bedeutet:

• Eine Kategorie kann auf der Kampagnen-Seite sichtbar, aber auf der E-Mail-Seite versteckt sein (und umgekehrt).
• Die Berechtigung zur Sichtbarkeitssteuerung wird ueber octo_user_can_view_admin_emails geprueft.

3.9 Datenmodell

E-Mails werden in folgenden Groundhogg-Tabellen gespeichert:

4. Benutzerdokumentation / Anwendung

4.1 E-Mail-Uebersicht aufrufen

1. In der Sidebar auf "E-Mails" klicken.
2. Die Seite zeigt den Kategorienbaum mit allen zugeordneten E-Mail-Vorlagen.
3. Falls noch keine Kategorien existieren, erscheint der Hinweis "Keine Kampagnen vorhanden. Erstellen Sie die erste Kampagne, um mit E-Mail-Management zu beginnen."

4.2 Neue Kategorie erstellen

1. Auf den Button "Kategorie erstellen" oben rechts klicken.
2. Im Dialog einen Kategorienamen eingeben (Pflichtfeld).
3. Optional eine Beschreibung hinzufuegen.
4. Auf "Erstellen" klicken.
5. Die neue Kategorie erscheint im Baum.

4.3 Neue E-Mail-Vorlage erstellen

1. Den blauen Plus-Button neben dem gewuenschten Kategorienamen klicken.
2. Einen E-Mail-Titel eingeben (z.B. "Willkommens-E-Mail" oder "Angebots-Nachfrage").
3. Auf "Erstellen" klicken.
4. Der Groundhogg-E-Mail-Editor oeffnet sich automatisch.
5. Den Betreff, Absender, Inhalt und das Design der E-Mail konfigurieren.
6. Im Groundhogg-Editor speichern und das Modal schliessen.

4.4 Bestehende E-Mail bearbeiten

1. Auf den Titel der E-Mail im Kategorienbaum klicken oder den "Bearbeiten"-Button verwenden.
2. Der E-Mail-Editor oeffnet sich im iFrame-Modal.
3. Aenderungen an Betreff, Inhalt oder Design vornehmen.
4. Im Groundhogg-Editor speichern.
5. Das Modal schliessen -- der Kategorienbaum aktualisiert sich automatisch.

4.5 E-Mail loeschen

1. Den roten "Loeschen"-Button neben der E-Mail klicken.
2. Die Sicherheitsabfrage mit "OK" bestaetigen.
3. Die E-Mail wird unwiderruflich geloescht.

Hinweis: Wenn eine E-Mail in einem aktiven Flow verwendet wird, sollte sie nicht geloescht werden, da der Flow sonst nicht mehr korrekt funktioniert.

4.6 Kategorie-Sichtbarkeit steuern (nur Administratoren)

1. Die "Oeffentlich"-Checkbox neben einer Kategorie verwenden.
2. Aktiviert: Die Kategorie ist fuer alle berechtigten Benutzer sichtbar.
3. Deaktiviert: Die Kategorie ist nur fuer Administratoren sichtbar.
4. Die Sichtbarkeit auf der E-Mail-Seite ist unabhaengig von der Kampagnen-Seite.

5. Anwendungsbeispiele

Beispiel 1: Willkommens-E-Mail-Serie aufbauen

Ein Unternehmen moechte eine Serie von Willkommens-E-Mails fuer neue Kontakte erstellen.

Vorgehen:

1. Eine neue Kategorie "Willkommen" erstellen.
2. Folgende E-Mail-Vorlagen erstellen:
   • "Willkommen Tag 1 -- Herzlich willkommen"
   • "Willkommen Tag 3 -- Unsere Services"
   • "Willkommen Tag 7 -- Sonderangebot"
3. Jede E-Mail im Editor mit dem passenden Inhalt, Betreff und Design versehen.
4. Die fertigen Vorlagen werden anschliessend in einem Flow auf der Kampagnen-Seite als E-Mail-Schritte verwendet.

Beispiel 2: Bestehende E-Mail als Newsletter verwenden

Eine bereits erstellte E-Mail-Vorlage soll als einmaliger Newsletter an eine Zielgruppe versendet werden.

Vorgehen:

1. Die E-Mail-Vorlage auf der E-Mail-Seite suchen und oeffnen.
2. Den Inhalt pruefen und ggf. aktualisieren.
3. Das Modal schliessen.
4. Zur Newsletter-Seite wechseln (Navigationspunkt "Newsletter").
5. Die E-Mail-Vorlage im Dropdown "E-Mail Vorlage" auswaehlen.
6. Tags, Versandzeitpunkt und Titel konfigurieren.
7. Den Newsletter speichern oder direkt aktivieren.

Beispiel 3: E-Mail-Vorlagen fuer verschiedene Abteilungen organisieren

Ein Unternehmen mit mehreren Abteilungen (Vertrieb, Support, Marketing) moechte die E-Mail-Vorlagen getrennt verwalten.

Vorgehen:

1. Drei Kategorien erstellen: "Vertrieb-E-Mails", "Support-E-Mails", "Marketing-E-Mails".
2. Bestehende und neue E-Mail-Vorlagen den passenden Kategorien zuordnen.
3. Ueber die Sichtbarkeitssteuerung koennen Administratoren festlegen, welche Kategorien fuer welche Benutzergruppen sichtbar sind.
4. Jede Abteilung sieht nur die fuer sie relevanten E-Mail-Vorlagen.