Lange Zeit habe ich WooCommerce die verwandten Produkte selbst verwalten lassen. Ich habe ein paar Upsells oder Cross-Sells eingerichtet und dann weitergemacht. Aber dann fiel mir auf, wie oft die Kunden die Seite verließen, ohne etwas anderes zu entdecken, vor allem, wenn die Vorschläge nicht dem entsprachen, was sie wirklich suchten.
Ich begann, verschiedene Möglichkeiten zur Anzeige verwandter Produkte zu testen. Ich platzierte sie weiter oben auf der Seite, fügte sie dem Warenkorb hinzu und nutzte SeedProd, um Layouts zu entwerfen, die tatsächlich Sinn machten. Diese kleinen Änderungen führten zu mehr Klicks und größeren Bestellungen.
In diesem Leitfaden zeige ich Ihnen, wie Sie mit WooCommerce verwandte Produkte anzeigen können, indem Sie sowohl die integrierten Tools als auch einen visuellen Drag-and-Drop-Builder verwenden, der für mich am besten funktioniert hat.
Kurze Zusammenfassung: Wie man verwandte Produkte in WooCommerce anzeigt
- Einrichten von verknüpften Produkten in WooCommerce
Verwenden Sie den Standard-Produkteditor, um Upsells und Cross-Sells zu einzelnen Artikeln hinzuzufügen. - Zeigen Sie verwandte Produkte an, ohne ein Plugin zu verwenden
Lassen Sie WooCommerce automatisch Vorschläge auf der Grundlage von Produktkategorien und Tags anzeigen. - Anpassen der Layouts für verwandte Produkte mit SeedProd
Verwenden Sie einen Drag-and-Drop-Builder, um zu steuern, wo und wie verwandte Artikel in Ihrem Shop angezeigt werden. - Fügen Sie Produktempfehlungen zu Ihrem Warenkorb oder der Kassenseite hinzu
Fördern Sie Last-Minute-Einkäufe kurz vor der Kasse mit SeedProd-Blöcken. - Zeigen Sie Upsell-Angebote auf einzelnen Produktseiten an
Tauschen Sie die Standardeinstellungen von WooCommerce gegen ein übersichtlicheres, konvertierenderes Layout aus.
| Merkmal | Standard-WooCommerce | SeedProd Builder |
|---|---|---|
| Schwierigkeit der Einrichtung | Mäßig (Produkt für Produkt) | Einfach (Ziehen und Ablegen) |
| Entwurfskontrolle | Begrenzt | Vollständige visuelle Kontrolle |
| Platzierungsoptionen | Nur Produktseite | Produkt, Einkaufswagen, oder irgendwo |
| Benutzerdefinierte Layouts | Nicht unterstützt | Vollständig anpassbar |
| Upsells & Cross-Sells | Ja | Ja |
| Mobile Vorschau | Nein | Ja |
| Plugin erforderlich? | Nein | Ja (SeedProd) |
Sehen wir uns also an, wie man verwandte Produkte in WooCommerce anzeigt.
Wie man verwandte Produkte in WooCommerce einrichtet (kein Plugin erforderlich)
Wenn Sie Ihr WooCommerce-Theme nicht ändern oder ein Plugin für verwandte Produkte zu Ihrer Website hinzufügen möchten, können Ladenbesitzer verwandte Produkte mit den Standardeinstellungen von WooCommerce anzeigen.
Diese Methode bietet zwar nicht viele Anpassungsmöglichkeiten, aber eine einfache Möglichkeit für Upselling und Cross-Selling, um den durchschnittlichen Bestellwert der Verkäufe im Geschäft zu erhöhen.
Schritt 1. Verknüpfte Produkte im WooCommerce-Editor hinzufügen
Gehen Sie zunächst in Ihrer WordPress-Verwaltung auf Produkte " Alle Produkte und bearbeiten Sie ein beliebiges WooCommerce-Produkt. Scrollen Sie in den Produktoptionen nach unten zum Abschnitt "Produktdaten" und suchen Sie die Registerkarte " Verknüpfte Produkte".

