Effektive Nutzung des products-Shortcodes für deinen SHOMUGO Online-Shop

WooCommerce-Shortcodes sind ein kraftvolles Tool, um deine Produktpräsentation in deinem Online-Shop auf SHOMUGO zu verbessern. In dieser Anleitung zeigen wir dir, wie du den Shortcode für Produkte, also den products-Shortcode gezielt einsetzen kannst, um deine Produkte ansprechend darzustellen. Solltest du Hilfe bei der Verwendung oder Konfiguration dieser Shortcodes benötigen, so zögere bitte nicht, uns ganz einfach zu kontaktieren.

Was ist ein WooCommerce-Shortcode?

Ein Shortcode ist eine spezielle Code-Zeile, die du in die Seiten deines Webshops einfügst, um bestimmte Produkte oder Produktgruppen dynamisch anzuzeigen. Sie fungieren als Platzhalter, die durch tatsächliche Produktinformationen ersetzt werden, wenn die Seite geladen wird. Dadurch ersparst du dir, Informationen aufwendig zu kopieren, mehrfach zu pflegen oder andere sinnlose Dinge, die sich davon abhalten deine Kunden zu bedienen.

Erweiterte Nutzung des [ products ] Shortcodes in WooCommerce

Der [ products ]-Shortcode ist eines der vielseitigsten Werkzeuge in WooCommerce. Er ermöglicht es dir, Produkte flexibel anzuzeigen und ersetzt damit die Notwendigkeit mehrerer spezifischer Shortcodes.

Funktionsweise des [ products ] Shortcodes

Dieser Shortcode kann Produkte nach verschiedenen Kriterien wie Post-ID, SKU (Stock-Keeping Unit), Kategorien und Attributen anzeigen. Zudem unterstützt er Funktionen wie Pagination, zufällige Sortierung und das Filtern nach Produkt-Tags.

Ablösung älterer Shortcodes

Der umfassende [ products ] Shortcode macht folgende spezifische Shortcodes überflüssig:

• [ featured_products ] für hervorgehobene Produkte
• [ sale_products ] für Produkte im Sale
• [ best_selling_products ] für Bestseller
• [ recent_products ] für kürzlich hinzugefügte Produkte
• [ product_attribute ] für Produkte mit bestimmten Attributen
• [ top_rated_products ] für am besten bewertete Produkte

Verfügbare Produktattribut-Optionen für den [ products ] Shortcode

Der [ products ]-Shortcode ermöglicht es dir, verschiedene Aspekte deiner Produktanzeige zu steuern:

1. Anzeigeoptionen:
   • limit: Legt die Anzahl der anzuzeigenden Produkte fest. Standardmäßig werden alle Produkte angezeigt.
   • columns: Definiert die Anzahl der Spalten für die Produktanzeige. Standard ist 4.
   • paginate: Aktiviert die Seitennummerierung. In Kombination mit limit einstellbar.
   • orderby: Sortiert die Produkte nach Kriterien wie Titel, Veröffentlichungsdatum, Beliebtheit und mehr.
   • order: Legt fest, ob Produkte aufsteigend oder absteigend sortiert werden sollen.
2. Filteroptionen:
   • category, tag: Filtert Produkte nach Kategorien oder Tags.
   • on_sale, best_selling, top_rated: Spezielle Filter für Verkaufsaktionen, Bestseller oder top-bewertete Produkte.
   • class: Fügt eine HTML-Klasse hinzu, die du für individuelle CSS-Anpassungen nutzen kannst.
3. Produktinhalt-Attribute:
   • attribute, terms: Ermöglicht das Filtern nach spezifischen Produktattributen.
   • terms_operator, tag_operator: Definiert, wie die Filter angewendet werden (z.B. IN, NOT IN, AND).
   • visibility: Steuert, wo Produkte angezeigt werden (z.B. nur im Katalog, nur in der Suche).
4. Sonstiges:
   • ids: Zeigt Produkte basierend auf einer durch Komma getrennten Liste von Post-IDs an.
   • skus: Zeigt Produkte auf der Grundlage einer durch Komma getrennten Liste von SKUs an.

Wo findet man die WooCommerce Produkt-ID?

Die Produkt-ID eines Produkts findest du in der Produktansicht unter Produkte > Alle Produkte. Sobald du mit der Maus über ein Produkt fährst, wir dir die Produkt-ID, wie in diesem Beispiel „905“ angezeigt.

Fertige Beispiele für deinen SHOMUGO Online-Shop

Szenario 1: Zufällige Verkaufsartikel

Hier ist ein Beispiel dafür, wie du den [ products ]-Shortcode verwenden kannst, um zufällig vier beliebte Sale-Artikel anzuzeigen:

[products limit="4" columns="4" orderby="popularity" class="quick-sale" on_sale="true"]

