# Popup Pro Newsletter — Vollständige Anleitung
> Popup Pro Newsletter zeigt in Ihrem Shopware-Shop ein Newsletter-Anmelde-Popup, das jeden neuen Abonnenten mit einem für die erste Bestellung gültigen Gutscheincode belohnt. Das Ziel ist zweierlei: Ihre Verteilerliste vergrößern und…
- Seite:
- Sprache: de
- Aktualisiert am: 2026-06-17
- Weitere Sprachen: [fr](https://www.datafirefly.com/documentation/popup-pro-newsletter/index.md), [en](https://www.datafirefly.com/en/documentation/popup-pro-newsletter/index.md), [es](https://www.datafirefly.com/es/documentation/popup-pro-newsletter/index.md), [it](https://www.datafirefly.com/it/documentation/popup-pro-newsletter/index.md), [pl](https://www.datafirefly.com/pl/documentation/popup-pro-newsletter/index.md), [nl](https://www.datafirefly.com/nl/documentation/popup-pro-newsletter/index.md), [pt](https://www.datafirefly.com/pt/documentation/popup-pro-newsletter/index.md)
- Index:
Popup Pro Newsletter zeigt in Ihrem Shopware-Shop ein Newsletter-Anmelde-Popup, das jeden neuen Abonnenten mit einem für die erste Bestellung gültigen Gutscheincode belohnt. Das Ziel ist zweierlei: Ihre Verteilerliste vergrößern und einen Erstkauf auslösen. Das Plugin setzt ausschließlich auf das **native Promotion-System von Shopware** — es wird keine eigene Datenbank-Entity angelegt — und bietet zwei Code-Modi (individuell pro Abonnent oder fest), einen Rabatt wahlweise prozentual oder als Festbetrag, Zeit- und Scroll-Trigger sowie die Anmeldung über die offizielle Newsletter-Route mit optionalem, DSGVO-konformem Double-Opt-In. Dieser Leitfaden behandelt Installation, Konfiguration, Funktionsweise der Gutscheincodes, Anpassung und Fehlerbehebung. Kompatibel mit Shopware 6.6 und 6.7.
Seit 6.6 kompiliert das Shopware-Storefront das Plugin-JavaScript nicht mehr zur Laufzeit. Das ZIP, das Sie installieren, **muss den vorkompilierten JS-Ordner dist/ enthalten**. Das von DataFirefly ausgelieferte ZIP enthält ihn bereits; wenn Sie das Plugin selbst neu bauen, lesen Sie den Abschnitt Installation aufmerksam.
## So funktioniert der Gutscheincode
Bei der allerersten Anmeldung eines Besuchers legt das Plugin automatisch eine **Shopware-Promotion** namens „Popup Newsletter — Welcome" an, die dem aktuellen Verkaufskanal zugewiesen ist und den in der Konfiguration definierten Rabatt trägt. Anschließend bei jeder Anmeldung:
- im Modus **individueller Code** (empfohlen) wird ein persönlicher Code on-the-fly erzeugt und über die nativen _individuellen Promotion-Codes_ von Shopware an die Promotion gebunden und an den Besucher zurückgegeben: nicht teilbar, nachverfolgbar und auf eine Einlösung begrenzbar;
- im Modus **fester Code** trägt die Promotion einen einzigen öffentlichen Code (z. B. `WELCOME10`), der allen Abonnenten angezeigt wird.
Die Promotion bleibt unter **Marketing → Aktionen** voll steuerbar: Gültigkeitszeitraum, Bedingungen, erweiterte Regeln. Um das Angebot der allerersten Bestellung vorzubehalten, lassen Sie die Option „eine Einlösung pro Kunde" aktiviert; für eine striktere Steuerung fügen Sie direkt an der Promotion eine Shopware-Regel hinzu (z. B. „Anzahl der Bestellungen des Kunden = 0").
## Installation
1. Laden Sie das Archiv `DataFireflyPopupProNewsletter-v1.0.0.zip` aus Ihrem DataFirefly-Konto herunter.
2. Installieren Sie es über **Administration → Erweiterungen → Meine Erweiterungen → Erweiterung hochladen** oder kopieren Sie den entpackten Ordner nach `custom/plugins/`.
3. Installieren und aktivieren Sie das Plugin: ``` bin/console plugin:refresh bin/console plugin:install --activate DataFireflyPopupProNewsletter bin/console cache:clear ```
4. Kompilieren Sie das Theme, um die Popup-Styles einzubinden: ``` bin/console theme:compile ```
`theme:compile` ist reines PHP: es funktioniert auf Shared-Hosting. Der **JavaScript-Build** (`build-storefront.sh`) hingegen benötigt Node und viel Arbeitsspeicher — er ist nicht für Shared-Hosting gedacht. Deshalb wird das JS vorkompiliert im ZIP ausgeliefert: Sie müssen den Build niemals auf Ihrem Produktionsserver ausführen.
### Wenn Sie das Plugin selbst neu bauen
Auf einer vollständigen Shopware-Entwicklungsinstallation wird das JS so kompiliert:
```
bin/console plugin:refresh
bin/console plugin:install --activate DataFireflyPopupProNewsletter
bash bin/build-storefront.sh
```
Dies erzeugt `src/Resources/app/storefront/dist/storefront/js/data-firefly-popup-pro-newsletter/data-firefly-popup-pro-newsletter.js`. Zippen Sie das Plugin **mit** diesem `dist/`-Ordner erneut, bevor Sie es in die Produktion ausrollen.
## Konfiguration
Öffnen Sie **Erweiterungen → Meine Erweiterungen → Popup Pro Newsletter → ⋯ → Konfigurieren**. Die Einstellungen sind in Karten gegliedert.
### Allgemein
- **Popup aktivieren**: schaltet die Anzeige vollständig ein oder aus.
### Anzeige
- **Anzeige nach Verzögerung (Sekunden)**: das Popup erscheint nach X Sekunden. `0` deaktiviert diesen Trigger.
- **Anzeige nach Scrollen (% der Seite)**: das Popup erscheint, sobald dieser Scroll-Prozentsatz erreicht ist. `0` deaktiviert diesen Trigger.
- **Nicht erneut anzeigen für (Tage)**: Anzeigefrequenz pro Besucher, browserseitig gespeichert.
- **Für eingeloggte Kunden ausblenden**: zeigt das Popup bereits eingeloggten Kunden nicht an.
Beide Trigger (Verzögerung und Scroll) sind kumulativ: Das Popup erscheint, sobald der _erste_ der beiden erfüllt ist. Für einen reinen Scroll-Trigger setzen Sie die Verzögerung auf `0` und umgekehrt.
### Inhalt
Titel, Untertitel, Platzhalter des E-Mail-Felds, Button-Text, Erfolgsmeldung (verwenden Sie den Platzhalter `%code%`, um den Code einzufügen), Hinweismeldung bei ausstehender Bestätigung (Double-Opt-In), optionale Bild-URL und Akzentfarbe. Alle diese Texte sind editierbar und übersetzbar.
### Gutscheincode
- **Code-Modus**: `individuell` (empfohlen) oder `fest`.
- **Fester Code / Präfix**: der öffentliche Code im festen Modus oder das Präfix der individuellen Codes im individuellen Modus.
- **Rabattart und -wert**: prozentual oder Festbetrag, frei wählbarer Wert.
- **Eine Einlösung pro Kunde**: begrenzt die Promotion auf eine einzige Einlösung, um das Angebot der ersten Bestellung vorzubehalten.
- **Double-Opt-In**: sendet eine Bestätigungs-E-Mail, bevor der Code ausgegeben wird.
## Double-Opt-In und DSGVO
Die Anmeldung läuft über die offizielle Newsletter-Route von Shopware (`NewsletterSubscribeRoute`), was die Synchronisation mit Ihren bestehenden Empfängern sicherstellt. Wenn Double-Opt-In aktiviert ist, erhält der Besucher seinen Code erst nach Bestätigung seiner Adresse per E-Mail; in der Zwischenzeit wird die anpassbare Hinweismeldung im Popup angezeigt. Es werden keine Drittanbieter-Cookies verwendet: die „Nicht erneut anzeigen"-Speicherung erfolgt browserseitig über `localStorage`.
Double-Opt-In wird für die DSGVO-Konformität empfohlen: es belegt die ausdrückliche Einwilligung des Abonnenten. Sie können es jederzeit in der Konfiguration aktivieren oder deaktivieren.
## Das Popup anpassen
Das Markup ist in `views/storefront/component/datafirefly/popup-newsletter.html.twig` isoliert und wird aus `views/storefront/base.html.twig` im Block `base_body` eingebunden. Um die Popup-Struktur zu ändern, überschreiben Sie dieses Template in Ihrem Theme. Die Styles liegen in `app/storefront/src/scss/base.scss`, und die Akzentfarbe wird über die CSS-Variable `--df-popup-accent` gesteuert, die wiederum von der Einstellung „Akzentfarbe" der Konfiguration gespeist wird. Das Verhalten (Trigger, AJAX, Code-Kopie) übernimmt das Storefront-Plugin `PopupNewsletterPlugin`.
## FAQ und Fehlerbehebung
**Das Popup erscheint überhaupt nicht.** In nahezu allen Fällen fehlt das vorkompilierte JavaScript: prüfen Sie, ob das installierte ZIP den Ordner `dist/` enthält, führen Sie dann `theme:compile` aus und leeren Sie den Cache. Untersuchen Sie die Seite: das Element `.df-popup-newsletter` sollte mit dem Attribut `hidden` im DOM vorhanden sein — das JS macht es sichtbar.
**Ich habe es einmal geschlossen und es kommt nicht wieder.** Das ist das erwartete Verhalten: das Plugin merkt sich das Schließen für die konfigurierte Anzahl von Tagen über den Schlüssel `dfPopupNewsletterDismissedAt` im `localStorage`. Zum erneuten Testen öffnen Sie ein privates Browserfenster oder leeren Sie den lokalen Speicher des Browsers.
**Das Popup erscheint, aber ohne Styles.** Das Theme wurde nicht neu kompiliert: führen Sie `bin/console theme:compile` aus.
**Der Code wird nicht auf den Warenkorb angewendet.** Prüfen Sie unter **Marketing → Aktionen**, ob die Promotion „Popup Newsletter — Welcome" aktiv, dem richtigen Verkaufskanal zugewiesen und innerhalb ihres Gültigkeitszeitraums ist. Im individuellen Modus prüfen Sie, ob der individuelle Code nicht bereits verwendet wurde.
**Was passiert bei der Deinstallation?** Die Promotion und alle ausgegebenen Codes bleiben bewusst erhalten, um im Umlauf befindliche Codes bei Ihren Kunden nicht zu entwerten. Entfernen Sie sie bei Bedarf manuell unter Marketing → Aktionen.
**Verlangsamt das Plugin meinen Shop?** Nein: keine eigene Entity, keine zusätzliche Abfrage beim Laden der Seiten, eine einzige schlanke JS-Datei und das in Ihr Theme kompilierte SCSS.