FROM CACHE - de_header

Im Theme 'Brooklyn' zwei Produkte nebeneinander darstellen !

Gymetrics
Neues Mitglied
10 0 0

Hey Freunde,

ich benutze das Theme 'Brooklyn' und im folgenden Bild ist zu sehen, dass nur ein Produkt bei der Mobilen Ansicht angezeigt wird. 

Ich möchte aber das genau zwei Produkte nebeneinander in der Mobilen Ansicht angezeigt werden und nicht nur eins. 

Kann mir jemand helfen das zu ändern :)?

 

problem1.png

 

 

22 ANTWORTEN 22
r8r
Shopify Expert
2421 310 851

Hi @Gymetrics 

so?

Screenshot 2021-01-31 at 22.48.02.jpg

Beim Unterschreiten welcher Bildschirmbreite (in px) soll das so dargestellt werden?

LG, Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
Gymetrics
Neues Mitglied
10 0 0
Hi 🙂

Ja genau so in der Art:) ..wie mach ich das ? Lg anil




##- Bitte geben Sie Ihre Antwort oberhalb dieser Zeile ein -##


Von meinem iPhone gesendet
Gymetrics
Neues Mitglied
10 0 0

Hi:),

ja genau so ! Wie mach ich das :)?

lg 

 

anil 

r8r
Shopify Expert
2421 310 851

… unter der Vorraussetzung, dass Du als Grid-Style Grid und nicht Collage gewählt hast

Screenshot 2021-02-01 at 12.53.40.jpg

kannst Du folgenden CSS-Code ergänzen:

@_media screen and (max-width: 590px) {
  .template-collection .grid-item.grid-product {
    width: 50%;
  }
}

LG, Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
Gymetrics
Neues Mitglied
10 0 0

Hey Mario,

erstmal vielen Dank für deine Hilfe:), aber ich hab echt keine Ahnung wo genau ich den Code jetzt ergänzen bzw. einfügen soll. Grid ist bereits gewählt.

 

Lg

 

r8r
Shopify Expert
2421 310 851

Hallo @Gymetrics 

nicht die sauberste, aber die schnellste Integration schaffst Du, indem Du den Code am Ende der Datei /assets/theme.scss.liquid (Online Store > Themes > (Themename) > Actions > Edit Code) einfügst.

Liebe Grüße,
Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
Gymetrics
Neues Mitglied
10 0 0

So, oder hab ich was vergessen? Hat leider nicht funktioniert und der Theme Editor zeigt einen Fehler an 😕

problem.png

r8r
Shopify Expert
2421 310 851

Ich weiss nicht ob das einen Unterschied macht, aber @_media sollte @_media sein – das ist mir vorhin schon falsch reingerutscht.

Welchen Fehler bekommst Du angezeigt?

LG, Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
r8r
Shopify Expert
2421 310 851

ah doch – ich weiss schon warum … hier im Forum gibt's einen user "Media" – darum verändert der Editor das entsprechend. Blöd. @ media (ohne Leerzeichen) soll es lauten!

@Gabe kann man da was machen, dass im Forum auch Mediaqueries korrekt gepostet werden können?

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
Gabe
Shopify Staff
Shopify Staff
8163 1266 2104

Hey Mario! @r8r 

Wie genau war das vorher mit Media Queries nochmal?

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

Gymetrics
Neues Mitglied
10 0 0

also der Fehler bleibt unverändert sobald ich den Code in die von dir angezeigten Ort einfüge, verändert sich die komplette Seite

und alles ist unsortiert und wird fehlerhaft dargestellt.

 

r8r
Shopify Expert
2421 310 851

wenn ich @_media schreibe, wandelt das Board das entsprechend um …

Screenshot 2021-02-01 at 17.35.05.jpg

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
r8r
Shopify Expert
2421 310 851

@Gymetrics bekommst du eine Fehlermeldung? Wenn ja, welche? Ansonsten brauch ich zugang zur Webseite. Der Codeschnipsel ist für ein unverändertes Brooklyn-Theme – nactürlich kann auch die eine oder andere Konfigurationseinstellung darauf Auswirkungen haben. Aber das ist das Risiko, wenn wir hier keine Referenzlinks bekommen, gegen die wir den Code testen können ¯\_(ツ)_/¯

LG, Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
Gymetrics
Neues Mitglied
10 0 0

@r8r 

Das hier: 

112323.png

 

du kannst auch gerne zugang zu meinem Shop haben wenn du möchtest 🙂

 

r8r
Shopify Expert
2421 310 851

Hi @Gymetrics 

kannst Du bitte einen Screenshot zu dem eingefügten Code posten? Die Fehlerbeschreibung sieht genau so aus, wie das was ich beschrieben hab, nämlich dass die [AT]media Regel durch die Manipulation des Codes hier im Forum zu ungültigem CSS führt.

Wahrschienlich wird die ganze theme.css aus doesem Grund nicht korrekt gebuildet und zerfetzt Dir die Seite … wenn Du den Block rausnimmst, sollte es wieder gehen. Bzw. wenn du die Mediaquery korrekt öffnest (Klammeraffe, kein Leerzeichen, media, Leerzeichen …). Leider kann ich das aber eben hier nicht posten ¯\_(ツ)_/¯ 

LG, Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
Gymetrics
Neues Mitglied
10 0 0
r8r
Shopify Expert
2421 310 851

@Gymetrics wie schon beschrieben …

  • Richtig: Klammeraffe, kein Leerzeichen, media, Leerzeichen …
  • Falsch: Klammeraffe, Leerzeichen, Media, Leerzeichen
★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
Gymetrics
Neues Mitglied
10 0 0

Nope, Fehler besteht immer noch... 

Spoiler
Unbenannt.png
r8r
Shopify Expert
2421 310 851

@Gymetrics ich kann das leider nicht reproduzieren …

Screenshot 2021-02-02 at 00.13.23.jpg

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte