FROM CACHE - de_header

Bilder auf Produktseite größer darstellen

Gelöst
mayson1
Tourist
5 0 1

Hallo, ich verwende das Kalles Theme und würde gerne meine Bilder auf der Produkseite/Artikeldetailseite größer darstellen. 

Ist das irgendwie möglich? 

Lieben Dank

1 AKZEPTIERTE LÖSUNG

Anerkannte Lösungen
Gabe
Shopify Staff
Shopify Staff
9182 1388 2292

Erfolg.

Hey @mayson1 

Leider kenne ich das "Kalles" Theme gar nicht (Themeforest?) und es wird scheinbar auch nicht von uns unterstützt.

The4 scheinen das Theme zu unterstützen. Haben deren Entwickler dir helfen können? Wenn man Sachen ändern möchte, wie die Bildergrößen, muss man schauen, dass es v. a. auf Handy dann auch ok aussieht. Um das zu machen muss man in den Code eingreifen und hier werden meist fortgeschrittene Coding Skills verlangt. Das macht man auch meistens in der Themekopie zuerst und nicht im Live Theme.

DIY 

Wenn du das aber lieber selber probieren (do-it-yourself) möchtest dann ab ins Code aber, wie gesagt in einer Theme Kopie zuerst testen! Siehe ein paar Leitfäden die dir vielleicht helfen können hier.

Du kannst z. B. den folgenden Code im .css einfügen, aber ohne Gewähr denn 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;
  }
} 
SCSS-Support in Themes ist jetzt auch veraltet also wandelt man die .scss und .scss.liquid Dateien für eine bessere Leistung des Onlineshops und Theme-Editors in .css oder .css.liquid Dateien um. Die Produktbilder kann man auch in der Galerieansicht größer darstellen. Folgendes Code:
{% assign grid_item_width = 'wide--one-fifth large--one-quarter medium-down--one-half' %}

In das hier ändern:

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

Allerdings sind da die Bilder nur in der Desktop Ansicht größer. Damit muss man selber basteln bis es klappt.

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

1 ANTWORT 1
Gabe
Shopify Staff
Shopify Staff
9182 1388 2292

Erfolg.

Hey @mayson1 

Leider kenne ich das "Kalles" Theme gar nicht (Themeforest?) und es wird scheinbar auch nicht von uns unterstützt.

The4 scheinen das Theme zu unterstützen. Haben deren Entwickler dir helfen können? Wenn man Sachen ändern möchte, wie die Bildergrößen, muss man schauen, dass es v. a. auf Handy dann auch ok aussieht. Um das zu machen muss man in den Code eingreifen und hier werden meist fortgeschrittene Coding Skills verlangt. Das macht man auch meistens in der Themekopie zuerst und nicht im Live Theme.

DIY 

Wenn du das aber lieber selber probieren (do-it-yourself) möchtest dann ab ins Code aber, wie gesagt in einer Theme Kopie zuerst testen! Siehe ein paar Leitfäden die dir vielleicht helfen können hier.

Du kannst z. B. den folgenden Code im .css einfügen, aber ohne Gewähr denn 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;
  }
} 
SCSS-Support in Themes ist jetzt auch veraltet also wandelt man die .scss und .scss.liquid Dateien für eine bessere Leistung des Onlineshops und Theme-Editors in .css oder .css.liquid Dateien um. Die Produktbilder kann man auch in der Galerieansicht größer darstellen. Folgendes Code:
{% assign grid_item_width = 'wide--one-fifth large--one-quarter medium-down--one-half' %}

In das hier ändern:

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

Allerdings sind da die Bilder nur in der Desktop Ansicht größer. Damit muss man selber basteln bis es klappt.

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