> ## 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 in einer benutzerdefinierten Position platziert

> ℹ️ **Note:** Dieser Artikel wurde automatisch mit AI übersetzt und kann Ungenauigkeiten enthalten. Wenn etwas falsch aussieht, kontaktieren Sie bitte unser Support-Team.

Die App bietet zwei primäre Platzierungstypen für Countdown-Setups:

*   📌 Standardplatzierungen
*   🧩 Zollstellen

In den meisten Fällen funktionieren die Standardplatzierungsbereiche einwandfrei.

Manchmal möchten Händler jedoch mehr Flexibilität und bevorzugen es, den Countdown an einem vollständig benutzerdefinierten Ort zu platzieren, abhängig von ihrem Storefront-Layout.

Genau dort ist die **Zollstelle** Feature wird nützlich ✨

Mit Custom Position kann der Countdown platziert werden:

*   Innen Shopify App Blöcke
*   Innerhalb der Custom Liquid Abschnitte
*   Inside Theme Files
*   Innerhalb von manuell gesteuerten Storefront-Standorten

In dieser Dokumentation wird erläutert, wie die benutzerdefinierte Position richtig aktiviert und der Countdown mit beiden verfügbaren Methoden platziert wird.

---

# **🛠️ Schritt 1 - Öffnen Sie die App**

Öffnen Sie die App von Ihrem Shopify Admin.

---

# **📂 Schritt 2 - Öffnen oder Erstellen eines Countdown-Setups**

Sie können entweder:

→ Öffnen Sie ein bestehendes Countdown-Setup  
Oder erstellen Sie ein neues Setup

---

# **⚙️ Schritt 3 - Navigieren Sie zum Placement Tab**

→ Öffnen Sie die **Platzierung** Tab innerhalb des Countdown-Setups.

Die Registerkarte Placement steuert, wo und wie der Countdown auf der Storefront erscheint.

---

# **🎯 Schritt 4 — Änderung der Platzierung in Custom Position**

Innerhalb der Placement-Einstellungen:

→ Ändern Sie die Platzierungsoption in: **Zollstelle**

→ Dann: Klicken **Sparen**

⚠️ Wichtig:

Durch Aktivieren der benutzerdefinierten Position wird der Countdown aus den Standardplatzierungsbereichen entfernt.

Der Countdown wird nun nur dort angezeigt, wo er manuell platziert wird.

---

# **🆔 Methode 1 — Verwendung der Countdown-ID**

Diese Methode ist ideal, wenn Sie den Countdown direkt mit ShopifyTheme Editor.

---

# **🎨 Schritt 5 — Öffnen Shopify Theme Editor**

von Shopify Admin:

→ Gehen Sie nach **Verkaufskanäle → Online Store**  
→ Klicken **Bearbeiten Theme**

Dies öffnet die Shopify Theme Editor.

---

# **➕ Schritt 6 - Fügen Sie den Countdown App Block hinzu**

Im Theme Editor:

→ Navigieren Sie zu dem Abschnitt, in dem der Countdown angezeigt werden soll  
→ Bewegen Sie in kompatiblen Abschnitten, bis die blaue Farbe ➕ Icon erscheint  
→ Klicken **Block hinzufügen**

Dann:

→ Öffnen Sie die **Apps** Kategorie  
→ Wählen Sie den Countdown App Block

Der App-Block wird nun dem ausgewählten Storefront-Bereich hinzugefügt.

---

# **🔗 Schritt 7 - Fügen Sie die Countdown-ID hinzu**

Sobald der App-Block hinzugefügt wurde:

→ Geben Sie die Countdown-ID innerhalb der App-Block-Einstellungen ein

Dann:

→ Rettet die Shopify Thema  
→ Speichern Sie das Countdown-Setup auch in der App

⚠️ Wichtig:

Beide Saves sind erforderlich.

Andernfalls erscheint der Countdown möglicherweise nicht korrekt auf der Storefront.

---

# **🧩 Methode 2 — Verwendung von Countdown Code Snippet**

Diese Methode ist nützlich, wenn Sie eine erweiterte Platzierungsflexibilität wünschen.

Der Countdown Code Snippet kann sein:

*   Hinzugefügt mit einem Custom Liquid Block
*   Direkt hinzugefügt in Shopify Themendateien

---

# **➕ Schritt 8 - Fügen Sie einen benutzerdefinierten Flüssigkeitsblock hinzu**

Innen Shopify Theme Editor:

→ Navigieren Sie zu dem Bereich, in dem der Countdown angezeigt werden soll  
→ Bewegen Sie in kompatiblen Abschnitten, bis die blaue Farbe ➕ Icon erscheint  
→ Suche nach **Custom Liquid**