Dieser Shortcode zeigt vier Produkte in einer Zeile an, sortiert nach Beliebtheit, die derzeit im Angebot sind. Zusätzlich wird die CSS-Klasse quick-sale hinzugefügt, die du für individuelle Stiländerungen per CSS nutzen kannst.

Szenario 2: Hervorgehobene Produkte

Im zweiten Szenario wird der [ products ]-Shortcode verwendet, um hervorgehobene Produkte anzuzeigen. Hier ist ein Beispiel, wie man zwei hervorgehobene Produkte pro Zeile mit maximal vier Artikeln darstellt:

[products limit="4" columns="2" visibility="featured"]

Dieser Shortcode legt fest, dass bis zu vier hervorgehobene Produkte in zwei Spalten angezeigt werden. Da das Attribut orderby nicht verwendet wird, erfolgt die Anzeige nach der Standard-Sortierung (nach Menüreihenfolge und dann nach Titel, A bis Z).

Szenario 3: Meistverkaufte Produkte

Im dritten Szenario nutzt du den [ products ]-Shortcode, um die drei meistverkauften Produkte in einer Zeile anzuzeigen:

[products limit="3" columns="3" best_selling="true"]

Dieser Shortcode zeigt drei Bestseller-Produkte in drei Spalten an, was bedeutet, dass alle Produkte in einer einzigen Reihe dargestellt werden. Dies ist eine effektive Methode, um die Aufmerksamkeit auf deine Top-Verkäufe zu lenken.

Szenario 4: Neuste Produkte

Im vierten Szenario zeigt der [ products ]-Shortcode die neuesten Produkte an, wobei vier Produkte in einer Reihe angeordnet sind:

[products limit="4" columns="4" orderby="id" order="DESC" visibility="visible"]

Dieser Shortcode sortiert die Produkte nach ihrer Post-ID in absteigender Reihenfolge, wodurch die neuesten Produkte zuerst angezeigt werden. Die Sichtbarkeit ist auf „visible“ gesetzt, sodass nur Produkte angezeigt werden, die im Shop und in Suchergebnissen sichtbar sind.

Szenario 5: Produkte von spezifischen Kategorien

Im fünften Szenario wird der [ products ]-Shortcode genutzt, um spezifische Kategorien wie Hoodies und T-Shirts anzuzeigen, aber keine Accessoires. Hier ist ein Beispiel, wie man acht Produkte in zwei Reihen zu je vier anordnet:

[products limit="8" columns="4" category="hoodies, tshirts" cat_operator="AND"]

Dieser Shortcode zeigt Produkte an, die gleichzeitig den Kategorien „Hoodies“ und „T-Shirts“ zugeordnet sind. Durch den cat_operator="AND" wird sichergestellt, dass nur Produkte angezeigt werden, die beiden Kategorien entsprechen.

Wenn du Produkte anzeigen möchtest, die nicht zu bestimmten Kategorien gehören, kannst du den cat_operator auf „NOT IN“ setzen. Zum Beispiel:

[products limit="8" columns="4" category="hoodies, tshirts" cat_operator="NOT IN"]

Dieser Shortcode zeigt acht Produkte an, die weder der Kategorie „Hoodies“ noch „T-Shirts“ zugeordnet sind, angeordnet in zwei Reihen zu je vier. Beachte, dass, obwohl der Limit auf acht gesetzt ist, nur vier Produkte angezeigt werden, wenn nur vier Produkte den Kriterien entsprechen.

Szenario 6: Produkte nach Attributen

Im sechsten Szenario wird der [ products ]-Shortcode genutzt, um Kleidung anzuzeigen, die mit dem Attribut „Spring/Summer“ gekennzeichnet ist. Der Attribut-Slug dafür ist „season“, und die Attribut-Terme sind „warm“ für Frühling/Sommer. Die Produkte werden von den neuesten zu den ältesten sortiert:

[products columns="3" attribute="season" terms="warm" orderby="date"]

Dieser Shortcode zeigt Produkte in einer Dreier-Spalte an, die speziell das Attribut „warm“ tragen, wodurch nur Frühjahr-/Sommerartikel angezeigt werden.

Um alle Produkte anzuzeigen, die nicht speziell für warmes Wetter sind, kannst du den terms_operator auf „NOT IN“ setzen. Hier ist ein Beispiel:

[products columns="3" attribute="season" terms="warm" terms_operator="NOT IN"]

Dieser Shortcode zeigt Produkte in einer Dreier-Spalte an, die nicht das Attribut „warm“ tragen, also ideal für Artikel, die für kühlere Jahreszeiten gedacht sind.

Wenn du die Einstellung NOT IN verwendest, schließt du Produkte aus, die sowohl für „Spring/Summer“ als auch „Fall/Winter“ geeignet sind. Um alle für kälteres Wetter passenden Artikel einschließlich der ganzjährig tragbaren Accessoires anzuzeigen, solltest du den Term von „warm“ auf „cold“ ändern. So stellst du sicher, dass nur Produkte für kühleres Wetter angezeigt werden, inklusive derjenigen, die in mehreren Saisonkategorien gelistet sind.

