So fügen Sie einen Timer hinzu und legen ihn fest

⏳ Was du lernen wirst

  • Wie du einen Countdown-Timer auf deiner Passwortseite hinzufügst

  • Wie du die korrekte Startzeit mit UTC einstellst

  • Wie du den Timer gestaltest und positionierst


Schritt 1: Öffne den Theme-Editor

  1. Gehe in deinem Shopify-Admin zu Onlineshop > Anpassen

  2. Wählen Sie im oberen Dropdown Passwort

  3. Suche nach dem Timer Abschnitt in der Seitenleiste

    • Wenn er nicht vorhanden ist, klicke Abschnitt hinzufügen > Timer


Schritt 2: Stelle die Countdown-Zeit ein

Im Einstellungsbereich rechts unter Countdown-Timer:

  • Stelle dein Drop-Datum und deine Uhrzeit ein

    • Wähle Monat, Tag, Jahr, Stunde und Minute

    • Wähle AM oder PM

  • Verwende UTC-Zeit

    ⚠️ WICHTIG: Konvertiere deine lokale Zeit in UTC, damit alle Besucher denselben Countdown sehen.

    Beispiel: Wenn dein Launch um 17:00 EST ist, konvertiere es zu 21:00 UTC. Verwende Google: 17:00 EST in UTC21:00 UTC


Schritt 3: Passe das Timer-Layout an

Unter Timer-Positionierung:

  • Schalten Sie Timer zentrieren wenn es das einzige Hauptelement auf der Seite ist

  • Legen Sie Obere Timer-Margin und Untere Timer-Margin für Abstand


Schritt 4: Style den Timer

Unter Countdown-Typografie:

  • Passe die Schriftgröße für Countdown-Zahlen und -Beschriftungen an (nur Desktop)

Unter Countdown-Styling:

  • Beschriftungen umschalten: Tage / Stunden / Minuten / Sekunden

  • Glühen oder Kästchen um Zahlen aktivieren für visuelle Akzente

  • Setze die Eckenradius des Kästchens (abgerundete Countdown-Box-Ecken)

  • Passe die Transparenz an mit Countdown-Box-Deckkraft

Unter Countdown-Farben:

  • Ändere die Farben für Box, Zahlen und Beschriftungen:

    • Countdown-Box-Farbe

    • Tage / Stunden / Min / Sek Text- + Beschriftungsfarben


Schritt 5: Speichern und Vorschau

Klicken Sie Speichern 💾 und aktualisiere deinen Live-Shop, um den Countdown zu testen.

💡 Der Countdown ist großartig für Drops, Presales und Hypes zu neuen Kollektionen. Kombiniere ihn mit deiner Unlock-Animation für den vollen Effekt.


Brauchen Sie Hilfe?

Zuletzt aktualisiert