5 Einfache Möglichkeiten, Produkte in einem WordPress-Online-Shop anzuzeigen

Das Anzeigen von Produkten in einem WordPress-Online-Shop kann für einen E-Commerce-Neuling ein Albtraum sein. Als ich mit dem Aufbau meines Online-Shops begann, dachte ich, es wäre ein Kinderspiel, meine Artikel auf der Homepage meiner Website zu platzieren. Aber die ganze Aufgabe war ein harter Kampf!

Nach meiner eigenen Erfahrung kann das Erscheinen von Produkten auf Ihrer Website viel Zeit in Anspruch nehmen, insbesondere wenn Sie neu im E-Commerce sind. Ich habe gelernt, dass es eine Aufgabe ist, die gute Kenntnisse in WordPress erfordert.

Angezeigte Produkte in einem Online-Shop

Von Jan Saints (Eigene Arbeit): CC-BY-2.0

Wenn Sie zum ersten Mal einen WordPress-Onlineshop erstellen, müssen Sie unbedingt lernen, wie Sie mit diesem Content-Management-System eine allgemeine Website einrichten. Sie müssen sich auch mit Dingen wie E-Commerce-Plugins, Widgets und Shortcodes vertraut machen. Wenn Sie WooCommerce verwenden, müssen Sie außerdem die verfügbaren Optionen für die Produktanzeige kennen und die allgemeinen Einstellungen des Plugins kennen. Diese einfache Anleitung zum Erstellen eines Online-Shops und zum Anzeigen von Artikeln (von Riccardo Andronaco) erklärt all dies und ich fand es sehr hilfreich.

In diesem Artikel werde ich fünf Möglichkeiten zum Anzeigen und Anordnen von Produkten auf einer WordPress-E-Commerce-Website erläutern. Lesen Sie weiter, um zu erfahren, wie Sie Elemente auf Ihren Webseiten anzeigen und entsprechend anordnen können.

Fünf Möglichkeiten zum Anzeigen und Anordnen von Elementen in einem WordPress-Online-Shop

1. Die automatische Methode
2. Widgets
3. Plugins
4. Shortcodes
5. Schieberegler

1. Verwenden der automatischen Methode

Wie der Name schon sagt, müssen Sie nichts tun, damit die Produkte auf der Shop-Seite erscheinen. Die Elemente werden angezeigt, wenn Sie sie über das Dashboard hinzufügen. Sie werden automatisch in alphabetischer Reihenfolge oder zufällig mit oder ohne Kategorien angeordnet, abhängig von Ihren WooCommerce-Anzeigeeinstellungen.

Die Homepage kann nur eine bestimmte Anzahl von Produkten aufnehmen. Wenn Sie also eine große Anzahl von Produkten haben, werden einige davon auf den Seiten 2, 3, 4 usw. platziert.

Diese Methode macht es Ihren Kunden schwer, alle Arten von Produkten in Ihrem Shop zu kennen, da sie keine Kategorien enthalten und einige Artikel auf anderen Seiten ausgeblendet sind.

Möglicherweise müssen Sie diese Methode vermeiden, wenn Sie einige bessere Methoden (siehe unten) zum Anzeigen von Elementen verwenden können. Wenn Sie jedoch eine Reihe von Elementen haben, die auf eine Seite passen, z. B. die Startseite, können Sie diese Methode anwenden.

Zufällig angezeigte Produkte

Von Jan Saints (Eigene Arbeit): CC-BY-2.0

2. Verwenden von Widgets

Wie Sie vielleicht wissen, ist ein Widget in WordPress ein kleiner Inhaltsblock, der in den Bereichen Seitenleiste und Fußzeile platziert werden kann. Es bietet eine einfache Möglichkeit, eine Website anzupassen. Einige gängige Widgets sind: Letzte Beiträge, Suchfeld, Kategorien und Fußzeilenmenü.

In einer E-Commerce-Website können Widgets verwendet werden, um Produktkategorien in der Seitenleiste oder Fußzeile anzuzeigen. Sie können daher eine großartige Möglichkeit sein, die oben diskutierte automatische Methode zu verbessern, die keine Produktkategorien enthält.

Einige großartige Widgets, die mit E-Commerce-WordPress-Themen geliefert werden, umfassen beliebte Produkte, aktuelle Produkte, meistverkaufte Produkte, erstklassige Produkte und vorgestellte Produkte. Diese Widgets sind anpassbar, dh Sie können sie mit den tatsächlichen Kategorien Ihrer Artikel umbenennen. Sie können sie auch per Drag & Drop verschieben, um ein Arrangement zu erhalten, das Ihrem Stil entspricht.

