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.
