Preloader-Abschnitt
Was Sie lernen werden
Wie man einen gebrandeten Ladebildschirm aktiviert, bevor Ihre Seite geladen wird
Wie man Hintergrund, Logo und Text anpasst
Wie man die Anzeigedauer einstellt
🧩 Abschnittsübersicht
Der Preloader fügt einen bildschirmfüllenden Ladebildschirm hinzu, der kurz erscheint, wenn Besucher auf Ihrem Shop landen. Das ist nützlich, um die Markenpräsentation zu verbessern und während des anfänglichen Seitenladens ein professionelleres Nutzererlebnis zu schaffen.
Sie können entweder Text oder ein Bild (z. B. ein Logo) zusammen mit benutzerdefinierten Hintergrundfarben und Timing anzeigen.
So aktivieren Sie den Preloader
Im Shopify Theme-Editor, öffnen Sie das Theme-Einstellungen
Suchen Sie und erweitern Sie das Preloader Panel
Schalten Sie das Preloader-Logo-Typ (wählen Sie zwischen Text oder Bild)
Preloader-Einstellungen
Preloader-Logo-Typ
Text: Zeigt einen Marken- oder Themennamen an
Bild: Verwenden Sie Ihr Logo oder eine animierte Grafik
Preloader-Text
Fügen Sie einen kurzen Titel hinzu (z. B. „Plain Jane 3.0“)
Passe die Textfarbe
Passe Textgröße mit dem Schieberegler
💡 Tipp: Verwenden Sie fette oder große Schriftarten für mehr visuelle Wirkung
Preloader-Bild
Laden Sie ein statisches oder animiertes Bild hoch (z. B. .GIF oder .webp)
Hintergrundfarbe
Legen Sie die Hintergrundfarbe des Preloader-Bildschirms fest
Preloader-Dauer
Steuert, wie lange der Bildschirm angezeigt wird (in Sekunden)
Standard ist 1 Sekunde; erhöhen Sie die Dauer für längere Ladeanimationseffekte
Beispielanwendungen
Zeigen Sie Ihre Logo-Animation an, bevor der Shop geöffnet wird
Passen Sie den Preloader-Hintergrund an Ihren Hero-Bereich an für einen nahtlosen Übergang
Verwenden Sie gebrandeten Text wie: „Kollektion wird geladen…“ oder „Powered by Plain Jane“
⚠️ Halten Sie die Dauer kurz (1–3 Sekunden), um zu vermeiden, dass der Nutzerzugang verlangsamt wird
Styling-Tipps
Passen Sie den Preloader- Farben an Ihre Markenpalette an
Halten Sie den Text minimal für ein sauberes Erscheinungsbild
Verwenden Sie einen transparenten oder weißen Hintergrund für ein leichtes Gefühl
Brauchen Sie Hilfe?
💬 Treten Sie unserer Community auf Discord bei: https://discord.gg/hcc2GvgZc6
📧 Schreiben Sie uns eine E-Mail an: [email protected]
💻 Chatten Sie live mit uns: Verfügbar Montag–Freitag, 10:00–18:00 EST, direkt auf unserer Website
Zuletzt aktualisiert