Da Widgets Produkte nur in den Seitenleisten und Fußzeilen anzeigen können, sind sie für die meisten Online-Shop-Besitzer unerwünscht. Der beste Ort zum Anzeigen von Elementen befindet sich in der Hauptleiste einer Seite, was mit Widgets nicht erreicht werden kann.

Produkte, die mithilfe eines Plugins in einer Seitenleiste angezeigt werden

Von Jan Saints (Eigene Arbeit): CC-BY-2.0

3. Plugins verwenden

In WordPress ist ein Plugin eine Reihe von Programmen, die eine Gruppe von Funktionen, Merkmalen oder Diensten enthalten. In diesem Content-Management-System gibt es Zehntausende von Plugins (sowohl kostenlos als auch Premium), die für eine Vielzahl von Anforderungen geeignet sind. Es gibt Plugins für alle Arten von Websites, zum Beispiel Plugins für E-Commerce (wie WooCommerce), Verzeichnisse, Blogs, Wiederverkaufs- und Buchungsplattformen.

Wenn es darum geht, Artikel in einem Online-Shop anzuzeigen und anzuordnen, gibt es eine Vielzahl von Plugins, mit denen Sie diese Aufgabe ausführen können. Die meisten Plugins sind jedoch nicht sehr effektiv, daher müssen Sie sich für diejenigen entscheiden, die nachweislich funktionieren.

Die am meisten empfohlenen Plugins zum Anzeigen von Elementen in einem WordPress-Onlineshop sind Ultimate Product Catalog und WooCommerce Product Sort and Display.

Das Sortier- und Anzeige-Plugin funktioniert besser mit einem anderen Plugin namens Endless Scroll, mit dem Sie eine große Anzahl von Artikeln auf Ihrer Shop-Seite anzeigen können. Nach der Installation und Aktivierung der beiden Plugins müssen Sie zu den Produktkategorien wechseln und die Kategorien per Drag & Drop verschieben, um die richtige Anzeige zu erhalten. Sie können dann die Anzahl der Produkte festlegen, die pro Kategorie mit Links angezeigt werden sollen, um alle anzuzeigen.

Für die Sortierung wird das Plugin standardmäßig nach Beliebtheit, Neuheit, Preis (niedrig bis hoch und umgekehrt) sortiert und zum Verkauf angeboten. Einige dieser Funktionen sind in der Premium-Version des Plugins enthalten. Es wird daher empfohlen, diese Version zu verwenden.

Das andere Plugin, Ultimate Product Catalog, ist etwas komplex. Nach der Installation und Aktivierung des Plugins müssen Sie alle Ihre Produkte und Kategorien hinzufügen, um IDs zu erhalten, die Sie in Shortcodes zur Anzeige Ihrer Artikel verwenden können. Sie müssen auch einige kleine Kataloge für Ihre Artikel erstellen.

Der folgende Shortcode zeigt beispielsweise Produkte im Katalog mit der ID "x" an.

oder

Das Plugin ist vollgepackt mit Funktionen wie anpassbaren Kataloglayouts, Verkaufspreisen, Produktimport, Währungssymbol, Breadcrumbs, Social Media Share, Produktbewertung und -bewertungen, SEO by Yoast-Integration und einer Vielzahl von Einstellungsoptionen.

Die im Plugin enthaltenen Produktkatalogstile umfassen: Minimalist, Block, Hover und Layout mit Registerkarten. Einige dieser Stile und auch einige der oben beschriebenen Funktionen sind mit der Premium-Version des Plugins verfügbar.

Produkte, die mit Hilfe eines Plugins im Blockstil angezeigt werden

Von Jan Saints (Eigene Arbeit): CC-BY-2.0

4. Verwenden von Shortcodes

Wenn Sie WooCommerce für Ihren Online-Shop verwenden, finden Sie Shortcodes als einfachste Möglichkeit, Produkte auf Ihrer Shop-Seite anzuzeigen. Die Shortcodes arbeiten mit Produkt- und Kategorie-IDs und SKUs und können einfach kopiert und auf der Shop-Seite eingefügt werden, um Artikel anzuzeigen. Siehe die Shortcodes unten.

- Zeigt eine Auflistung der Kategorien an.

- zeigt eine bestimmte Anzahl von Kategorien an und funktioniert gut mit den folgenden Argumenten. Hinweis: Diese Argumente können auch mit diesem Shortcode verwendet werden.

