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
2555 327 940

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
2555 327 940

… 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
2555 327 940

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
2555 327 940

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
2555 327 940

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
16357 2587 3853

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

r8r
Shopify Expert
2555 327 940

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
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
2555 327 940

@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
2555 327 940

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 

sadasdadsadsadsdas.png

r8r
Shopify Expert
2555 327 940

@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
2555 327 940

@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
Gabe
Shopify Staff
16357 2587 3853

Hey @Gymetrics 

Ich habe jetzt dein letztes Screenshot mit einem Spoiler Tag versehen, denn es gibt ein paar private Details darin zu sehen. 

Bzgl. der Fehlermeldung, mir scheint dass der Wurm im Syntax des Code liegen könnte, wie z. B. die folgenden Beispiele:

  • Es fehlt z. B. eine 'closing } bracket' oder } Klammer in einer Zeile.
  • Die <h2>-Tags sind ungültig, wenn sie innerhalb des <label>-Tags platziert werden. 
  • Der <style>-Code aus dem Beschreibungsfeld wird auskommentiert, da er in den <head>-Tag einer Seite und nicht in den Body eingefügt wurde.

Du kannst deinen Code durch einen Code Validator laufen lassen, um zu prüfen ob die Tags ungültig sind oder falsch platziert und die Reihenfolge der Tags geändert werden muss, so dass der Code richtig funktioniert wie erwartet.

Um eine bessere Kontrolle über die Seiten zu bekommen, rate ich auch mehrere Vorlagen oder einen neuen Abschnitt zu erstellen und testen.

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

r8r
Shopify Expert
2555 327 940

… ich hab glaub ich in meinen letzten Beiträgen den Fehler schon mehrfach erörtert. Ist das öffnende Mediaquery-Statement entsprechend korrigiert?

★ 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
Julia121
Neues Mitglied
5 0 0

Hallo, ich habe das selbe Problem und bei mir funktioniert es nicht. Hast du mittlerweile eine Lösung gefunden?