> ## Knowledge Base Index > Fetch the complete knowledge base index at: https://help.hoppyapps.com/sitemap.xml > Use this file to discover available pages before exploring further. > Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash). # 🎯 Wie man Discount PopUps einrichtet > ℹ️ **Note:** Dieser Artikel wurde automatisch mit AI übersetzt und kann Ungenauigkeiten enthalten. Wenn etwas falsch aussieht, kontaktieren Sie bitte unser Support-Team. Möchten Sie Ihren Besuchern sofortige Rabatte durch ein schlankes Popup anbieten? 🛍️ Discount PopUps eignen sich perfekt zum Teilen von Gutscheincodes, zum Sammeln von E-Mails und zum Begrüßen von neuen und wiederkehrenden Kunden mit Sonderangeboten. Dieser Leitfaden führt Sie durch den gesamten Setup-Flow, sodass Sie Ihr erstes Discount-PopUp in wenigen Minuten starten können. --- # **✅ Bevor Sie beginnen - Aktivieren Sie die App Embed** Damit ein Popup auf Ihrer Storefront erscheint, muss das App-Embed in Ihrem Shopify Thema. Gehen Sie zu: **Shopify Admin → Sales Channels → Online Store → Themes → Edit Theme → App Embeds** Dann: * Finde **Hoppy Popups** * Umschalten **IN** * Klicken **Sparen** ℹ️ Ohne diesen Schritt wird Ihr Popup auch nach der Veröffentlichung nicht auf der Storefront rendern. --- # **⚙️ Schritt 1 - Erstellen Sie ein neues Discount PopUp** Offen **Hoppy PopUps** App. Dann: → Klicken **Erstellen Sie ein neues PopUp** → auswählen **Rabatt PopUp** Aus der Liste der Popup-Typen. Die Setup-Seite wird automatisch mit Feldern geöffnet, die auf Rabattkampagnen zugeschnitten sind. --- # **📝 Schritt 2 - Konfigurieren Sie den Inhalt** Nach dem Öffnen der Setup-Seite landen Sie in der **Inhalt** Tab. Dieser Abschnitt steuert, was Ihre Besucher sehen und wie sie mit dem Popup interagieren. --- ## **🏷️ PopUp Name** Dieses Feld wird nur für interne Zwecke verwendet. Kunden werden diesen Namen nie sehen. Sie können jeden erkennbaren Namen verwenden wie: * Sommerverkauf PopUp * Black Friday Discount * Willkommensangebot * VIP Code Drop 💡 Mit der richtigen internen Benennung können Sie Setups später leichter identifizieren, insbesondere wenn Ihr Shop mehrere Kampagnen ausführt. --- ## **💬 Titel und Beschreibung** Diese erscheinen oben in Ihrem Popup und sollten das Angebot klar kommunizieren. ### **Beispiel** * **Titel:** "Genießen Sie 20% Rabatt auf alle Produkte" * **Beschreibung:** "Sign up und entsperren Sie Ihren sofortigen Rabatt" Sie können diese an Ihre Kampagnenstimme anpassen. --- ## **📧 E-Mail & Telefonsammlung** Wählen Sie aus, welche Felder in Ihrem Popup angezeigt werden sollen: * **E-Mail-Sammelfeld anzeigen** - erfasst Besucher-E-Mails * **Telefonnummer anzeigen Feld** — erfasst Telefonnummern mit Ländercode-Auswahl Sie können beide anzeigen, nur eine oder keine, wenn sie nur eine ankündigung anzeigen. --- ## **⚙️ Zusätzliche Collection & Coupon Einstellungen** In diesem Abschnitt erhalten Sie zusätzliche Kontrolle darüber, wie Besucherinformationen gesammelt werden und wie Rabatte im Popup präsentiert werden. --- ### **📩 E-Mail Collection Field Platzhalter** Passen Sie den Platzhaltertext an, der im E-Mail-Eingabefeld angezeigt wird. ### **Beispiel** * „Geben Sie Ihre E-Mail ein * "Ihre beste E-Mail-Adresse" Dies hilft den Besuchern zu zeigen, welche Informationen sie eingeben sollten. --- ### **❌ E-Mail Fehlermeldung** Stellen Sie die Validierungsnachricht ein, die angezeigt wird, wenn ein Besucher eine ungültige E-Mail-Adresse eingibt. ### **Beispiel** * "Bitte geben Sie eine gültige E-Mail-Adresse ein" Dies wird automatisch angezeigt, wenn das eingegebene E-Mail-Format falsch ist. --- ### **📱 Standard-Ländercode** Wählen Sie den Standard-Ländercode für das Feld Telefonnummer. ### **Beispiel** * Vereinigte Staaten (+1) * Vereinigtes Königreich (+44) * Indien (+91) Besucher können das Land weiterhin manuell ändern, sofern nicht eingeschränkt. --- ### **📞 Telefonnummer Platzhalter** Passen Sie den Platzhaltertext an, der im Feld Telefonnummer angezeigt wird. ### **Beispiel** * "Geben Sie Ihre Telefonnummer ein" * "Mobilfunknummer" Dies verbessert die Klarheit und fördert die richtige Formatierung. --- ### **⚠️ Telefonnummer Fehlermeldung** Stellen Sie die Nachricht ein, die angezeigt wird, wenn eine ungültige Telefonnummer eingegeben wird. ### **Beispiel** * "Bitte geben Sie eine gültige Telefonnummer ein" Dies hilft den Besuchern zu verstehen, warum die Einreichung fehlgeschlagen ist. --- ### **🔘 Knopftext** Passen Sie den Call-to-Action-Buttontext an, der im Popup angezeigt wird. ### **Beispiel** * "Jetzt einkaufen" * "Anspruchsrabatt" * "Entsperrungsangebot" Die Verwendung von aktionsorientiertem Text kann die Conversions verbessern. --- ### **🏷️ Coupon Code anzeigen** Wählen Sie aus, ob der Gutscheincode nach erfolgreicher E-Mail-Erfassung im Popup erscheinen soll. verfügbare Optionen: * **Ja** - zeigt den Coupon-Code den Besuchern an * **Nein** - verbirgt den Coupon-Code-Abschnitt Dies ist nützlich, wenn Rabatte automatisch angewendet oder extern behandelt werden. ℹ️ Der Gutscheincode kann nur angezeigt werden, wenn die E-Mail erfasst wird. --- ### **🎟️ Couponcode** ℹ️ Dieses Feld ist einmal verfügbar **Coupon Code anzeigen** ist umgeschaltet auf **JA**. Um einen Gutscheincode anzuzeigen, können Sie entweder: 1. Wählen Sie einen der Coupon-Codes, die Sie erstellt haben Shopify Admin → Rabatte durch Klicken auf Select/Change Discount. 2. Sie können eine neue erstellen, indem Sie auf **Erstellen Sie einen neuen Discount**. ### **Beispiel** * SAVE10 * WELCOME20 * COUPON123 ### **💸 Rabattantrag** Diese Option steuert, wie der Rabatt angewendet wird. Es hat zwei Möglichkeiten: 1. **Der Kunde muss den Rabatt manuell anwenden** — Der Kunde muss den Gutscheincode während des Checkouts eingeben, um den Rabatt zu erhalten. 2. **Rabatt automatisch anwenden** Der Rabatt wird automatisch während des Checkouts angewendet, ohne dass der Kunde den Couponcode eingeben muss. ⚠️ **Wichtig:** * Unsere App erstellt oder verwaltet keine Gutscheincodes / Rabatte. Sie müssen sie in Shopify Admin → Rabatte, bevor Sie sie im Popup verwenden. --- ### **☑️ Opt-In Checkbox hinzufügen** Wählen Sie aus, ob Sie eine zusätzliche Opt-in-Checkbox im Popup anzeigen möchten. Dies kann verwendet werden für: * Genehmigung des Inverkehrbringens * SMS Zustimmung * Newsletter-Abonnements * Bestätigung der Bedingungen verfügbare Optionen: * **Ja** — Zeigt die Checkbox an * **Nein** - versteckt die Checkbox --- ### **❎ Close Icon** Aktivieren oder deaktivieren Sie das Close-Symbol, das im Popup angezeigt wird. * **Aktiviert** Besucher können das Popup manuell schließen * **Behinderte** — Entfernen des Close-Icons aus dem Popup Dies hilft zu kontrollieren, wie ablehnbar das Popup-Erlebnis sein sollte. --- ## **✉️ Erfolgsmeldungen** Nachdem ein Besucher seine Daten eingereicht hat, können Sie verschiedene Nachrichten anzeigen, je nachdem, ob es sich um einen neuen oder wiederkehrenden Kunden handelt. * **Nachricht für neue Kunden:** "Willkommen in unserem Laden!" * **Nachricht für wiederkehrende Kunden:** Willkommen zurück! Sie können auch eine Beschreibung unter jeder Nachricht hinzufügen - zum Beispiel Anweisungen zur Verwendung des Coupon-Codes, den sie gerade erhalten haben. --- ## **🖱️ Button Click Verhalten** ℹ️ Diese Option ist nur verfügbar, wenn "E-Mail-Feld anzeigen" und "Telefonnummernfeld anzeigen" nicht aktiviert sind. Sie können steuern, was passiert, wenn ein Besucher im Popup auf die CTA-Taste klickt. Es behandelt eine der folgenden Aufgaben: 1. **Popup schließen** Das Popup wird geschlossen 2. **Reveal Coupon Code** - Der Coupon-Code wird dem Besucher bekannt gegeben, aber Sie haben den Coupon-Code wie oben im Abschnitt "Coupon-Code anzeigen" beschrieben eingerichtet. 3. **Weiterleitung zum Link** Wenn Sie dies auswählen, erhalten Sie ein Eingabefeld namens "Link", in dem Sie die URL angeben können, zu der der Besucher umgeleitet wird --- ## **☁️ Floating Action Button** Sie können eine **Floating Action Button** das auf der Seite sichtbar bleibt, so dass Besucher das Popup nach dem Schließen wieder öffnen können. Wählen Sie eine Position: * **Rechts unten rechts** * **Unten links** * **Bildschirm rechts** * **Bildschirm links** Dann treten Sie ein **Knopftext** - z.B. "Open Offer", "Get Discount" oder "Learn More". Um den Floating Button vollständig zu deaktivieren, wählen Sie **Deaktivieren des Floating Action Buttons**. --- # **🖱️ Schritt 3 — Setzen Sie die Trigger & Display Regeln** Umzug in die **Platzierung/Zielsetzung** Registrieren Sie, wann und wo Ihr Discount PopUp erscheint. --- ## **⏱️ Triggertyp** Dies entscheidet darüber, welches Ereignis das Popup zeigt. verfügbare Optionen: * **Nach der Zeit (Dauer)** - erscheint nach einer festgelegten Anzahl von Sekunden * **Seite Scroll** - erscheint, nachdem der Besucher einen bestimmten Prozentsatz scrollt * **Ausstiegsabsicht** - erscheint, wenn der Besucher kurz davor ist zu gehen * **Add to Cart Button wird angeklickt** - erscheint, wenn ein Artikel zum Warenkorb hinzugefügt wird * **Nach Seitenaufrufen —** Dies löst aus, sobald eine bestimmte Anzahl von Seiten besucht wurde. Wählen Sie den Auslöser, der am besten zu Ihrem Besucherverhalten passt. --- ## **🔄 Anzeigefrequenz** Kontrollieren Sie, wie oft derselbe Besucher das Popup sieht: * **Jedes Mal zeigen** Anzeigen auf jeder Seite laden * **Jedes Mal, wenn jemand zu Besuch ist** - zeigt einmal pro Browsersitzung * **Grenzfrequenz** - können Sie eine Abklingzeit in Tagen einstellen, bevor das Popup wieder erscheint 💡 Das Popup wird automatisch nicht mehr angezeigt, nachdem ein Besucher das Formular eingereicht hat. --- ## **📍 Page Targeting** Entscheiden Sie, auf welchen Seiten Ihr Discount PopUp erscheinen soll: * **Auf jeder Seite anzeigen** * **Nur auf der Homepage anzeigen** * **Auf allen Produktseiten anzeigen** * **Anzeigen auf bestimmten Produktseiten** * **Alle Produkte in spezifischen Kollektionen** * **Auf allen Sammlungsseiten anzeigen** * **Anzeigen auf bestimmten Sammlungsseiten** * **Alle Produkte mit spezifischen Tags** Wenn Sie eine bestimmte Option auswählen, verwenden Sie die Picker- oder Tag-Eingabe, um Ihre Auswahl abzuschließen. --- # **👥 Schritt 4 — Konfigurieren von Customer & Location Targeting** Noch im Inneren des **Platzierung/Zielsetzung** Tab, Feinabstimmung, wer dein Popup sieht. --- ## **📱 Sichtbarkeit des Geräts** Wählen Sie, auf welchen Geräten Ihr Popup erscheinen soll: * **Desktop und Mobile** * **Nur Desktop** * **Nur mobil** --- ## **🔐 Kunden Login Status** * **Alle Kunden zeigen** * **Nur für angemeldete Kunden anzeigen** --- ## **🏷️ Customer Tags & Lifetime Spent** Sie können die Sichtbarkeit weiter einschränken, indem Sie: * **Zielkunden basierend auf Customer Tag** - z. B. nur für Kunden anzeigen Tagged `VIP` oder `wholesale` * **Zielkunden basierend auf Lebenszeit** Zeigen Sie nur Kunden, die über einen bestimmten Betrag ausgegeben haben Sie können auch **Häute** das Popup von bestimmten Tags oder Ausgabenschwellen, falls erforderlich. --- ## **🌍 Geolocation Targeting** * **Alle Welten** — keine Beschränkungen * **Spezifische Länder** Wählen Sie nur die Länder aus, in denen das Popup angezeigt werden soll --- ## **🔗 Zugelassene UTM-Quellen** Aktivieren Sie dies, wenn das Popup nur für Besucher aus bestimmten Verkehrsquellen angezeigt werden soll. Unterstützte Plattformen: * TikTok * Facebook * Instagram * Google * Pinterest * Twitter * **UTM-Code** - Geben Sie Ihre eigenen UTM-Parameter ein ⚠️ Wenn aktiviert, werden Besucher, die direkt ankommen (ohne übereinstimmende UTM-Parameter), das Popup nicht sehen. --- # **📅 Schritt 5 — Terminplanung (optional)** Wenn Sie möchten, dass Ihr Discount-PopUp nur während eines bestimmten Zeitraums läuft, erweitern Sie die **Zeitplanung** Abschnitt innerhalb der Registerkarte Platzierung / Ziel. Set: * **Startdatum** Wann sollte das Popup anfangen zu zeigen * **Enddatum** - wenn das Popup automatisch nicht mehr angezeigt wird Wenn leer gelassen, läuft das Popup kontinuierlich einmal veröffentlicht. --- # **🎨 Schritt 6 - Entwerfen Sie Ihr PopUp (optional)** Wechsel zum **Design** Tab zur Anpassung: * Popup-Position (Mitte, Ecken) * Größe und Animation * Hintergrundfarben, Farbverläufe oder Bilder * Fonts, Button Styles und Eckradius 💡 Sie können diesen Schritt überspringen, wenn der Standard-Look bereits zu Ihrem Shop passt. Eine vollständige Übersicht über alle Designoptionen finden Sie in der dedizierten Design & Styling-Dokumentation. --- # **✅ Schritt 7 — Speichern und Veröffentlichen** Sobald alles gut aussieht: 1. Klicken **Sparen** um Ihre Konfiguration zu speichern 2. Klicken **Veröffentlichen** Um das Popup live auf Ihrer Storefront zu machen ⚠️ **Sparen allein macht das Popup für Kunden nicht sichtbar.** Sie müssen es veröffentlichen. Wenn das App-Embed noch nicht aktiviert ist, wird ein Banner Sie daran erinnern, es in Ihrem Shopify Theme Editor. --- # **🎉 Endergebnis** Einmal erfolgreich konfiguriert: ✅ Besucher sehen Ihr Rabattangebot im richtigen Moment ✅ E-Mails und Telefonnummern werden automatisch erfasst ✅ Coupon-Codes werden nach der Übermittlung angezeigt ✅ Verschiedene Nachrichten begrüßen neue vs wiederkehrende Kunden ✅ Ihr Popup respektiert Targeting-Regeln, Planung und Geräteeinstellungen Ihr Discount PopUp ist jetzt live und bereit, Ihre Besucher zu belohnen 🚀 ---