Schritt 2. Wählen Sie Upsells und Cross-Sells für jedes Produkt
Der Abschnitt Verknüpfte Produkte hat 2 verschiedene Optionen: Upsells und Cross-Sells.
Denken Sie daran, dass Upsells Artikel sind, die dem ursprünglichen Produkt ähnlich sind, aber einen höheren Preis haben. Cross-Sells sind ähnliche Produkte, die der Kunde zusätzlich zum Hauptprodukt kaufen möchte.
Geben Sie die Produktnamen in das Feld ein, das Sie verwenden möchten, und klicken Sie auf die richtigen Einträge, wenn sie erscheinen.

Schritt 3. Vorschau verwandter Produkte auf der Produktseite
Nachdem Sie Cross-Sells oder Upsells zu Ihren WooCommerce-Produkten hinzugefügt haben, scrollen Sie auf der Seite nach oben und klicken Sie auf die Schaltfläche Vorschau der Änderungen.
Sie sehen die verwandten Produkte unter Ihrer aktuellen Produktbeschreibung.

Wie man WooCommerce Verwandte Produkte mit SeedProd anpasst
Sehen wir uns nun an, wie man mit SeedProd benutzerdefinierte verwandte Produktempfehlungen anzeigen kann.

SeedProd ist einer der besten Drag-and-Drop-Website- und Page-Builder für WordPress. Damit können Sie jeden Teil Ihrer WordPress-Website visuell und ohne Code erstellen und anpassen.
Sie können SeedProd auch verwenden, um Ihren WooCommerce-Shop anzupassen. Mit vollständigen WooCommerce-Websitevorlagen und leistungsstarken WordPress-Blöcken können Sie Ihren Online-Shop an Ihre spezifischen Designanforderungen anpassen, ohne einen Entwickler zu beauftragen.
So können Sie beispielsweise benutzerdefinierte Produktkategorieseiten erstellen, Beschreibungen von Produktmerkmalen konfigurieren und sogar ein Warenkorbmenü zur Navigation Ihres Shops hinzufügen.
Mit dieser Methode wird Ihr aktuelles WooCommerce-Theme durch ein benutzerdefiniertes Design ersetzt.
Sie benötigen keinen Code, keine Shortcodes, keine Child-Themes, keine Add-ons und keine empfohlenen Produkt-Plugins. Sie müssen nicht einmal Ihre functions.php-Datei bearbeiten. Stattdessen können Sie alles visuell und ohne viel Aufwand anpassen.
Folgen Sie also den nachstehenden Schritten, um mit dem Theme Builder von SeedProd ganz einfach neue empfohlene Produkte zu WooCommerce hinzuzufügen.
Schritt 1. Installieren und Aktivieren von SeedProd mit WooCommerce-Unterstützung
Um mit dieser Methode zu beginnen, müssen Sie die Elite-Version von SeedProd erwerben.
Es kommt mit voller WooCommerce-Unterstützung und allen Blöcken und Abschnitten, die Sie benötigen, um Produkte in Ihrem Shop anzupassen, Cross-Selling und Upselling zu betreiben.
Nachdem Sie Ihren Plan ausgewählt und Ihr Konto erstellt haben, gehen Sie auf die Registerkarte Downloads Ihres SeedProd-Kontos und laden Sie das Plugin herunter.

Kopieren Sie dabei Ihren Produktlizenzschlüssel, da Sie diesen in Kürze benötigen werden.
Gehen Sie nun zu Ihrer WordPress-Website und laden Sie die SeedProd .zip-Datei in Ihren Shop hoch. Wenn Sie dabei Hilfe benötigen, können Sie diese Anweisungen zur Installation und Aktivierung eines WordPress-Plugins befolgen.
Sobald das Plugin aktiv ist, navigieren Sie zu SeedProd " Einstellungen und fügen Sie den Lizenzschlüssel, den Sie soeben kopiert haben, in das entsprechende Feld ein.

