Minimal Theme - Produktbilder in Kategorieansicht vergrößern

[DadTee]

Hallo,

gibt es die Möglichkeit die Größe der Produktbilder in der Kategorieansicht zu ändern.

Gerade in der mobile Ansicht sind die Produktbilder sehr klein und ich sehe auf meinem Handy 4 Produkte zur gleichen Zeit.

Danke

Viele Grüße

Daniel

[Gabe]

Hey @DadTee 

Danke für die Frage und wenn du für uns ein Preview Link hier einfügst, können wir ein Blick in dein Minimal Theme werfen. Den Link kannst du selbstverständlich danach wieder aus dem Thread entfernen.

Aber das Minimal Theme "does what it says on the tin", sprich, ist so wie es heißt -> Minimal. Frage dazu: hast du auch andere Themes getestet um das beste Theme für deine Produkte und Branding zu finden? Siehe zwei Feedback Leitfäden von heute wo ich dieses Thema eingehe hier und hier.

Und wenn man Sachen ändern möchte, v. a. auf Handy, dann muss man in den Code eingreifen und hier werden meist fortgeschrittene Coding Skills verlangt. Da das ein Shopify Theme ist und du auf einem bezahlten Plan dann können wir das ggf. anschauen als Teil deiner 60-Min Design Time. Schicke uns eine E-Mail und unser Theme Team wird das anschauen können.

DIY 

Wenn du das aber lieber selber probieren (do-it-yourself) möchtest dann ab ins Code (aber bitte in einer Theme Kopie zuerst testen!)

Du kannst z. B. den folgenden Code im .css einfügen, aber jedes Theme ist ja etwas anders in der Code Struktur:

.large--one-quarter {
 width: 60%;
}

Das obige Code ist aber wie man sieht nicht responsive  und die folgenden 2 Codebeispiele sind Beispiele wie man das mit responsive  im css machen kann (aber, wie gesagt, ohne Gewähr)

@media screen and (max-width: 760px) {
  .grid--uniform>.grid__item {
     padding-left: 10px;
  }
  .grid--uniform {
     margin-left: -10px;
  }
}

@media screen and (max-width: 760px) {
  .grid.grid--uniform {
    margin-left: -40px;
    position: relative;
    left: 15px;
  }
  .main-content {
    overflow: unset!important;
  }
}

[DadTee]

Hallo Gabe,

ich hab das mit dem .css mal ausprobiert aber funktioniert bei mir nicht. Zudem bekomme ich im Code Editor folgendes angezeigt:

[SCSS-Support in Themes ist veraltet

Wandle .scss- und .scss.liquid-Dateien für eine bessere Leistung des Onlineshops und Theme-Editors in .css- oder .css.liquid-Dateien um.]

Also vielleicht geht es auch deswegen nicht...

Ich hab es allerdings über folgenden Vorgang geschafft, die Produktbilder in der Gallerieansicht größer darzustellen:

The key is to change this line of code:

{% assign grid_item_width = 'wide--one-fifth large--one-quarter medium-down--one-half' %}

For 3 columns, change to:

{% assign grid_item_width = 'wide--one-third large--one-third medium-down--one-half' %}

Das funktioniert soweit auch alles, allerdings sind die Bilder nur in der Desktop ansicht größer, in der Mobile-Ansicht sind sie immernoch genauso klein.

Wie kann ich sie auch in der Mobile Ansicht größer darstellen?