• number = "null" - um die Anzahl der Kategorien anzuzeigen.
• orderby = "name" - um Kategorien anzuzeigen, wenn sie nach Namen sortiert sind. Hinweis: Der Wert "Name" kann durch Datum, Rand (zufällig), geändert und keine ersetzt werden.
• order = "asc" - um Kategorien in aufsteigender Reihenfolge anzuzeigen. Hinweis: Der Wert "asc" kann in absteigender Reihenfolge durch "desc" ersetzt werden.
• Spalten = "x" - um "x" Spalten einer Kategorie anzuzeigen.
• hide_empty = "1" - um Kategorien auszublenden.
• hide_empty = "0" - um Kategorien anzuzeigen.
• parent = "0" - um Kategorien der obersten Ebene anzuzeigen.
• ids = "x" - um die Kategorie mit der ID "x" anzuzeigen.
• category = "x" - um die Kategorie "x" anzuzeigen.

• category_limit - um eine begrenzte Anzahl von Kategorien anzuzeigen.
• archive_template - um eine bestimmte Archivvorlage für eine bestimmte Liste anzuzeigen.
• design_scheme - um eine bestimmte Farbe oder Größe anzuzeigen.
• sort = "0" - zum Deaktivieren der Produktsortierauswahl.
• sort = "1" - um die Produktsortierauswahl zu aktivieren.
• = "1" - um den Shortcode zu aktivieren.
• post_type - um Einträge eines anderen Beitragstyps anzuzeigen.
• per_row - um Produkte pro Zeile anzuzeigen.
• leer - um einen bestimmten Text anzuzeigen, wenn keine Produkte angezeigt werden sollen.

• - zeigt "y" -Elemente der Kategorie "x" an, die in "z" -Spalten angezeigt und in absteigender Reihenfolge angeordnet sind, abhängig vom Datum, an dem sie veröffentlicht wurden.
• - Zeigt die Produktliste an.
• - Zeigt den Produktnamen an. Hinweis: Der Wert "Name" kann durch andere Werte ersetzt werden, um weitere Shortcodes zu bilden. Einige dieser Werte umfassen: Preis, Beschreibung, Kurzbeschreibung, Attributtabelle, SKU, Versand, Galerie und verwandte Kategorien.
• - Zeigt Kategorien für die aktuelle Produktlistenseite an.
• - Zeigt Produkte für die aktuelle Produktlistenseite an.
• - zeigt Semmelbrösel.
• - zeigt eine begrenzte Anzahl von Produkten.
• - Zeigt eine Zurück-zu-Produkt-URL an, die auf die Hauptseite der Produktliste verweist.
• - zeigt Produkte, die derzeit zum Verkauf stehen.
• - zeigt Produkt mit der ID "x".
• - zeigt Produkte mit den IDs "x", "y" und "z".
• - zeigt Produkt mit SKU "xyz"
• - zeigt Produkt mit SKU "abc", "def" und "ghi".
• - Zeigt den Preis an und fügt den Warenkorb für ein Produkt mit der ID "x" hinzu.
• - Zeigt den Preis an und fügt den Warenkorb für ein Produkt mit der SKU "x" hinzu.
• - Zeigt maximal "x" Elemente an.
• - Zeigt Produkte mit einem bestimmten Attribut an, dh dem Attribut "Farbe" und der Farbe "Schwarz".

• - zeigt "x" aktuelle Produkte an, die in "y" -Spalten angezeigt und in absteigender Reihenfolge angeordnet sind, abhängig vom Datum, an dem sie veröffentlicht wurden.
• - Zeigt Produkte mit "x" an, die in "y" -Spalten angezeigt und in absteigender Reihenfolge angeordnet sind, abhängig vom Datum, an dem sie veröffentlicht wurden.
• - zeigt "x" beliebte Produkte an, die in "y" -Spalten angezeigt und in absteigender Reihenfolge angeordnet sind, abhängig vom Datum, an dem sie veröffentlicht wurden.
• - Zeigt "x" bestbewertete Produkte an, die in "y" -Spalten angezeigt und in absteigender Reihenfolge angeordnet sind, abhängig vom Datum, an dem sie veröffentlicht wurden.
• - zeigt "x" Bestseller-Produkte an, die in "y" -Spalten angezeigt und in absteigender Reihenfolge angeordnet sind, abhängig vom Datum, an dem sie veröffentlicht wurden.
• - Zeigt "x" -bezogene Produkte an, die in "y" -Spalten angezeigt und in absteigender Reihenfolge angeordnet sind, abhängig vom Datum, an dem sie veröffentlicht wurden.
• - Zeigt die Produktliste mit der klassischen Listenvorlage an. Hinweis: Anstelle von "Liste" können auch andere Vorlagen wie "Raster" und "Standard" verwendet werden.
• - zeigt Produkte aus der Kategorie mit der ID "x" und mit klassischer Listenvorlage.

