FROM CACHE - de_header
Diese Community hat auf Peer-to-Peer-Support umgestellt. Der Shopify Support wird diese Community nicht mehr betreuen. Wir empfehlen dir, dich mit anderen Händler:innen und Partner:innen in Verbindung zu setzen, um Unterstützung zu erhalten und Erfahrungen auszutauschen. Bitte melde weiterhin alles, was gegen unseren Verhaltenskodex verstößt, oder Inhalte, die deiner Meinung nach entfernt werden sollten.

Betreff: bilder verkleinern Desktop mit Abstand rechts und links

bilder verkleinern Desktop mit Abstand rechts und links

Afram
Tourist
11 0 0

Hey, 

 

Ich habe einen Problem mit den Bildern Auf dem Desktop . Undzwar ist das Problem dass die Bilde viel zu viel platz nehmen also die sind viel zu groß deshalb wollte ich fragen ob man nicht für die Desktop variante, links und rechts Abstand machen kann sodass das Bild in der Mitte bleibt aber dafür halt kleiner und dementsprechend ist dann rechts und links ein Abstand. Weil auf der Mobile version ist alles okay . Und ich habe auch einen BildSeitenverhältnis von 3 zu 2 also daran kann es auch nicht liegen.

 

Ich hoffe Jemand kann mir helfen.

 

mit freundlichen Grüßen

 

Afram

3 ANTWORTEN 3

Kai
Shopify Staff
2432 556 378

Hi @Afram

vielen Dank für deinen Post. 

 

Welches Theme verwendest du genau?

 

Wer dein Theme entwickelt hat und unterstützt siehst du so nach.

 

Da du dich gerade mit dem Design deines Shopify Shops beschäftigst, dachte ich kannst du bestimmt auch von diesen Tips zum Thema profitieren, die erlautern, wie man einen Shopify Shop erstellt, der sich von anderen abhebt. Welche der darin erhaltenen Vorschläge würdest du in deinem eigenen Shop gerne umsetzen?

 

Ich freue mich auf deine Antwort,

 

Kai | 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

Afram
Tourist
11 0 0

Hey @Kai,

ich bentze das Theme Dawn-Version 9.0.0

Gabe
Shopify Staff
19233 3006 4433

Hey Afram! @Afram 

 

Das Dawn Theme ist ein "Large Images" und "Media Forward Produktseiten" Theme wie man auf der Dawn Theme Landingpage lesen kann. Sprich, es ist designed, um große Produktbilder zu präsentieren, die dein visuelle Markenstorytelling unterstützen:

 

 

Hast du auch andere Themes zum Shop hinzugefügt um sie zu testen und schauen ob sie für deine Produkte und dein Branding besser geeignet sind? Meine Empfehlung wäre man sollte es lieber nicht nur beim "Standard Dawn Them lassen.

 

Wenn du das aber DIY im Code machen möchtest

Wenn du es selber auf deiner Produktseite programmieren möchtest dann bitte immer in einer Themekopie/Testumgebung zuerst testen und zusammen mit einem Experten/Programmierer. Du kannst ein Backup deines Themes erstellen, bevor man den Code bearbeitet, oder den Code wiederherstellen, falls dies nötig sein sollte. Du könntest auch einen unserer Experten engagieren indem du die hier eine E-Mail rüberschießt. Unsere Experten antworten meist sehr schnell.

Änderungen zu deinem Theme Code können auch 1) die Page Loading Speeds negative beeinflussen und 2) dein Theme aus den Theme Updates ausschließen. Das folgende ist Theme-abhängig, ohne Gewähr und dient lediglich dazu dich in die richtige Richtung zu weisen!

 

Um den Platz, den die Bilder auf deinem Desktop im Dawn Theme einnehmen, zu reduzieren, kannst du den CSS-Code des Themes ändern, um Abstände hinzuzufügen oder die Bildgröße zu ändern. Bitte beachte, dass diese Änderungen ein gewisses Verständnis für Webentwicklung erfordern und ich empfehle hier, wie gesagt, dich mit einem Webentwickler zusammen zu tun.]

 

Du kannst ganz unten in einer Theme Kopie in der Assets -> base.css einen Code wie den folgenden ergänzen, oder eben den neuen CSS Editor direkt im Theme dafür verwenden:

 

@media screen and (min-width: 992px) {
    .your-image-class {
        max-width: 80%; /* Ändern Sie diesen Wert entsprechend Ihrer Vorstellung */
        margin-left: auto;
        margin-right: auto;
        display: block;
    }
}

 

Ersetze ".your-image-class" durch die tatsächliche Class deiner Bilder. Du kannst die Class deiner Bilder finden, indem du auf der Seite einen Rechtsklick auf das Bild machst -> "Inspect".

Dieser CSS-Code stellt sicher, dass die Änderungen nur auf Desktop-Bildschirmen angewendet werden (Bildschirme, die breiter als 992px sind). Es ändert die maximale Breite des Bildes auf 80% und zentriert das Bild horizontal.

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