Klicken Sie auf die Schaltfläche " Schlüssel überprüfen", und schon können Sie mit der Anpassung Ihrer WooCommerce-Website beginnen.
Schritt 2. Wählen Sie ein WooCommerce-Vorlagenkit in SeedProd
Als Nächstes gehen Sie in Ihrem WordPress-Dashboard zu SeedProd " Theme Builder . Hier können Sie jeden Teil Ihres WooCommerce-Themas anpassen, aber zuerst müssen Sie eine Vorlage auswählen.

Um eine Vorlage auszuwählen, klicken Sie auf die Schaltfläche Themes.
Sie können auch den WooCommerce-Filter auswählen, um nur WooCommerce-Vorlagen-Kits anzuzeigen.

Wenn Sie einen Bausatz gefunden haben, der Ihnen gefällt, bewegen Sie den Mauszeiger darüber und klicken Sie auf das Häkchensymbol.

SeedProd importiert das gesamte Kit in Ihre WordPress-Website, einschließlich Produktseiten, Warenkörbe, Kassen, Produktarchive und Shopseiten. Sie können alle diese Vorlagenteile im Dashboard des Theme Builders sehen.

Sie werden auch feststellen, dass SeedProd automatisch Inhaltsseiten wie die Seiten "Über", "Kontakt" und "Service" aus der Demo-Vorlage erstellt. Sie finden diese Seiten im Standard-WordPress-Seiten-Menü, wo Sie darauf klicken können, um sie mit dem Drag-and-Drop-Builder von SeedProd zu bearbeiten.

Nachdem Sie Ihre Vorlage installiert haben, können Sie damit beginnen, verwandte Produkte zu Ihrem Shop hinzuzufügen. Lassen Sie uns damit beginnen, verwandte Produkte auf der Warenkorb-Seite anzuzeigen.
Um Ihre Einkaufswagenseite zu bearbeiten, gehen Sie zum Dashboard des Theme Builders, suchen Sie die Vorlage Einkaufswagen, bewegen Sie den Mauszeiger darüber und klicken Sie auf den Link Design bearbeiten.

Ihre Warenkorbseite wird nun im visuellen Editor von SeedProd geöffnet.
Schritt 3. Verwandte Produkte zum Layout Ihrer Einkaufswagen-Seite hinzufügen
Wenn sich Ihre Einkaufswagen-Seite öffnet, sehen Sie, dass sie ein zweispaltiges Layout mit WordPress-Blöcken und -Abschnitten auf der linken Seite und einer Live-Vorschau auf der rechten Seite hat.

Wenn Sie auf eine beliebige Stelle in der Vorschau klicken, können Sie die Einstellungen und Styling-Optionen des jeweiligen Blocks mit wenigen Klicks anpassen. In den Einstellungen des Einkaufswagen-Blocks können Sie zum Beispiel die Typografie, die Schaltflächenstile, die Feldfarben und vieles mehr ändern.

Das Hinzufügen von verwandten Produkten zu Ihrer Warenkorb-Seite ist mit SeedProd super einfach.
Blättern Sie in der linken Seitenleiste zur Überschrift WooCommerce Template Tags und suchen Sie den Block Products Related. Klicken Sie nun auf den Block und ziehen Sie ihn auf Ihre Seitenvorschau.

In den Blockeinstellungen können Sie die Spalten anpassen und die Anzahl der verwandten Produkte ändern. Sie können auch bestimmte Produkte bestellen, indem Sie eine Option aus dem Dropdown-Menü auswählen:
- Datum
- Produkt-ID
- Menü Bestellung
- Popularität
- Zufällig
- Bewertung
- Titel

Auf der Registerkarte " Erweiterte Einstellungen" können Sie das Styling Ihres Blocks für verwandte Produkte anpassen. Sie können zum Beispiel die Typografie, Farben, Schaltflächen, Bildschatten und vieles mehr ändern.

Wenn Sie mit dem Ergebnis zufrieden sind, klicken Sie auf die Schaltfläche Speichern in der oberen rechten Ecke des Bildschirms.

