FROM CACHE - de_header

Mobile - Navigationsbar und Zoomfunktionen von Produktbildern

klettersteiger
Besucher
1 0 0

Hey Leute, 

ich habe gestern meinen ersten Shopifystore eröffnet. Ich bin sehr zufrieden bisher. 
Allerdings habe ich zwei Fragen, wozu ich über Google keine zufriedenstellende Antwort finden konnte.

1. Ich habe über css die Navigationsbar am oberen Bildschirmende fixiert (bleibt beim scrollen sichtbar). Schaut gut auf dem Desktop aus. Auf dem Handy schneidet es allerdings in die Produktbilder. Ich habe diesen Code benutzt: 

.header-wrapper {
  position: fixed;
  background-color: rgba(0, 0, 0, 1);
  width: 100%;
}

Wie kann ich dies auf mobile nur für die Startseite aktivieren? Oder noch besser: Wie kann ich es einstellen, dass die Navigationsbar auf dem Handy nicht den anderen Inhalt überlagert?

2. Produktzoom Ich nutze das Brooklyn theme wobei die Zoomfunktion auf Mobile nicht funktioniert. Gibt es hierzu eine einfache Lösung oder brauch ich eine App?

Vielen Dank,

Dennis

1 ANTWORT 1

Gabe
Shopify Staff
16357 2587 3853

Hey Dennis! @klettersteiger 

Super Fragen auch!

1)

Und verstehe, du hast eine "Sticky-Header" Menü im Code eingebaut, die verdeckt aber die obere Teile der Produkte auf Handy. Das Problem ist, dass ein Sticky Header darin besteht, dass es an Ort und Stelle bleibt, während der Rest der Website in/unter der Leiste nach oben verschwindet, wenn der Kunde scrollt, also kann es so zu Anzeigeprobleme oder Verdeckungen kommen beim scrollen. Da das ein Shopify Theme ist (Brooklyn) dann können wir das anschauen als Teil deines 60-Min Design Times.

Siehe aber weitere Leitfäden zu diesem Thema in unserer Community hier.

2)

Die Zoom Funktion ist auf Handy schwierig aus 2 Gründen: A) man muss auf ein Photo tappen um das Zoom auszulösen und dann rauf und runter, links und rechts bewegen um die Photo Details anzuschauen, was auf einem Handy Touchscreen anders wäre als auf Desktop mit dem klicken einer Mouse. Und B) weil es auf Handy bereits eine 2-Finger Zoom Funktion schon gibt und somit würden zwei Zoom-Funktionen gleichzeitig übereinander gelagert sein (double touch layer).

Eine App dafür wäre aber diese hier, oder gebe das Suchwort "Zoom" oder "Image Zoom" in die App Store Suchleiste ein und da dürftest du mehrere Apps finden, die das machen können. Einfach hinzufügen und testen um die beste der Apps für dein Shop zu finden.

Siehe weitere Leitfäden zu diesem Thema hier und in unserer Community hier.

Hoffe das hilft!

Gabe

 

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