Passwort page background fill the screen dawn themee

Topic summary

Problem: Ein Nutzer möchte bei der Dawn-Vorlage das Hintergrundbild auf der Passwortseite über den gesamten Bildschirm ausdehnen, insbesondere um einen schwarzen/weißen Balken unten zu entfernen.

Lösungsansatz:

  • Kai schlägt vor, CSS-Code in die theme.liquid-Datei einzufügen, um den Footer auszublenden und die E-Mail-Banner-Höhe auf 100% zu setzen
  • Der Code funktioniert teilweise, aber ein weißer Balken bleibt unten sichtbar

Weiterführende Hilfe:

  • Gabe erklärt, dass der E-Mail-Banner sich über dem Footer überlagert
  • Empfehlung: Die min-height des entsprechenden <div> über Chrome Developer Console identifizieren und von z.B. 72rem auf 100rem erhöhen
  • Zusätzlicher CSS-Code kann im Liquid hinzugefügt werden

Wichtige Hinweise:

  • Änderungen sollten zuerst in einer Themekopie/Testumgebung getestet werden
  • Theme-Code-Änderungen können Page Speed negativ beeinflussen und Theme-Updates ausschließen
  • Bei Bedarf können Shopify-Experten für professionelle Unterstützung kontaktiert werden

Status: Diskussion bleibt offen mit technischen Anpassungsvorschlägen.

Summarized with AI on November 15. AI used: claude-sonnet-4-5-20250929.

Dawn-Vorlage? das das hintergrund bild über die ganze seite geht und unten der banner weg ist. im passwort bereich

Url: visionaryclo.de

Hi @Visionaryclo ,

vielen Dank für deinen Post.

Meinst du diesen Balken hier unten? Diesen schwarzen Bereich möchtest du mit dem Bild das man darüber sieht ersetzen?

Um das Foto über den gesamten Bildschirmbereich anzuzeigen folge diesen Schritten:

  1. Finde das aktuell verwendete Theme in deinem Admin unter Online-Shop.
  2. Klicke auf Code bearbeiten
  3. Suche die Datei theme.liquid
  4. Fügen folgende CSS am Ende der Datei über hinzu
<style>
.password footer {
    display: none;
}
@media only screen and (max-width:768px) {
.password .email-signup-banner{
height: 100%;
}
}
</style>​

Führt das die von dir erhoffte Änderung hervor?

Und wie weit bist du mit der Fertigstellung des Shopify Shops? Orientierst du dich dabei an unserer Checkliste, die die dabei wichtigen Punkte aufführt?

1 Like

das hat so weit funktioniert aber ich habe noch einen kleinen weißen balken unten und bekomme diesen nicht weg

Hey @Visionaryclo

Da der E-Mail Banner in deinem Code sich über dem Footer überlagert siehst du immernoch diesen weissen Banner ganz unten. Wenn du in die Chrome Developer Console gehst (rechtsklick auf den weissen Banner → “Inspect”), kannst du die genaue Stelle sehen, wo du die Höhe des

vergrößern kannst um es ganz nach unten zu verlängern - beispielsweise von min-height: 72 rem zu 100 rem. Das ändert es aber nur im Browser, nicht im Liquid und du musst das CSS im Liquid finden oder einen weiteren CSS im CSS Editor hinzufügen:

Du müsstest somit das in deinem Liquid Code ändern oder einen CSS wie den folgenden zum Liquid hinzufügen:


Wenn du es selber auf deiner Passwortseite programmieren möchtest dann bitte immer in einer Themekopie/Testumgebung zuerst testen und zusammen mit einem Experten/Programmierer. Du kannst ein Backup deines Themes erstellen, bevor man den Code bearbeitet, oder den Code wiederherstellen, falls dies nötig sein sollte. Du könntest auch einen unserer Experten engagieren indem du denen eine E-Mail rüberschießt. Unsere Experten antworten meist sehr schnell.

Änderungen zu deinem Theme Code können auch 1) die Page Loading Speeds negativ beeinflussen und 2) dein Theme aus den Theme Updates ausschließen. Das obige ist Theme-abhängig, ohne Gewähr und dient lediglich dazu dich in die richtige Richtung zu weisen!