Dann:

→ Hinzufügen des Countdown Code Snippets innerhalb des Custom Liquid Blocks

Dies ermöglicht das Rendern des Countdowns in der ausgewählten Storefront-Position.

---

# **💻 Hinzufügen des Code-Snippets direkt in Theme-Dateien**

Bei Bedarf kann das Countdown Code Snippet auch direkt in Shopify Themencodedateien.

Dies ist nützlich, wenn:

*   App Blocks sind nicht verfügbar
*   Custom Liquid Abschnitte werden nicht unterstützt
*   Erweiterte Storefront-Anpassung ist erforderlich

---

# **⚙️ Öffnung Shopify Code Editor**

⚠️ Wichtig:

Es wird nicht empfohlen, zu ändern Shopify Themendateien, sofern nicht:

*   Sie fühlen sich wohl, wenn Sie mit Shopify Code
*   Oder Sie verstehen, welche Änderungen vorgenommen werden

Falsche Änderungen im Inneren Theme-Dateien können das Storefront-Verhalten beeinflussen.

Um die Öffnung Shopify Code Editor:

→ Gehen Sie nach **Verkaufskanäle → Online Store**  
→ Klicke auf das Drei-Punkte-Menü neben dem **Bearbeiten Theme** Taste  
→ Klicken **Editcode**

---

# **🧩 Identifizieren Sie den richtigen Storefront-Bereich**

Bevor Sie das Countdown Code Snippet einfügen, ist es wichtig, den genauen Speicherort zu identifizieren, an dem der Countdown erscheinen soll.

Eine einfache Möglichkeit, dies zu tun:

→ Öffnen Sie Ihre Storefront im Browser  
→ Rechtsklick in der Nähe des Bereichs, in dem Sie den Countdown möchten  
→ Klicken **Inspektion**

Dies öffnet die Browser Developer Tools.

Von dort aus:

→ Überprüfen Sie die umgebende HTML-Struktur  
→ Identifizieren Sie nützliche Klassennamen oder Abschnittsreferenzen  
→ Passen Sie diese Abschnitte mit den entsprechenden Shopify `.liquid` Dateien im Code Editor

✨ Dies hilft, die richtige Theme-Datei genauer zu finden.

---

# **🔍 Finden Sie die richtige Theme-Datei**

Nach dem Öffnen des Shopify Code Editor:

→ Navigieren Sie durch die Theme-Dateien auf der linken Seite  
→ Finden Sie die `.liquid` Datei, die für den Bereich verantwortlich ist, in dem der Countdown erscheinen soll  
→ Suche nach einer beliebigen ID/Klassenreferenz mit der Suchfunktion des Code Editors  
→ Klicken Sie auf die vielversprechendsten `.liquid` Datei

Zum Beispiel:

*   Produktbezogene Abschnitte können innerhalb von:
    *   `main-product.liquid`
    *   `product-template.liquid`
*   Wagenbezogene Abschnitte können innerhalb vorhanden sein:
    *   `cart.liquid`
    *   `cart-drawer.liquid`
*   Benutzerdefinierte Abschnitte können innerhalb vorhanden sein:
    *   `sections/*.liquid`

---

# **➕ Hinzufügen des Countdown Code Snippet**

Einmal richtig `.liquid` Datei wird identifiziert:

→ Fügen Sie das Countdown Code Snippet an der gewünschten Position innerhalb der Datei ein

⚠️ Wichtig:

Stellen Sie sicher, dass das Snippet sorgfältig an der richtigen Stelle hinzugefügt wird.

Falsche Platzierung kann dazu führen:

*   Layoutprobleme
*   Falsche Darstellung
*   Unerwartetes Storefront-Verhalten

---

# **💾 Speichern Sie die Theme File**

Nach dem Einfügen des Code-Snippets:

→ Klicken **Sparen**

Dann:

→ Aktualisieren Sie die Storefront-Vorschau  
→ Stellen Sie sicher, dass der Countdown korrekt an der ausgewählten benutzerdefinierten Stelle angezeigt wird ✨

---

# **🎉 Endergebnis**

Einmal erfolgreich konfiguriert:

✅ Der Countdown kann in vollständig benutzerdefinierten Storefront-Positionen erscheinen  
✅ Shopify App-Blöcke können sich mit Countdown ID korrekt verbinden  
✅ Erweiterte Storefront-Platzierung wird mit Code Snippets möglich  
✅ Händler gewinnen viel mehr Flexibilität über Storefront Sichtbarkeit ✨