Schauen wir uns nun an, wie man in WooCommerce mit SeedProd Produkte nach oben verkaufen kann.
Schritt 4. Upsell-Angebote auf einzelnen Produktseiten anzeigen
Wenn Sie WooCommerce-Produkte up-sellen möchten, können Sie den Upsell-Block von SeedProd verwenden. Aber zuerst müssen Sie die Produkte in Ihren WooCommerce-Produkteinstellungen verknüpfen, indem Sie die Schritte in Methode 1 ausführen.
Der Upsell-Block von SeedProd funktioniert nur auf einzelnen Produktseitenvorlagen. Sie müssen also zum Theme Builder-Dashboard zurückkehren und Ihre Produktseitenvorlage bearbeiten.

Die von uns verwendete Vorlage enthält bereits Produktempfehlungen. Entfernen wir also verwandte Produkte, indem wir auf das Mülleimersymbol klicken.

Als Nächstes suchen Sie den Upsell-Block im Abschnitt WooCommerce Template Tags und ziehen ihn auf Ihre Seite.

Sie werden keine Live-Vorschau dieses Blocks sehen, aber Sie können ihn wie den Block für verwandte Produkte anpassen.
Fahren Sie mit der Anpassung Ihrer WooCommerce-Website fort, bis Sie mit dem Aussehen zufrieden sind. Und vergessen Sie nicht, auf die Schaltfläche Speichern zu klicken, um Ihre Änderungen regelmäßig zu speichern.
Schritt 5. Veröffentlichen Sie Ihr Theme und machen Sie es live
Wenn Sie bereit sind, Ihre Änderungen auf Ihrer Website zu veröffentlichen, gehen Sie auf die Seite Theme Builder und suchen Sie den Schalter SeedProd-Theme aktivieren. Stellen Sie ihn auf "Ja", und Ihre Änderungen werden veröffentlicht.

Jetzt können Sie eine Vorschau Ihrer einzelnen Produktseiten und Einkaufswagenseiten anzeigen, um ähnliche Produktempfehlungen zu sehen.
Hier ist ein Beispiel für die Einkaufswagen-Seite:

Und hier sind die Upsell-Beispiele auf der Produktseite:

Wenn Sie verwandte Produkte ausblenden möchten, entfernen Sie einfach den neuen Abschnitt von Ihrer Seite.
Da haben Sie es!
Häufig gestellte Fragen zu verwandten Produkten in WooCommerce
Bei der Anzeige von verwandten Produkten in WooCommerce geht es nicht nur darum, Platz auf der Seite zu schaffen. Es ist ein einfacher Weg, um Kunden zu helfen, mehr von dem zu finden, was sie wollen, und es kann Ihren Umsatz in den Prozess leise steigern.
Wenn Sie mit den Standardeinstellungen zufrieden sind, bietet Ihnen WooCommerce alles, was Sie für den Anfang brauchen. Wenn Sie jedoch mehr Kontrolle darüber haben möchten, wie die Dinge aussehen und wo sie erscheinen, können Sie mit SeedProd alles ganz einfach anpassen, ohne eine einzige Zeile Code schreiben zu müssen.
Diese anderen WooCommerce-Tutorials und -Tipps könnten Ihnen auch gefallen:
- Beste WooCommerce-Plugins für Ihr Geschäft
- Hinzufügen von benutzerdefinierten "In den Warenkorb"-Schaltflächen in WooCommerce
- Wie man eine WooCommerce-Dankeseite erstellt (ganz einfach)
- So passen Sie die Registerkarte "Zusätzliche Informationen" von WooCommerce an
- Wie man den View Cart Button in WooCommerce hinzufügt
- Wie man den Titel der Shop-Seite in WooCommerce ändert
- Wie man eine beeindruckende Produktbildgalerie in WooCommerce erstellt
- Wie man Stern-Bewertung zu WooCommerce Produkt-Seiten hinzufügen
- Wie man Produktbeschreibungen in WooCommerce erhält und anzeigt
- Wie man in WooCommerce vorgestellte Produkte anzeigt
- Wie man nicht vorrätige Produkte in WooCommerce ausblendet
Vielen Dank fürs Lesen! Wir würden uns freuen, Ihre Meinung zu hören. Bitte beteiligen Sie sich an der Konversation auf YouTube, X und Facebook, um weitere hilfreiche Ratschläge und Inhalte für das Wachstum Ihres Unternehmens zu erhalten.