Hinweis: Wenn Sie sich mit Codierung auskennen, können Sie diese Shortcodes optimieren, um eine bessere Produktanzeige und -anordnung zu erzielen.

Ein auf einer Seite eingefügter Shortcode

Von Jan Saints (Eigene Arbeit): CC-BY-2.0

5. Verwenden von Schiebereglern

Falls Sie es nicht wussten, ist ein Schieberegler ein Webseitenelement, mit dem eine Gruppe ausgewählter Beiträge hervorgehoben wird. Es ist wie eine Diashow, dh es wird jeweils ein Beitrag angezeigt, der automatisch oder durch Klicken von einem zum nächsten wechselt.

Um Produkte mit Schiebereglern anzuzeigen, müssen Sie die Beiträge durch Ihre Produkte ersetzen. Wenn Sie einen Produkt-Slider erstellen möchten, benötigen Sie ein responsives Slider-Plugin wie Soliloguy. Nach der Installation und Aktivierung des Plugins müssen Sie einen neuen Schieberegler hinzufügen. Dazu können Sie Fotos, Links und andere erforderliche Details Ihrer Artikel verwenden. Der nächste Schritt besteht darin, Ihren Schieberegler zu speichern oder zu veröffentlichen, um einen Shortcode und ein Vorlagen-Tag zu erhalten.

Schließlich müssen Sie den Shortcode kopieren und auf Ihrer Homepage oder einer anderen Seite einfügen, um die Produkte anzuzeigen. Das Vorlagen-Tag kann Elemente im Kopfbereich Ihres Themas anzeigen. Sie müssen nur das Tag kopieren, Ihre header.php öffnen und auf der codierten Seite einfügen.

WooCommerce hat ein Plugin namens Products Slider, das auf E-Commerce zugeschnitten ist. Es funktioniert wie ein typisches Slider-Plugin, bietet jedoch einige weitere Einstellungen und Optionen. Ich ermutige Sie zu sehen, ob es Ihnen bei der Anzeige und Anordnung von Artikeln helfen kann.

Auf einem Schieberegler angezeigte Produkte

Von Jan Saints (Eigene Arbeit): CC-BY-2.0

Fazit

Das Anzeigen und Anordnen von Elementen auf Ihrer WordPress-E-Commerce-Website ist mit diesen fünf Methoden ganz einfach. Wenn Sie Schwierigkeiten hatten, Produkte in Ihrem Online-Shop anzuzeigen und anzuordnen, sollten Sie diese beiden Aufgaben jetzt problemlos ausführen. Wählen Sie einfach eine Methode, von der Sie glauben, dass sie für Sie geeignet ist, und platzieren Sie diese Produkte intelligenter auf Ihrer Homepage.

Verweise

1. Mening. R. So erstellen Sie einen Online-Shop mit WordPress und WooCommerce. Websitesetup.org . Website SetUp. (2017).
2. Andronaco R. So erstellen Sie einen Online-Shop mit WooCommerce und Wordpress: Einfacher Leitfaden für die perfekte Einrichtung einer E-Commerce-Website. (2017).
3. Rastaurius E., Etoile Web Design. E-Commerce-Produktkatalog für WordPress. wordpress.org. implecode. (2017).
4. WooCommerce. In WooCommerce enthaltene Shortcodes. docs.woocommerce.com . WooCommerce. (2016).
5. Truman S., Tuan N., Ar3rev Software. WooCommerce Produkt Sortier- und Anzeige-Plugin. wordpress.org. Ar3rev Software. (2013).
6. YiThemes. Yith Infinite Scrolling Plugin. wordpress.org. YITHEMES. (2017).
7. Razzak S. Ein exklusiver Leitfaden für das Slider-Plugin für WooCommerce-Produkte. cloudways.com. Cloudways Ltd. (2016).
8. Balkhi S. So erstellen Sie mit Soliloquy ganz einfach einen reaktionsschnellen WordPress-Slider. wpbeginner.com . WPBeginner. (2014).

© 2017 Januaris Saint Fores