WooCommerce: Produktbilder an der Kasse anzeigen

WooCommerce
WooCommerce: Produktbilder an der Kasse anzeigen

In der Bestellübersicht an der Kasse in Ihrem WooCommerce Onlineshop werden keine Produktbilder angezeigt und Sie möchten das ändern? In diesem Artikel zeigen wir, wie sich das mit nur wenigen Handgriffen bewerkstelligen lässt. Grundlegende Programmierkenntnisse sind dabei allerdings vorausgesetzt.

Der Wunsch, die Produktbilder an der Kasse eines WooCommerce Onlineshops anzeigen zu lassen, kann verschiedene Gründe haben. Einer dürfte mit Sicherheit die Optimierung von WooCommerce für den Händlerbund sein. Je nachdem, welche Produkte in einem Shop vertrieben werden, bietet sich die Darstellung der Artikelbilder aber auch als stilistisches Werkzeug an, um dem Kunden einen besseren Überblick über die zu bestellende Waren zu geben. Je nach verwendetem Theme werden die Artikelbilder zwar noch im Warenkorb angezeigt, im Checkout-Prozess hingegen ist das Layout oftmals reduzierter und kommt ohne jegliche Fotos aus.

Produktfotos im Checkout anzeigen

Wer im Bereich der Programmierung oder im Umgang mit WooCommerce noch nicht allzu vertraut ist, sollte zunächst eine Datensicherung des WooCommerce Shops erstellen, bevor die folgenden Schritte befolgt werden. Dann steht der Bilderintegration auch schon nichts mehr im Wege.

  1. Zunächst müssen Sie sich per (s)FTP mit dem Server verbinden.
  2. Dort navigieren Sie in das Verzeichnis /wp-content/plugins/woocommerce/templates/checkout/ und laden die Datei review-order.php herunter.
  3. Diese Datei wird jetzt um den entscheidenen Code-Schnipsel ergänzt, der dann die Artikelbilder darstellt.

    Am Besten ergänzt man den Code-Snippet vor dem Produkt-Titel. An welcher Stelle im Code die Produkt-Titel ausgegeben werden, verrät unser zweiter Code-Auszug.
  4. Code integriert? Dann müssen Sie die Datei speichern und wieder auf den Webserver legen. Allerdings nicht mehr in das Verzeichnis, aus der Sie die Datei heruntergeladen haben. Bei einem Update von WooCommerce würde diese Modifikation sonst überschrieben werden. Um das zu vermeiden, nagivieren Sie auf dem Server in das Verzeichnis des gegenwärtig verwendeten Themes. Dieses findet sich unter /wp-content/themes/das-verwendete-theme/.
  5. Erstellen Sie im Theme-Verzeichnis ein Unterverzeichnis namens /woocommerce/ und in wiederum diesem Verzeichnis eines namens /checkout/. Dort muss jetzt nur noch die bearbeitete review-order.php-Datei hochgeladen werden. Und schon ist die Modifikation sicher vor den kommenden Updates. Bei WooCommerce lassen diese bekanntlich nicht lange auf sich warten.
  6. Fertig!


Interessante Artikel zum Thema „WooCommerce“


Sie benötigen eine WordPress Agentur? Wir stehen als Ihre Experten zur Verfügung. Treten Sie mit uns in Kontakt und vereinbaren Sie ein unverbindliches Beratungsgespräch.

Eine Meinung zu “WooCommerce: Produktbilder an der Kasse anzeigen
  1. Hey, sehr cooles Tutorial. Hat perfekt funktioniert. Habt ihr noch einen Tipp, wie man die Größe des Bildes anpassen kann?
    Vielen Dank!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Ähnliche Artikel
WooCommerce SEO – Alles, was wichtig ist

Das Thema Suchmaschinenoptimierung ist allgegenwärtig. Das bezieht sich allerdings nicht nur auf Webseiten im eigentlichen Sinn, sondern auch auf Shop-Systeme wie WooCommerce. Auch und...
mehr lesen

WooCommerce: Barzahlung als Zahlungsmittel einrichten

Ab Werk bietet WooCommerce verschiedene Zahlungsmethoden an, die einfach eingerichtet und aktiviert werden können. Barzahlung ist keine Standard-Zahlungsart. Möchte man seinen Kunden im Shop...
mehr lesen

Story-Telling im E-Commerce – darauf ist zu achten

Für das Online Marketing ist das sogenannte Story-Telling ein nach wie vor bedeutsames Thema. Dabei geht es vor allem um tolle Einkaufserlebnisse für die...
mehr lesen

Cross-Selling und Up-Selling: Was ist das? Vorteile & Risiken

Wer ein Geschäft oder einen Onlineshop betreibt, sucht ständig nach Möglichkeiten, den Umsatz zu steigern, denn der Wettbewerb ist hoch und es ist nicht...
mehr lesen