ZenCart. Wie verwaltet man Größen von Produktbildern

Das jeweilige Tutorial zeigt, wie verwaltet man Größen von Produktbildern in ZenCart Vorlagen.

Klein (Small) – ein Vorschaubild, das auf der Hauptseite und Seite von der Produktliste angezeigt wird.

Mittelgroß (Medium) – ein Vorschaubild, das auf der einzelnen Produktseite angezeigt wird.

Groß (Large) – ein Bild, das geöffnet wird, sobald Sie auf den Link ‘größeres Bild’ (‘larger image’) auf der einzelnen Produktseite drücken.

1. Die Bildgrößen können im Control Panel ZenCart im Menü Administrator > Einstellungen > Bilder (Admin > Configuration > Images) bearbeitet werden.

2. Hier können die folgenden Bildoptionen geändert werden:

   1. Breite des kleinen Bildes (Small Image Width)

   2. Höhe des kleinen Bildes (Small Image Height)

   3. Breite des Produktbildes auf der Kategorienseite (Product Listing Width)

   4. Höhe des Produktbildes auf der Kategorienseite (Product Listing Height)

   5. Breite des Produktbildes auf der Hauptseite (Product New Listing Width)

   6. Höhe des Produktbildes auf der Hauptseite (Product New Listing Height)

   7. Breite des neuen Produktbildes (New Products Width)

   8. Höhe des neuen Produktbildes (New Products Height)

   9. Breite des ausgewählten Produktbildes (Featured Products Width)

   10. Höhe des ausgewählten Produktbildes (Featured Products Height)

   11. Breite des Produktbildes in der Produktliste (Product All Listing Width)

   12. Höhe des Produktbildes in der Produktliste (Product All Listing Height)

   ACHTUNG: Alle Werte der Breite und Höhe müssen gleich sein. Die Optionen 1,3,5,7,9 und 11 müssen den gleichen Wert haben. Die Optionen 2,4,6,8,10 und 12 müssen auch den gleichen Wert haben.

3. Bearbeiten Sie die Bildgrößen und speichern Sie die Änderungen, indem Sie auf den Button aktualisieren (update) drücken:

   

4. Öffen Sie jegliche Produktseite auf Ihrer Webseite im Browser Firefox, wo Sie noch zusätzlichв Firebug installieren müssen, wenn dies noch nicht installiert wurde. Mit Hilfe von Firebug sollen Sie die Höhe des neuen Bildes und die Zeile in der Datei .css bestimmen, wo auch den Höhenwert geändert werden muss.

5. Um Firebug zu öffnen, drücken Sie aufs Icon Firebug in der rechten oberen Ecke des Browsers Firefox.

6. Klicken Sie auf das notwendige Element auf der Webseite, um es zu untersuchen.

7. Klicken Sie aufs Bild und ändern Sie den Höhenwert im Fenster Firebug manuell.

8. Mit der rechten Maustaste drücken Sie auf den Namen der .css Datei in Firebug und wählen Sie die Option Adresse kopieren (Copy location) aus:

   

9. Die jeweilige Regel muss sich in der Datei stylesheet_main.css im Ordner /includes/templates/themeXXX/css/ auf dem Server befindet. Aber manchmal können andere Regeln verwendet werden, und die jeweilige Datei kann sich in einem anderen Ordner anhängig von der Version Ihrer Vorlage befindet.

10. Bearbeiten Sie die Breite und Höhe des Bildes nach Ihrem Ermessen.

11. Speichern Sie die Änderungen in der .css Datei und laden Sie es auf den Server noch einmal hoch.

12. Aktualisiren Sie die Produktseite. Das Produktbild müssen die festgelegten von Ihnen Größen haben.

Jetzt können Sie selbst Größen von Produktbildern in ZenCart Vorlagen verwalten.

Sie können auch das ausführliche Video-Tutorial nutzen: