Einführung
EWM Modal CTA ist ein professionelles WordPress-Plugin, das die erweiterte Erstellung und Verwaltung interaktiver Modals ermöglicht. Es wurde für die Lead-Erfassung über mehrstufige Formulare und zur Anzeige dynamischer Anzeigen entwickelt, mit einer tiefen WooCommerce-Integration zur Umsatzsteigerung.
Zu seinen Hauptmerkmalen gehören ein Custom Post Type (ew_modal
) für eine organisierte Verwaltung, ein visueller, tab-basierter Builder, ein System zur automatischen Injektion von Modals ohne Shortcodes sowie eine auf Leistung und Sicherheit optimierte Architektur.
Installation und Erstellung
Plugin-Installation
1. Laden Sie die .zip
-Datei des EWM Modal CTA Plugins herunter.
2. Gehen Sie in Ihrem WordPress-Administrationsbereich zu Plugins > Neues Plugin hinzufügen.
3. Klicken Sie oben auf der Seite auf die Schaltfläche Plugin hochladen.
4. Wählen Sie die heruntergeladene .zip
-Datei aus und klicken Sie auf Jetzt installieren.
5. Nach der Installation klicken Sie auf Plugin aktivieren.
Ein neues Modal erstellen
Das Erstellen eines Modals ist dank des visuellen Builders ein zentralisierter Prozess:
1. Gehen Sie im Administrationsmenü zu EWM Modals > Modal Builder.
2. Wenn es ein neues Modal ist, werden Sie zum Builder weitergeleitet. Wenn Sie ein bestehendes bearbeiten möchten, gehen Sie zu EWM Modals > Alle Modals und klicken Sie auf “Bearbeiten”.
3. Der Builder verwendet ein Tab-System, um alle Aspekte des Modals zu konfigurieren.
Verwendung des Modal Builders
Der visuelle Builder ist das Herzstück des Plugins und ermöglicht Ihnen die intuitive Konfiguration jedes Details Ihres Modals.
Tab ‘Allgemein’
Hier definieren Sie die Basiskonfiguration des Modals:
- Modal-Titel: Der interne Titel zur Identifizierung Ihres Modals im Admin-Bereich.
- Modal-Modus: Wählen Sie zwischen “Mehrstufiges Formular” (zur Datenerfassung) oder “Ankündigung/Benachrichtigung” (zur Anzeige einer einfachen Nachricht).
- Modal aktiv: Aktiviert oder deaktiviert das Modal global.
- Globale Konfiguration verwenden: Ermöglicht die automatische Anzeige des Modals gemäß den Regeln der Tabs “Trigger” und “Erweitert”. Wenn deaktiviert, funktioniert es nur mit Shortcode.
Tab ‘Schritte und Felder’
Dieser Bereich ermöglicht Ihnen die Erstellung des Modal-Inhalts:
- Schritte hinzufügen: Für Formular-Modals können Sie mehrere Schritte erstellen, um die Datenerfassung aufzuteilen. Jeder Schritt hat seinen eigenen Titel, Untertitel und Beschreibung.
- Felder hinzufügen: Innerhalb jedes Schritts können Sie Formularfelder wie Text, E-Mail, Telefon, Textbereich, Auswahlen, Radio-Buttons und Checkboxes hinzufügen.
- Erfolgsmeldungen: Konfigurieren Sie den Titel und die Nachricht, die dem Benutzer nach erfolgreichem Ausfüllen des Formulars angezeigt werden.
Tab ‘Design’
Passen Sie das Erscheinungsbild Ihres Modals an:
- Modal-Größe: Definieren Sie die Breite des Modals (Klein, Mittel, Groß).
- Animation: Wählen Sie die Eingangs-Animation (Einblenden, Schieben, Zoomen).
- Farben: Wählen Sie Primär-, Sekundär- und Hintergrundfarben, die zu Ihrer Markenidentität passen.
Anzeige und Trigger
Steuern Sie, wo, wann und wie Ihre Modals erscheinen.
Anzeigeregeln (Tab ‘Erweitert’)
Definieren Sie die Bedingungen für die automatische Injektion:
- Zielgeräte: Wählen Sie, ob das Modal auf Desktop, Tablet oder Mobilgeräten angezeigt werden soll.
- Zielseiten: Schließen Sie das Modal auf spezifischen Seiten ein oder aus (Startseite, Blog, bestimmte Seiten).
- Benutzerrollen: Zeigen Sie das Modal nur bestimmten Benutzerrollen an (z.B. alle, nur Besucher, nur Administratoren).
- Auf WC-Seiten weglassen: Verhindert, dass allgemeine Modals auf WooCommerce-Produkt- oder Kategorieseiten erscheinen, um spezifische Werbeaktionen nicht zu stören.
Trigger-Einstellungen (Tab ‘Trigger’)
Definieren Sie die Aktionen, die das Modal auslösen:
- Exit Intent: Wird angezeigt, wenn der Benutzer versucht, die Seite zu verlassen.
- Zeitverzögerung: Erscheint nach einer bestimmten Anzahl von Sekunden.
- Scroll-Trigger: Wird aktiviert, wenn der Benutzer einen bestimmten Prozentsatz der Seite gescrollt hat.
- Manueller Trigger: Ermöglicht die Aktivierung des Modals durch einen Klick auf ein spezifisches Element (mit
data-ewm-modal="ID"
). - Anzeigehäufigkeit: Steuert, wie oft derselbe Benutzer das Modal sieht (immer, einmal pro Sitzung, pro Tag usw.).
Verwendung von Shortcodes
Für die manuelle Steuerung können Sie das Modal an beliebiger Stelle in Ihrem Inhalt mithilfe seines Shortcodes einfügen. Nach dem Speichern eines Modals wird ein einzigartiger Shortcode generiert, den Sie kopieren und einfügen können.
Beispiel: [ew_modal id="123"]
WooCommerce-Integration
EWM Modal CTA bietet spezifische Funktionen zur Verbesserung der Konversionen in WooCommerce-Shops.
Aktivierung und Einrichtung
1. Aktivieren Sie im Tab Allgemein des Builders das Kontrollkästchen “WooCommerce-Integration”.
2. Dies aktiviert einen neuen Tab namens WooCommerce und passt die Benutzeroberfläche zur Erstellung eines Werbe-Modals an.
3. Im Tab WooCommerce können Sie einen vorhandenen Rabattgutschein aus Ihrem Shop auswählen.
Ein Werbe-Modal erstellen
Sobald die Integration aktiviert ist:
- Gutschein-Auswahl: Wählen Sie einen Gutschein aus, und das Plugin zeigt dessen Details an.
- Inhalt der Aktion: Verfassen Sie einen Titel und eine Beschreibung für das Angebot. Sie können die Schaltfläche “Automatisch ausfüllen” verwenden, um Text basierend auf den Gutscheindetails zu generieren.
- Dringlichkeits-Timer: Aktivieren Sie einen Countdown-Timer, um ein Gefühl der Dringlichkeit zu erzeugen und zum Kauf zu motivieren.
- Gutschein automatisch anwenden: Konfigurieren Sie die CTA-Schaltfläche so, dass der Gutschein dem Warenkorb hinzugefügt und der Benutzer weitergeleitet wird.
Diese Modals sind so konzipiert, dass sie auf Produktseiten erscheinen und Konflikte vermeiden, z.B. werden sie nicht angezeigt, wenn ein ähnlicher Gutschein bereits angewendet wurde.
Verwaltung der Übermittlungen
Alle über die Modal-Formulare übermittelten Daten werden sicher gespeichert und können einfach verwaltet werden.
1. Gehen Sie im Administrationsmenü zu EWM Modals > Übermittlungen.
2. Sie sehen eine Liste aller Übermittlungen. Jeder Eintrag zeigt die übermittelten Daten, das Quell-Modal und die Seite, von der das Formular gesendet wurde.
3. Sie können auf jede Übermittlung klicken, um die vollständigen Details anzuzeigen.
Erweiterte Funktionen
Sicherheit und Sanitization
Das Plugin implementiert ein benutzerdefiniertes Sanitization-System, das vor XSS-Angriffen schützt, ohne das für die korrekte Funktion der Formulare und des Modal-Inhalts notwendige HTML zu entfernen. Alle Eingaben werden validiert und der Inhalt der Felder sicher bereinigt.
Leistung
EWM Modal CTA ist optimiert, um die Geschwindigkeit Ihrer Website nicht zu beeinträchtigen. Skripte und Stile werden nur auf Seiten geladen, auf denen ein aktives Modal vorhanden ist, dank eines intelligenten Erkennungssystems, das sowohl mit Shortcodes als auch mit der automatischen Injektion funktioniert.
REST API
Das Plugin stellt mehrere Endpunkte in der WordPress REST API bereit für Funktionen wie das Absenden von Formularen vom Frontend, das Abrufen von Benutzerdaten zum automatischen Ausfüllen und die Abfrage der Sichtbarkeit von WooCommerce-Modals. Dies ermöglicht erweiterte Integrationen und einen entkoppelten (Headless-)Betrieb.