So legen Sie die Thumbnail-Größen für WooCommerce Storefront fest

Veröffentlicht: 2020-09-26

Stellen Sie die Thumbnail-Größen für WooCommerce Storefront ein Wenn Sie einen WooCommerce-Shop betreiben, wissen Sie, dass Bilder einer der wichtigsten Bestandteile Ihres Online-Shops sind. WooCommerce verwendet jedoch so viele verschiedene Arten von Produktbildgrößen. Dies macht es schwierig herauszufinden, wo Sie sie ändern können, um sie an Ihre spezifischen Bedürfnisse anzupassen.

Stellen Sie die Thumbnail-Größen für WooCommerce Storefront ein

Dies bedeutet, dass die Anpassung von WooCommerce-Bildern etwas kompliziert werden kann. Aus diesem Grund habe ich diesen Leitfaden zusammengestellt, um jeden Aspekt von WooCommerce-Bildern zu besprechen, damit Sie zu dem Teil springen können, der zu Ihnen passt. Zusätzlich werde ich das Storefront-Theme verwenden.

Was sind die Vorteile der Einstellung Ihrer Produktbildgrößen?

Bevor wir auf das „Wie“ eingehen, fragen Sie sich vielleicht nach dem Warum? Hier sind einige der Vorteile:

Es verhindert Bildunschärfe. Bilder mit der falschen Größe können verschwommen erscheinen, was bei Ihren Käufern einen schlechten ersten Eindruck hinterlässt.
Es optimiert die Geschwindigkeit. Wenn ein Bild groß ist, dauert es länger, es zu laden. Dies verlangsamt Ihre Website und führt zu weniger Einnahmen und unzufriedenen Benutzern.

Schritte zum Ändern der Größe eines Produkt-Miniaturbildes

Standardmäßig erlaubt Ihnen WooCommerce, die Größe von Produktbildern zu ändern. Alles, was Sie tun müssen, ist diesen einfachen Schritten zu folgen:

Melden Sie sich bei Ihrer WordPress-Site an und greifen Sie als Admin-Benutzer auf das Dashboard zu.
Klicken Sie im Dashboard-Menü auf Darstellungsmenü > Anpassen.
Klicken Sie auf WooCommerce > Produktbilder.
Im Feld zum Zuschneiden von Miniaturansichten können Sie die Höhe der Bilder festlegen.
Klicken Sie auf Veröffentlichen , wenn Sie mit den Änderungen zufrieden sind.

Ultimativer Leitfaden zur Höhe von Produktbildern im Shop

Im Thumbnail-Feld werden Ihnen 3 verschiedene Möglichkeiten angeboten, die Höhe der Shop- bzw. Katalogbilder einzustellen:

1:1: Wenn Sie 1:1 wählen, werden Ihre Bilder auf 360 Pixel Breite und 360 Pixel Höhe zugeschnitten. Dies funktioniert, vorausgesetzt, Sie haben die Bildbreite auf 360 Pixel im Feld Miniaturbildbreite eingestellt.
Benutzerdefiniert: Hier können Sie das Seitenverhältnis des Bildes auswählen. Dies sind einige der beliebtesten Seitenverhältnisse (1:1, 5:4, 4:3, 3:2, 16:9 und 3:1).
Unbeschnitten: Bei dieser Option bleibt die Höhe des Bildes unverändert. Bilder in Ihrem Shop werden mit dem Seitenverhältnis angezeigt, in dem sie hochgeladen wurden.

Häufig gestellte Fragen

Wie kann ich die Bildgröße ändern, wenn der Theme-Entwickler sie festlegt?

Es gibt eine einfache Lösung dafür, indem Sie die Einstellungen für die Bildbreite aus der Datei functions.php Ihres Themes entfernen oder ändern. Im Storefront-Design gibt es keine Einstellungen für das Hauptbild oder die Miniaturansichtsfelder. Dies liegt daran, dass sie zuvor in storefront/inc/class-storefront.php so deklariert wurden

 // WooCommerce-Unterstützung erklären.

 add_theme_support( 'woocommerce', apply_filters( 'storefront_woocommerce_args', array(

 'einzelbild_breite' => 416,

 'thumbnail_image_width' => 324,

 'product_grid' => Array(

 'default_columns' => 3,

 'default_rows' => 4,

 'min_columns' => 1,

 'max_columns' => 6,

 'min_rows' => 1

 )

) ) );

