FROM CACHE - de_header
Gelöst

Banner Bild wird auf dem Monitor falsch dargestellt

PinarPehlivan
Neues Mitglied
4 0 0

Hallo,

das Bild wird auf dem Monitor falsch dargestellt, aber andere Seiten werden richtig dargestellt. Leider finde ich den fehler nicht. Mobil und Laptop sehen gut aus.

meine Seite:

PinarPehlivan_1-1677676451462.png

 

andere SEite:

PinarPehlivan_2-1677676489285.png

 

 

 

 

1 AKZEPTIERTE LÖSUNG
Gabe
Shopify Staff
17514 2771 4088

Erfolg.

Hey @PinarPehlivan 

 

Ich sehe dein Bild ist immer noch das alte das an den Seiten abgeschnitten wird. Das liegt daran dass euer Banner Bild sich nicht dem Bildschirm anpasst und somit viel zu breit ist ab 750px Bildschirmbreite -> deswegen die schlechte Darstellung bei einer Bildschirmgröße >750px.

 

Die schnellste Lösung -> Ihr müsst also das Bild mit einem anderen Aspekt in einem Bildeditor dimensionieren, wie z. B. 16:9.

 

Hier eine Demo dessen was ich meine:

 

07-19-xv27d-q4wc1.gif

 

Die folgenden Angaben sind ohne Gewähr und es kommt auf dein Theme drauf an: Du könntest auch einen CSS Code implementieren wie den folgenden aber das bitte mit einem Experten und in einer Testumgebung:

 

@media only screen and (min-width: 749px) {
#shopify-section-hero .hero--large {height: 140px;}
}

 

min-width: 749px erstellt die Regel, dass der Code nur bei einer minimalen Bildschirmbreite greift. Die height pixel Anzahl kann man auch anpassen, sprich, die 2 obigen Pixelzahlen im Codebeispiel einfach anpassen je nach euren Bedürfnissen.

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

Lösung in ursprünglichem Beitrag anzeigen

4 ANTWORTEN 4

Gabe
Shopify Staff
17514 2771 4088

Hey @PinarPehlivan 

 

Danke für die Bilder und ich habe anhand deiner Bilder weitere wichtige Infos entnehmen können, wie z. B. die URL mariagalland.com. Es fehlen aber etliche Angaben und Infos in deiner Frage die uns hier helfen können dir zu helfen und das führt dazu, dass wir weitere Fragen stellen müssen was das ganze erheblich verzögert.

 

Was ist das denn auch für ein Monitor den du im Bild zeigst, wenn ich fragen darf? Außerdem ist das erste Bild praktisch unerkennbar wie man hier sieht:

 

image.png

Also kann ich damit leider wenig anfangen und dir keine Antwort geben die du verdienst ¯\_(ツ)_/¯.

 

Sende doch einen genauen Link zu einem Beispiel so dass wird das hier testen können.

 

VG,

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

PinarPehlivan
Neues Mitglied
4 0 0

vielen Dank für deine schnelle Antwort.

Maria Galland Kosmetik Online kaufen – Pinarcosmeticsshop (pinarcosmetics-shop.de) dies ist der Link zum Shop. Ich habe es gestern auch auf einen breiteren Monitor testen lassen, da ist es auch genauso. 

 

PinarPehlivan_0-1677749564609.png

 

PinarPehlivan
Neues Mitglied
4 0 0

@Gabe konntest du schon was herausfinden? ich bin leider nicht weiter

Gabe
Shopify Staff
17514 2771 4088

Erfolg.

Hey @PinarPehlivan 

 

Ich sehe dein Bild ist immer noch das alte das an den Seiten abgeschnitten wird. Das liegt daran dass euer Banner Bild sich nicht dem Bildschirm anpasst und somit viel zu breit ist ab 750px Bildschirmbreite -> deswegen die schlechte Darstellung bei einer Bildschirmgröße >750px.

 

Die schnellste Lösung -> Ihr müsst also das Bild mit einem anderen Aspekt in einem Bildeditor dimensionieren, wie z. B. 16:9.

 

Hier eine Demo dessen was ich meine:

 

07-19-xv27d-q4wc1.gif

 

Die folgenden Angaben sind ohne Gewähr und es kommt auf dein Theme drauf an: Du könntest auch einen CSS Code implementieren wie den folgenden aber das bitte mit einem Experten und in einer Testumgebung:

 

@media only screen and (min-width: 749px) {
#shopify-section-hero .hero--large {height: 140px;}
}

 

min-width: 749px erstellt die Regel, dass der Code nur bei einer minimalen Bildschirmbreite greift. Die height pixel Anzahl kann man auch anpassen, sprich, die 2 obigen Pixelzahlen im Codebeispiel einfach anpassen je nach euren Bedürfnissen.

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog