Liquid, JavaScript, Themes
Hallo zusammen!
Ich möchte gerne auf der Passwort-Seite meines Shops ein Hintergrundbild einfügen.
Das Dawn Theme bietet da ja schon eine Möglichkeit mit dem Bildbanner für das E-Mail Formular.
Ich habe den Banner auf "an Bild anpassen" gestellt. Das funktioniert für den Desktop super und der komplette Hintergrund ist ausgefüllt.
Jedoch nicht bei der mobilen Ansicht.
Gibt es da eine Möglichkeit das noch zu bearbeiten? Danke für die Hilfe 🙂
Gelöst! Zur Lösung
Erfolg.
@julius_richter ah schau mal, wenn du den vorherigen Code wieder entfernst und dem parent Div die Höhe 100% gibst, sollte es passen.
Versuche mal
.email-signup-banner.banner {height:100%}
Siehe Screenshot:
Hi @julius_richter ,
schau mal in den Einstellungen des Banners, da solltest du ganz am Ende ein Kontrollkästchen namens "Auf Mobilgeräten Inhalt unterhalb der Bilder anzeigen" finden. Wenn du dieses deaktivierst wird deine Signup Form mobil auf dem Bild, nicht unter dem Bild angezeigt.
Am besten wählst du für die Bannerhöhe "Groß", da es ansonten mobil zu klein werden könnte. Alternativ kannst du das ganze natürlich mit eigenem CSS überschreiben, bspw. wenn du dem Banner die Höhe 100vh gibst.
.banner__media.media {
height: 100vh
}
Danke, das CSS habe ich jetzt probiert. Der Banner überdeckt jetzt die ganze Seite, jedoch auch den Footer.
@julius_richter magst du mir eben die Domain zum Shop durchschicken? Dann kann ich dir die genaue Klasse etc. nennen womit du das Bild fullscreen bekommst.
Erfolg.
@julius_richter ah schau mal, wenn du den vorherigen Code wieder entfernst und dem parent Div die Höhe 100% gibst, sollte es passen.
Versuche mal
.email-signup-banner.banner {height:100%}
Siehe Screenshot:
Benutzer | RANKING |
---|---|
12 | |
11 | |
10 | |
9 | |
9 |
Online-Marketing für einen Shopify-Shop kann manchmal wie ein Minenfeld erscheinen und vie...
By Gabe Dec 1, 2023In diesem Leitartikel werden wir erläutern, warum es wichtig ist, dein Shop als vertrauens...
By Kai Oct 25, 2023Dieser Blog-Beitrag ist eine Zusammenfassung des Webinars Vorbereitung auf BFCM: ein Webi...
By Jacqui Oct 10, 2023