So zeigen Sie auf der PrestaShop-Produktseite das Foto jeder Farbe oder Variante
· 2 Min. Lesezeit
Ein Dropdown mit «Blau, Rot, Grün» zwingt den Kunden zu raten, wie jede Version aussieht. Wir erklären, wie Sie die Bilder, die Ihre Kombinationen schon haben, nutzen, um jede Option mit ihrem Foto zu zeigen, was Sie in Katalog und Theme prüfen sollten und wie Varianten nach Attribut das ohne Programmierung erledigt.
Das Problem: eine Variante blind wählen
In vielen PrestaShop-Shops wird Farbe oder Ausführung in einem Dropdown mit Namen gewählt: «Blau, Rot, Grün», «Nussbaum, Eiche». Der Kunde muss sich jede vorstellen oder die Optionen durchklicken und warten, bis sich das Hauptfoto ändert.
- Manche geben auf und gehen.
- Andere wählen die falsche Variante und schicken sie zurück, mit den Versand- und Bearbeitungskosten, die das bedeutet.
- Auf dem Handy sind Dropdowns noch umständlicher.
Dabei gibt es die Fotos schon: Sie sind im Katalog jeder Kombination zugeordnet. Sie müssen nur dort gezeigt werden, wo der Kunde entscheidet.
Die Lösung: eine Reihe Miniaturen mit dem echten Foto
1. Ordnen Sie jeder Kombination ein Bild zu
Markieren Sie auf der Produktseite im Reiter Kombinationen für jede Kombination das Bild, das sie darstellt. Ohne das kann keine Lösung das richtige Foto zeigen. Beginnen Sie mit Ihren Bestsellern.
2. Wählen Sie das führende Attribut
Meist ist es die Farbe, es kann aber auch Ausführung, Material oder Muster sein. Die Miniaturen sollten nach diesem Attribut gruppieren: Hat ein Produkt Farben und Größen, eine Miniatur pro Farbe, nicht eine pro Kombination.
3. Zeigen Sie die Miniaturen neben der Auswahl
Der beste Platz ist direkt unter der Attributauswahl, vor «In den Warenkorb». Ein Klick auf eine Miniatur sollte diese Option in der nativen Auswahl des Themes wählen, damit Preis, Bestand und Warenkorb wie gewohnt funktionieren.
4. Achten Sie auf Größe und Barrierefreiheit
Nutzen Sie einen PrestaShop-Bildtyp in ähnlicher Größe wie die Miniatur, damit sie weder unscharf noch zu schwer ist. Hinterlegen Sie den Namen der Option als Alternativtext und heben Sie die gewählte Variante hervor.
Themes mit «Farbfeldern» zeigen meist nur ein Quadrat in der Attributfarbe, nicht das echte Foto des Produkts in dieser Farbe, und genau das hilft bei der Entscheidung.
So hilft Ihnen Varianten nach Attribut
Varianten nach Attribut ist unser Modul für PrestaShop 1.6.1 bis 9.2 (PHP 7.1 bis 8.4), das das echte Foto jeder Option auf die Produktseite bringt:
| Bedarf | Was das Modul tut |
|---|---|
| Echte Fotos | Eine Miniatur pro Wert des gewählten Attributs, mit dem Bild, das seiner Kombination bereits zugeordnet ist. Nichts Neues hochzuladen. |
| Ein Klick | Die Miniatur wählt die Option in der nativen Attributauswahl des Themes: Preise, Bestand und Warenkorb bleiben unberührt. |
| Jedes Attribut | Farbe, Ausführung, Material, Muster … die Attributgruppe, die Sie angeben. |
| Größe | Miniaturen von 24 bis 200 px und der Bildtyp Ihrer Wahl, so geprüft, dass sie nie unscharf sind. |
| Klarheit | Aktuelle Variante hervorgehoben und Name der Option als Tooltip und Alternativtext. Erscheint nur, wenn das Produkt zwei oder mehr Werte hat. |
| Position | Funktioniert ab der Installation im Standard-Hook displayProductAdditionalInfo; um es direkt nach der Auswahl zu platzieren, genügt eine Zeile in der Vorlage, erklärt im Reiter Hilfe. |
| Schlank | Nur eigenes Stylesheet und Skript, ohne externe Anfragen und ohne zusätzliche Tabellen. Nach der Deinstallation bleibt nichts zurück. |
Attributgruppe und Größe wählen, speichern, und Ihre Kunden sehen jede Option, bevor sie wählen.