Den leeren Space zwischen Header und Body entfernen

Topic summary

Problem: Im Shopify-Theme „Refresh“ erscheint auf kundenbezogenen Seiten (Login, Konto) ein leerer Abstand zwischen Header und Inhaltsbereich.

Aktuelle Empfehlung: Prüfen, ob die klassischen Kundenkonten verwendet werden. Vorschlag, auf die neuen Kundenkonten zu wechseln (verbesserte Login-Erfahrung laut Dokumentation). Dies könnte Layout-/Abstandsprobleme umgehen.

DIY-Lösung (falls beim aktuellen Setup bleiben):

  • Per CSS den oberen Abstand (margin/padding) des Selektors .customer oder eines übergeordneten Containers reduzieren/entfernen.
  • Mit den Browser-DevTools das verantwortliche Element identifizieren und gezielt dessen Margin/Padding anpassen.
  • Bei Bedarf den relevanten HTML/CSS-Auszug teilen, um eine präzise Regel zu formulieren.

Hinweise: Screenshots zeigen den sichtbaren „Gap“ und die Nutzung der Developer Console zur Fehlersuche. Es wurden keine Code-Snippets bereitgestellt.

Status: Keine endgültige Lösung bestätigt. Weitere Details (konkret betroffene Elemente/Code) werden erbeten, oder Alternativwechsel zu den neuen Kundenkonten empfohlen. Offene Punkte: Bestätigung, ob klassische oder neue Kundenkonten genutzt werden; exakte CSS-/HTML-Struktur für eine zielgenaue Anpassung.

Summarized with AI on January 1. AI used: gpt-5.

Hallo zusammen,

wir nutzen das Theme “Refresh”. Die Kunden-spezifischen Seiten (Login, Konto, etc.) haben einen leeren Space zwischen Header und Body. Wie können wir diesen bei den spezifischen Seiten entfernen? Vielen Dank vorab für Ideen

Hey @blackgonzalez

Darf ich dazu fragen ob das der alte Login bzw. die klassische Kundenkonten? Wenn ja, könnt ihr mal auf die neue Kundenkonten wechseln?

Dieser bietet eine viel verbesserte Login Experience!

Wenn ihr es trotzdem DIY machen wollt:

Um den leeren Raum zwischen dem Header und dem Inhalt auf kundenspezifischen Seiten in deinem “Refresh”-Theme zu entfernen, musst du möglicherweise CSS-Anpassungen vornehmen. Es sieht so aus, als ob der Raum durch die standardmäßigen Abstandseinstellungen (Margins oder Paddings) des Themes verursacht wird. Du kannst versuchen, spezifische CSS-Regeln hinzuzufügen, um den oberen Abstand (Margin oder Padding) der .customer Class oder des übergeordneten Elements, das den leeren Raum verursacht, zu reduzieren oder zu entfernen. Es könnte hilfreich sein, die Developer Console deines Browsers zu nutzen, um genau zu bestimmen, welches Element den Abstand verursacht, und dann gezielt diesen Abstand anzupassen, wie hier abgebildet:

Oder lass mich hier den genauen HTML Code deines Paddings wissen!

Hoffe das hilft dir weiter - lass wissen falls nicht! :wink:


Habt ihr auch den Shop auf Ostern eingestellt das jetzt um die Ecke liegt? Warum nicht eine Ostereierjagd :hatching_chick: in das Shop einbauen, um deinen Kunden etwas Gamification und Fun im Shop anzubieten? Gerne kann ich bei Interesse Tipps dazu geben!

Hast du weitere Fragen zum Shop? Gebe einfach ein Suchbegriff oben in der Suchleiste der Community Landingpage ein, denn das Thema haben wir sehr wahrscheinlich schon besprochen. Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.

1 Like