> ## 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 Countdown Timer 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 Ihrer Storefront Dringlichkeit verleihen und den Kunden helfen, Maßnahmen zu ergreifen, bevor die Zeit abläuft? ⏳ Das ist genau das, was die **Hoppy Countdown Timer** ist gebaut für. Mit dieser App können Sie Countdown-Timer erstellen für: * 🛍️ **Produktseiten** - Zeigen Sie die Dringlichkeit direkt auf den Produktdetailseiten * 🛒 **Warenkorbseite & Warenkorbschublade** - Ermutigen Sie Käufer, den Checkout abzuschließen * 💳 **Checkout Seite** - Fügen Sie die Dringlichkeit im letzten Schritt hinzu (Shopify Nur plus * 🌐 **Top / Bottom Banner** Anzeige einer Site Wide Countdown Bar * 📄 **Landing Page & Custom Positionen** - Zielspezifische Sammlungen oder benutzerdefinierte Platzierungen Dieser Leitfaden führt Sie durch die wichtigsten Setup-Schritte, damit Sie Ihren ersten Countdown-Timer schnell live erhalten können 🚀 --- # **📍 Verfügbare Countdown-Typen** Abhängig von Ihrer Kampagne können Sie aus mehreren Timer-Verhalten wählen: * **Countdown bis zum Datum** - Endet zu einem bestimmten Datum und einer bestimmten Uhrzeit * **Feste Minuten** — Ein Countdown in fester Länge für jede Besuchersitzung * **Täglich wiederkehrender Timer** Wiederholt sich an ausgewählten Tagen (z. B. jeden Wochentag von 9 bis 11 Uhr) * **Intervallzeitgeber** Mehrere geplante Start- und Endzeiten (bis zu 7 Intervalle) * **Sitzungs-Timer** - Ein einzigartiger Countdown, der für jeden Besucher frisch beginnt Der Typ, den Sie auswählen, ändert, welche Timing-Optionen in Ihrem Setup angezeigt werden. --- # **⚠️ Bevor Sie beginnen** Bevor Sie einen Countdown-Timer erstellen, stellen Sie sicher: * Die **Hoppy Countdown Timer** Die App ist auf Ihrem Shopify Lager * Sie haben Zugriff auf Ihre **Shopify Admin** ### **Aktivieren Sie die App Embed** Damit Countdown-Timer auf Ihrer Storefront erscheinen, muss das App-Embed in Ihrem Shopify Thema. Gehen Sie zu: **Shopify Admin → Sales Channels → Online Store → Themes → Edit Theme → App Embeds** Dann: * Finde **Countdown-Timer** * Umschalten **IN** * Klicken **Sparen** 💡 Wenn Sie diesen Schritt überspringen, ist Ihr veröffentlichter Countdown-Timer auf der Storefront nicht sichtbar. --- ### **Shopify Plus Anforderung für Checkout** Wenn Sie einen Countdown-Timer auf dem **Checkout Seite**Ihr Geschäft muss auf einem **Shopify Plus** Plan. Non-Plus-Shops sehen eine Planwarnung, wenn Sie versuchen, einen Checkout-Seiten-Countdown zu erstellen. --- # **🛠️ Schritt 1 - Erstellen Sie einen neuen Countdown-Timer** Offen **Hoppy Countdown Timer** App von Deiner Shopify Admin. Dann: → Klicken **Erstellen Sie einen neuen Countdown** → Wählen Sie die **Platzierungsart** Das passt dorthin, wo der Timer erscheinen soll: * **Produktseite** * **Warenkorbseite** * **Warenkorbschublade** * **Checkout Seite** ()Shopify Nur plus * **Top / Bottom Banner** * **Landing Page** * **Zollstelle** Einmal ausgewählt, öffnet sich der Setup-Editor automatisch mit Standardeinstellungen, die auf diese Platzierung zugeschnitten sind. --- # **⚙️ Schritt 2 — Konfigurieren Sie den Inhalt Tab** Nach dem Öffnen der Setup-Seite landen Sie in der **Inhalt** Tab. Diese Registerkarte steuert: * 🏷️ Countdown Name und Messaging * ⏱️ Countdown Typ und Timing * 🔚 Was passiert, wenn der Timer endet * 🌍 Übersetzungen (für unterstützte Placements) --- ## **🏷️ Countdown Name** Dieses Feld wird verwendet für **Interne Referenz nur** Kunden werden es nie sehen. Verwenden Sie einen erkennbaren Namen wie: * Sommerverkauf Timer * Black Friday Countdown * Flash Sale Dringlichkeit Bar 💡 Die Verwendung einer klaren internen Benennung erleichtert die spätere Verwaltung mehrerer Kampagnen. --- ## **📝 Titel & Untertitel** * **Titel** - Die Hauptnachricht, die Kunden sehen (z. B. "Beeilen Sie sich!") Der Verkauf endet in {Timer} * **Unterrubrik** - Eine sekundäre Zeile, die unter dem Titel auf den meisten Platzierungen gezeigt wird ℹ️ am **Warenkorbseite** und **Checkout Seite** Timer, können Sie die dynamische Variable verwenden `{timer}` innerhalb des Titels, um den Live-Countdown inline anzuzeigen. --- ## **🔘 Call-to-Action-Taste** für **Top / Bottom Banner**, **Landing Page**, **Warenkorbseite**, und **Warenkorbschublade** Timer, können Sie wählen, was passiert, wenn Kunden mit der Countdown-Leiste interagieren. Setzen Sie die **CTA-Maßnahme** zu: * **Kein Aufruf zum Handeln** - Die Leiste zeigt nur Text an * **Button** - Fügt einen anklickbaren Button unter dem Timer hinzu * **Machen Sie die gesamte Bar anklickbar** - Verwandelt die gesamte Leiste in einen Link ℹ️ Wenn Sie wählen **Button** oder **Machen Sie die gesamte Bar anklickbar**, **Knopftext** und **Link** Felder werden automatisch angezeigt, damit Sie konfigurieren können, wohin die Kunden geleitet werden. --- ## **⏱️ Countdown Typ** Wählen Sie, wie sich Ihr Timer verhalten soll: Typ Wann zu verwenden **Countdown bis zum Datum** Ein festes Enddatum (z. B. Verkauf endet am 31. Dezember) **Feste Minuten** Jeder Besucher erhält die gleiche feste Sitzungsdauer **Täglich wiederkehrender Timer** Wiederholt sich an ausgewählten Tagen mit festgelegten Start-/Endzeiten **Intervallzeitgeber** mehrere geplante Countdown-Fenster **Sitzungs-Timer** Ein neuer Countdown für jede Besuchersitzung Sobald Sie einen Typ ausgewählt haben, werden die entsprechenden Timingfelder automatisch angezeigt: * **Datum** Startdatum und Enddatum Pickers erscheinen * **Feste Minuten / Sitzung** → A **Protokoll** Feld erscheint * **Wiederkehrend** → Tagesauswahl und Start-/Endzeitsteuerung erscheinen * **Intervall** → Mehrere Start-/Enddatums-Picker erscheinen (bis zu 7 Intervalle) ℹ️ **Warenkorbseite**, **Warenkorbschublade** und **Checkout Seite** Platzierungen verwenden feste Timing-Modi und tun **nicht** Zeigen Sie den Countdown Type Selector an. Für Warenkorb und Checkout legen Sie die Dauer in **Protokoll**. --- ## **🕐 Timer Start Einstellungen** für **Countdown bis zum Datum** Timer, können Sie wählen, wann der Timer startet: * **Gerade jetzt** — Der Timer beginnt sofort, wenn er veröffentlicht wird * **Zeitplan für den späteren Start** - Legen Sie ein zukünftiges Startdatum fest Wenn Sie "Zeitplan für den späteren Start" auswählen, wird ein zusätzlicher **Startdatum** Feld erscheint. ℹ️ Diese Option ist nicht verfügbar für **Warenkorbseite**, **Warenkorbschublade**, oder **Checkout Seite** Platzierungen, die ihre eigenen Timing-Steuerelemente verwenden. --- ## **🔚 Sobald es endet** Diese Einstellung steuert, was passiert, wenn der Countdown Null erreicht. Die verfügbaren Optionen hängen von Ihrer Platzierung und Ihrem Countdown-Typ ab: **Für die meisten Placements:** * **Unveröffentlichter Timer (Hide)** - Versteckt den Countdown automatisch * **Eigene Meldung anzeigen** - Zeigt einen benutzerdefinierten Titel / eine benutzerdefinierte Nachricht an, die Sie definieren * **Timer verlängern** - Fügt zusätzliche Zeit hinzu und zeigt eine erweiterte Nachricht an * **Nichts tun** - lässt den Timer bei Null sichtbar **Für Cart Page, Cart Drawer und Cart Standalone:** * Alle oben genannten sowie: * **Countdown neu starten** - Setzt den Timer automatisch zurück * **Warenkorbprodukte löschen** - Entfernt Artikel aus dem Warenkorb, wenn der Timer endet **Für "Fixed Minutes" Typ auf anderen Platzierungen:** * Auch umfasst **Neustart CountdownFür Checkout-Seite:** * **Unveröffentlichter Timer (Hide)** nur * **Nichts tun** ℹ️ Wenn Sie wählen **Eigene Meldung anzeigen** oder **Timer verlängern**, werden automatisch zusätzliche Textfelder angezeigt, damit Sie den Nachrichteninhalt eingeben können. --- # **📍 Schritt 3 — Konfigurieren Sie den Placement Tab** Als nächstes öffnen Sie die **Platzierung** Registerkarte, um zu steuern, wo der Countdown erscheint und wer ihn sehen kann. --- ## **🎯 Seiten oder Produkte auswählen** Die verfügbaren Targeting-Optionen hängen vom Platzierungstyp ab, den Sie in Schritt 1 gewählt haben. --- ### **🛍️ Produktseite** * **Alle Erzeugnisse** - Zeigen Sie auf jeder Produktseite * **Besondere Erzeugnisse** Hand-Pick einzelne Produkte aus Ihrem Shop * **Alle Produkte mit spezifischen Tags** - Zielprodukte, die mit Tags übereinstimmen, die Sie definieren * **Alle Produkte in spezifischen Kollektionen** - Show für Produkte innerhalb ausgewählter Kollektionen * **Zollstelle** - Platzieren Sie manuell mit der Countdown ID oder dem Liquid Snippet --- ### **🛒 Warenkorbseite & Warenkorbschublade** * **An der Spitze des Wagens** Standardplatzierung über Warenkorbpositionen * **Zollstelle** - Platzieren Sie manuell mit der Countdown ID oder dem Liquid Snippet --- ### **🌐 Top / Bottom Banner** * **Auf jeder Seite anzeigen** — Standortweite Sichtbarkeit * **Nur auf der Homepage anzeigen** - Beschränken Sie sich auf die Homepage * **Auf allen Produktseiten anzeigen** - Erscheinen auf jeder Produktseite * **Anzeigen auf bestimmten Produktseiten** — Auswahl einzelner Produkte * **Alle Produkte in spezifischen Kollektionen** - Zielprodukte innerhalb ausgewählter Kollektionen * **Auf allen Sammlungsseiten anzeigen** - Erscheinen auf jeder Sammlungsseite * **Anzeigen auf bestimmten Sammlungsseiten** Hand-Pick einzelne Sammlungen * **Zollstelle** - Platzieren Sie manuell mit der Countdown ID oder dem Liquid Snippet --- ### **📄 Landing Page** * **Alle Sammlungsseiten** - Zeigen Sie auf jeder Sammlungsseite * **Spezifische Sammelseiten** Hand-Pick einzelne Sammlungen * **Zollstelle** - Platzieren Sie manuell mit der Countdown ID oder dem Liquid Snippet --- ### **💳 Checkout Seite** * **Custom Block Placement** - Hinzufügen über die Shopify Checkout Editor --- ℹ️ Wenn Sie wählen **Zollstelle**Die App bietet eine **Countdown-ID** und a **Flüssigcode-Schnipsel** Nach dem Sparen. Sie können diese in Ihrem Theme-Editor oder Code verwenden, um den Timer genau dort zu platzieren, wo Sie möchten. --- ## **Time-on-Site Targeting** Wählen Sie, wann der Countdown erscheinen soll: * **Immer Show** Zeigt sofort an, wenn die Seite geladen wird * **Show nach einer Weile** Verzögert das Aussehen um eine festgelegte Anzahl von Sekunden (1-300) --- ## **👤 Customer Targeting (optional)** Sie können die Sichtbarkeit basierend auf: * **Anmeldestatus** Alle Kunden oder nur angemeldete Kunden anzeigen * **Showbar auf** Alle Kunden, Kunden mit spezifischen Tags oder Kunden basierend auf der Lebenszeit * **Hide Bar von** - Ausschließen spezifischer Kunden-Tags oder lebenslanger Bereiche ℹ️ Diese Einstellungen sind optional. Für die meisten Setups ist die Standardeinstellung **Alle Kunden zeigen** funktioniert perfekt. --- ## **🌍 Geolocation Targeting (optional)** Standardmäßig ist Ihr Countdown weltweit sichtbar. Wenn Sie es auf bestimmte Länder beschränken möchten, wählen Sie **Spezifische Länder** und wählen Sie die erlaubten Standorte aus dem Länder-Selektor. --- # **🎨 Schritt 4 — Customize Design (optional)** Offen **Design** Tab, um zu ändern, wie Ihr Countdown aussieht. Sie können schnell eine **Vorgefertigte Vorlage** oder manuell anpassen: * Position (oben oder unten) * Hintergrundfarbe oder -verlauf * Timer-Stil (Flip-Uhr, Kacheln, einfache Zahlen und mehr) * Fonts, Abstand und Button Styling 💡 Wenn Sie es eilig haben, beginnen Sie mit einer Vorlage und verfeinern Sie sie später. Für eine vollständige Aufschlüsselung jeder Designoption, siehe die **Design & Styling** Unterlagen. --- # **💾 Schritt 5 - Speichern Sie Ihr Setup** Sobald Ihre Inhalte und Platzierung konfiguriert sind: → Klicken **Sparen** Die Speicherleiste erscheint am unteren Rand des Bildschirms, wenn Sie Änderungen vornehmen. Speichern speichert Ihre Konfiguration, aber tut **nicht** Machen Sie den Timer noch live. --- # **🚀 Schritt 6 - Veröffentlichen Sie den Countdown** Nach dem Speichern: → Klicken **Veröffentlichen** Einmal veröffentlicht: * Der Countdown wird auf Ihrer Storefront gemäß Ihren Platzierungs- und Targeting-Regeln sichtbar * Grün **"Veröffentlicht"** Abzeichen erscheint neben dem Countdown-Namen ⚠️ **Wichtige Erinnerungen:** * Wenn die App-Einbettung in Ihrem Theme nicht aktiviert ist, wird der Countdown nicht angezeigt - auch nicht nach der Veröffentlichung * Nur für Checkout Page Timer **eine** veröffentlichter Checkout-Countdown ist pro Shop erlaubt * Sie können jederzeit unveröffentlichen, indem Sie auf die **Unveröffentlicht** Taste --- # **✅ Letzter Schritt — bestätigen Es funktioniert** Nach der Veröffentlichung: 1. Öffnen Sie Ihre Storefront in einem **Inkognito oder Privat** Browserfenster 2. Navigieren Sie zu der Seite, auf der der Countdown erscheinen soll 3. Überprüfen Sie, ob der Timer sichtbar ist und richtig herunterzählen Wenn der Countdown nicht erscheint: * Überprüfen Sie erneut, dass die **App Embed** ist aktiviert und in Ihrem Theme gespeichert * Bestätigen Sie den Countdown **veröffentlicht** * Versuch a **harte Erfrischung** ()`Ctrl + Shift + R` auf Windows / `Cmd + Shift + R` auf Mac * Stellen Sie sicher, dass Ihre Planungs- oder Targeting-Regeln es nicht verbergen --- # **🎉 Endergebnis** Einmal erfolgreich konfiguriert: ✅ Ein Countdown-Timer ist live auf Ihren ausgewählten Seiten ✅ Kunden sehen Dringlichkeitsnachrichten in Echtzeit ✅ Der Timer versteckt oder verlängert sich automatisch basierend auf Ihren End-Action-Einstellungen ✅ Ihre Storefront fühlt sich dynamischer und zeitkritischer an ✨ Ein gut platzierter Countdown-Timer kann Kunden helfen, schnellere Kaufentscheidungen während ihrer Einkaufsreise zu treffen 🚀