Szenario 7: Produkte nach Tags

Im siebten Szenario zeigt der [ products ]-Shortcode Produkte an, die speziell mit dem Tag „hoodie“ versehen sind:

[products tag="hoodie"]

Dieser Shortcode filtert alle Produkte in deinem Shop heraus, die mit dem Tag „hoodie“ gekennzeichnet sind, und stellt sie entsprechend dar. Das kann besonders nützlich sein, um spezifische Produktlinien oder -kategorien hervorzuheben.

Sortieren von Produkten nach benutzerdefinierten Meta-Feldern

Um Produkte im WooCommerce-Shop mittels des [ products ] Shortcodes nach benutzerdefinierten Metadatenfeldern zu sortieren, kannst du den folgenden Code verwenden, der Produkte beispielsweise nach Preis ordnet. Füge den Code in die functions.php-Datei deines Themes ein:

add_filter( 'woocommerce_shortcode_products_query', 'woocommerce_shortcode_products_orderby' );

function woocommerce_shortcode_products_orderby( $args ) {
    $standard_array = array('menu_order', 'title', 'date', 'rand', 'id');
    if( isset( $args['orderby'] ) && !in_array( $args['orderby'], $standard_array ) ) {
        $args['meta_key'] = $args['orderby'];
        $args['orderby']  = 'meta_value_num'; 
    }
    return $args;
}

Durch diesen Code wird der Sortierparameter überprüft, und falls er nicht einem der Standardwerte entspricht, wird die Sortierung auf Basis des Meta-Wertes umgestellt.

Hinweis: Gerne stehen wir mit unserer Expertise für CustomCode-Anfragen rund um deinen SHOMUGO Online-Shop zur Verfügung. Kontaktiere uns ganz einfach, damit wir dein Anliegen genauer prüfen und gegebenenfalls umsetzen können.

15 nützliche Beispiele für deinen Online-Shop

Hier sind 15 nützliche Shortcode-Beispiele um den products-Shortcode sofort in deinem Online-Shop zu verwenden:

Alle Produkte anzeigen

Zeigt alle verfügbaren Produkte an. Nützlich für die Hauptproduktseite.

[products]

Produkte nach Kategorien

Zeigt vier Produkte der Kategorie „Schuhe“. Ideal für kategoriespezifische Landing-Pages.

[products category="schuhe" limit="4"]

Produkte einer spezifischen Marke anzeigen

Listet alle Produkte der Marke Nike auf. Gut für Markenseiten. Wichtig: Die Marke muss bei den Produkten definiert sein.

[products tag="nike"]

Neueste Produkte anzeigen

Zeigt die drei neuesten Produkte an. Perfekt für Neuankömmlinge.

[products orderby="date" order="DESC" limit="3"]

Produkte nach Preis sortieren

Sortiert Produkte nach aufsteigendem Preis. Hilfreich für Budget-Shopping-Seiten.

[products orderby="price" order="ASC"]

Sale-Produkte anzeigen

Zeigt fünf Produkte im Angebot. Ideal für Sales-Kampagnen.

[products on_sale="true" limit="5"]

Bestseller anzeigen

Stellt drei Bestseller dar. Wichtig für Highlight-Produkte.

[products best_selling="true" limit="3"]

Zufällige Produkte anzeigen

Zeigt vier zufällige Produkte. Gut für dynamische Inhalte auf der Startseite.

[products orderby="rand" limit="4"]

Top bewertete Produkte anzeigen

Listet die drei top bewerteten Produkte. Fördert qualitativ hochwertige Artikel.

[products top_rated="true" limit="3"]

Produkte mit dem höchsten Lagerbestand

Zeigt Produkte basierend auf Lagerbestand. Gut für Lagerabbau.

[products orderby="stock_quantity" order="DESC"]

Produkte in zwei Spalten anzeigen

Präsentiert Produkte in zwei Spalten. Ermöglicht eine kompakte Darstellung.

[products columns="2"]

Produkte aus mehreren Kategorien

Zeigt Produkte, die sowohl T-Shirts als auch Hoodies sind. Nützlich für spezifische Produktkombinationen.

[products category="t-shirts, hoodies" cat_operator="AND"]

Produkte mit spezifischen IDs

Schließt bestimmte Produkte aus. Nützlich, um bestimmte Artikel aus Aktionen auszuschließen.

[products ids="5, 8, 17" exclude="true"]

Produkte nach benutzerdefinierten Attributen filtern

Filtert Produkte, die die Farbe Rot haben. Ideal für farbspezifische Promotionen.

[products attribute="farbe" terms="rot" terms_operator="IN"]

Diese Shortcodes bieten vielfältige Möglichkeiten, Produkte gezielt und attraktiv in einem Online-Shop zu präsentieren und können leicht an spezifische Bedürfnisse angepasst werden.