Die Größe des Einzelproduktbildes wurde auf 416 Pixel Breite und die Miniaturansicht auf 324 Pixel Breite eingestellt. Das bedeutet, dass Sie entweder diese beiden Linien entfernen oder die Breitennummer auf Ihre gewünschte Breite ändern können. Sie müssen jedoch sicherstellen, dass Sie nach dem Erstellen eines untergeordneten Themas ändern. Dies liegt daran, dass es auf die vorherigen Einstellungen zurückgesetzt wird, wenn Sie das Design aktualisieren.

Wie kann ich Katalogbildgrößen festlegen?

Die Größe der Shop-Produktbilder und Katalog- oder Kategoriebilder wird basierend auf den Einstellungen im Feld Darstellung > Anpassen > WooCommerce > Produktbilder > Miniaturansichtsbreite angepasst .

Warum sind meine WooCommerce-Produktbilder verschwommen?

Wenn dies in Ihrem WooCommerce-Shop der Fall ist, können Sie einige Dinge überprüfen:

Überprüfen Sie die Qualität des Bildes. Überprüfen Sie, ob die Qualität gut ist und wenn es sich um eine niedrige Qualität handelt, wenn es Ihrem WooCommerce-Shop hinzugefügt wird, sieht es nicht so scharf und klar aus, wie Sie es möchten.
Thumbnail-Einstellungen. Überprüfen Sie die Einstellungen und wenn die Einstellungen nach einem 500-Pixel-Bild für Ihre Produktseite und einem 160-Pixel-Bild auf Ihrer Katalogseite suchen, Sie aber nur ein 160-Pixel-Bild hochladen, vergrößert WooCommerce Ihr Bild automatisch, wodurch es verschwommen aussieht.

Was ist die beste Bildgröße?

Die beste Bildgröße Ihres Online-Shops hängt von dem Thema ab, das Sie für Ihren Shop verwenden. Eine Bildgröße von 800 – 1000 Pixel Breite ist geeignet, wenn Sie ein einfaches Produkt wie ein Hemd verkaufen.

Wenn Sie jedoch ein detailliertes oder kompliziertes Bild haben, können potenzielle Kunden durch das Hochladen eines größeren Bildes hineinzoomen und diese Details aus der Nähe betrachten. Die empfohlene Größe ist 2000 Pixel breit, was besser funktioniert

Erwähnenswert ist auch, dass Sie niemals ein großes Bild hochladen sollten. Ein übergroßes Bild verlangsamt Ihre Website und wirkt sich daher wahrscheinlich auf den Umsatz aus.

Fazit

In diesem kurzen Tutorial haben Sie gelernt, wie Sie die Thumbnail-Größe von WooCommerce Storefront mit nur wenigen Klicks einstellen können. Außerdem habe ich erklärt, wie Sie die Größe von Produkt- und Galeriebildern ändern können, und eine ultimative Anleitung zu den Miniaturbildeinstellungen.

Darüber hinaus haben Sie die Vorteile der Einstellung Ihrer WooCommerce-Produktbildgrößen kennengelernt. Übergroße Bilder verlangsamen Ihre Website und wirken sich daher wahrscheinlich auf den Umsatz aus. Darüber hinaus habe ich einen Abschnitt mit häufig gestellten Fragen hinzugefügt, der einige häufig auftretende Probleme enthält, auf die Sie möglicherweise stoßen.

Bilder sind sehr wichtig, wenn es darum geht, Verkäufe in Ihrem Online-Shop zu tätigen. Stellen Sie sicher, dass Sie die in diesem Tutorial bereitgestellten Richtlinien befolgen, und wenn Sie sich der Änderungen nicht sicher sind, ziehen Sie die Verwendung eines Plugins wie WooThumbs für WooCommerce in Betracht. Damit können Sie die Größe Ihrer WooCommerce-Produktbilder problemlos ändern und Ihre WooCommerce-Produktgalerie verbessern.