WooCommerce Shortcodes: Der ultimative Leitfaden für 2021

Wenn Sie ein WooCommerce-Geschäft haben, haben Sie wahrscheinlich schon von Shortcodes gehört. Es handelt sich um kleine Ausschnitte, mit denen Sie verschiedene Aspekte Ihres Online-Shops hinzufügen und anpassen können, ohne lange Codezeilen schreiben zu müssen. In diesem Leitfaden sehen wir uns an, was WooCommerce-Shortcodes sind, warum Sie sie verwenden sollten und wie Sie sie optimal nutzen können .

WooCommerce Shortcodes: Alles, was Sie wissen müssen

Wenn Sie mit WordPress arbeiten, sind Sie wahrscheinlich mit WooCommerce vertraut. Derzeit verwenden 93,7 % aller WordPress-E-Commerce-Websites das renommierte WooCommerce-Plugin. Diese vollständig anpassbare Open-Source-Plattform, die von WooThemes entwickelt wurde, begann wie jedes andere Addon, startete aber bald mit Millionen von Downloads, was die Aufmerksamkeit des WordPress-Boards erregte. Bis heute wurde es bereits 70 Millionen Mal heruntergeladen und hat sich zum führenden E-Commerce-Plugin entwickelt, das insgesamt 28 % der Online-Shops unterstützt.

Trotz seines guten Rufs und Erfolgs arbeitet das WooCommerce-Team kontinuierlich daran, es noch besser zu machen. Während seines gesamten Entwicklungspfads hat es Benutzern mehrere Shortcodes verschiedener Typen zur Verfügung gestellt, um ihre Websites anzupassen. Mit solchen Shortcodes können sie ihre Geschäfte transformieren und ihre Benutzeroberfläche, den Check-out, die Funktionalität, den Prozess der Auflistung von Produkten und mehr anpassen.

Um Ihnen zu helfen, das Beste aus Shortcodes zu machen, werfen wir in diesem Leitfaden einen Blick auf:

• Eine kurze Erklärung der Shortcodes
• Warum sie für Ihr Unternehmen notwendig sind
• Eine Liste von WooCommerce-Shortcodes
• Wie Sie sie voll ausschöpfen können

Was sind WooCommerce-Shortcodes?

Beginnen wir mit den Grundlagen. WooCommerce-Shortcodes sind kleine Snippets, die Ihnen helfen, eine Funktionalität zu erreichen oder Inhalte auf Ihrer E-Commerce-Site anzuzeigen, ohne eine lange Codestrecke zu schreiben. Mit anderen Worten, es handelt sich um Makros, die eine dynamische Interaktion mit dem Inhalt Ihrer Website ermöglichen .

Sie können Shortcodes überall in Ihrem Geschäft verwenden, um es anzupassen, Produkte zu präsentieren oder einfach nur Call-to-Action-Schaltflächen. Und das Beste daran ist, dass Sie keine Programmierkenntnisse benötigen, um sie zu verwenden. Sie brauchen nur eine brennende Leidenschaft für das Online-Geschäft und ein tiefes Verständnis dafür, was Sie für Ihr Geschäft wollen. Shortcodes erledigen den Rest sauber und ordentlich.

Kurz gesagt, WooCommerce-Shortcodes sind in dreierlei Hinsicht von Vorteil:

• Sie sparen Zeit, da Sie keine langen Codezeilen schreiben müssen, wodurch Sie mehr Zeit haben, an anderen Dingen zu arbeiten.
• Da sie dem Beitragsinhalt kein Markup hinzufügen, können Ladenbesitzer den Stil der Seite später bearbeiten.
• Mehr Flexibilität. Auch wenn dies von den vom Benutzer eingestellten Parametern abhängt, können sie denselben Shortcode für verschiedene Situationen anwenden.

Warum braucht man WooCommerce Shortcodes?

Immer noch nicht überzeugt? Denken Sie noch einmal darüber nach, WooCommerce-Shortcodes können viel mehr tun, als Sie sich vorstellen.

Erstens erhalten Sie mit Shortcodes die volle Kontrolle über Ihre Website . Das bedeutet, dass Sie Produkte frei anzeigen, Call-to-Action-Schaltflächen oder Schaltflächen jeglicher Art überall in Ihrem Geschäft hinzufügen können, ohne einen Entwickler um Hilfe zu bitten. Es bedeutet auch, dass Sie nicht mit langen und komplexen Codeabschnitten arbeiten müssen.

Dies ist perfekt für diejenigen, die verschiedene Strategien in ihren Online-Shops ausprobieren möchten. Anstatt Ihre Kunden beispielsweise wie in jedem anderen Geschäft durch einen Standardverkaufsprozess zu führen, möchten Sie möglicherweise eine Schaltfläche zum Hinzufügen zum Warenkorb in einem Ihrer beliebten Posts anzeigen, um Conversions zu fördern. Und das Beste daran ist, dass Sie mit Shortcodes aus vielen Call-to-Action-Schaltflächen auswählen können, die Sie auf Ihrer Website platzieren.

Darüber hinaus können Sie mit WooCommerce-Shortcodes Produkte zur Homepage hinzufügen, ein Raster mit Artikeln erstellen, die zum Verkauf stehen, um sie den Kunden zu zeigen, und Ihre beliebten Produkte überall dort anzeigen, wo Sie möchten. Sogar das Erstellen einer Bestellverfolgungsseite ist möglich! Und das ist die Magie von Shortcodes, sie bieten Ihnen endlose Optionen zum Anpassen Ihres Shops .

Welche Arten von WooCommerce Shortcodes gibt es?

Da es schwer zu sagen ist, wie viele Shortcodes WooCommerce anbietet, listen wir sie basierend auf ihrer Kategorie auf. Hier ist ein kurzer Überblick über die WooCommerce-Shortcodes, die wir in diesem Leitfaden behandeln werden:

• Seiten-Shortcodes
• Produkt-Shortcodes (dies ist die robusteste Kategorie)
• Produktseiten-Shortcodes
• Shortcodes für verwandte Produkte
• Add-to-Cart-Button oder URL-Shortcodes

Wie kann man WooCommerce Shortcodes optimal nutzen ?

Sehen wir uns nun an, was jede Art von Shortcode kann und wie man sie optimal nutzt:

1. Seiten-Shortcodes

Normalerweise enthält WordPress 4 Standardseiten mit den enthaltenen Shortcodes, sodass Sie sie nicht manuell hinzufügen müssen. Wenn das jedoch aus irgendeinem Grund nicht der Fall war, könnten Sie die Seiten mit den Shortcodes neu erstellen und in den Einstellungen klären.

Innerhalb der Seiten-Shortcodes finden Sie:

Wagen

 [ woocommerce_cart ]

Es wird für die Warenkorbseite verwendet und hilft, den Inhalt des Warenkorbs anzuzeigen, sobald Ihre Kunden Produkte in ihren Warenkorb legen. Darüber hinaus zeigt es auch die Schnittstelle für Gutscheincodes, Einkaufswagenteile und andere Elemente für eine Standard-Einkaufswagenseite an. Dies ist ein einfacher Shortcode, dem Sie also keine weiteren Bedingungen oder Parameter hinzufügen.

Kasse

 [ woocommerce_checkout ]

Sobald Ihre Kunden alle gewünschten Produkte/Dienstleistungen gesammelt haben, klicken sie auf „Zur Kasse“ und dann kommt der „Zur Kasse“-Shortcode zum Einsatz. Es zeigt alle notwendigen Informationen an, die der Käufer vor dem Bezahlvorgang sehen muss, wie z. B. Zahlungsmethode, Rechnungsinformationen, Versandinformationen usw. Dies ist auch ein einfacher Shortcode, der keine zusätzlichen Argumente akzeptiert.

Mein Konto

 [ woocommerce_my_account ]

Kunden sollten in der Lage sein, ihre Profildaten wie Name, E-Mail-Adresse, Passwort sowie ihre Bestelldaten wie Liefer- und Rechnungsadresse einzusehen und zu ändern. Mit diesem Shortcode können Benutzer diese Details anzeigen, bearbeiten und aktualisieren. Darüber hinaus enthält es ein Argument, das Informationen über den aktuellen Käufer anzeigt.

Auftragsverfolgungsformular

 [ woocommerce_order_tracking ]

Im Gegensatz zu den vorherigen dreiseitigen Shortcodes wird dieser nicht standardmäßig automatisch generiert, aber Sie können ihn hinzufügen, damit Ihre Kunden den Status ihrer laufenden Bestellungen sehen und verfolgen können. Wenn sie den Status einer Bestellung überprüfen möchten, müssen die Käufer ihre Bestelldaten in das Bestellverfolgungsformular eingeben.

Sie können diesen WooCommerce-Shortcode für eine einzelne Seite verwenden oder ihn mit anderen Shortcodes kombinieren, um das Tracking-Formular anzuzeigen. Sie können diesen Shortcode beispielsweise auf der Seite „ Mein Konto “ verwenden, um Ihren Kunden den Zugriff auf das Tracking-Formular zu ermöglichen.

2. Produkt-Shortcodes

Bitte beachten Sie, dass Sie zur Verwendung von Produkt-Shortcodes WooCommerce 3.2 und spätere Versionen benötigen. Mit diesen Versionen können Sie den Produkt-Shortcode für alle Arten von Produktanzeigen verwenden. Wenn Sie eine frühere Version haben, sehen Sie sich dieses Dokument an, da Sie für jede Art von Produktgruppierung unterschiedliche Shortcodes verwenden müssen.

 [ products ]

2.1 Produkt-Shortcode-Attribute

Wenn Sie Produkt-Shortcodes verwenden, müssen Sie angeben, welche Produkte Sie basierend auf verschiedenen Bedingungen anzeigen möchten, die es Ihnen ermöglichen, Produkte nach Post-ID, SKU, Kategorien, Attributen usw. zu filtern. Sie unterstützen auch Paginierung, zufällige Sortierung und Produkt-Tags.

Gehen wir einige Produkt-Shortcodes durch:

Produktmenge begrenzen

Mit dem Attribut limit können Sie die Anzahl der angezeigten Produkte begrenzen. Beispielsweise können Sie die Anzahl der anzuzeigenden Produkte wie folgt auf 8 Artikel beschränken:

 [ products limit="12" ]

. Bitte beachten Sie, dass das Limit standardmäßig „-1“ ist, was bedeutet, dass alle Produkte angezeigt werden.

Ändern Sie das Produktlayout

Mit WooCommerce-Shortcodes können Sie auch das Layout ändern, um die Produktanzeige zu diversifizieren. Wählen Sie einfach je nach den Vorlieben Ihrer Kunden zwischen den folgenden Attributen: Spalten, Paginieren oder Sortieren nach.

A. Säulen

Wenn Sie eine bestimmte Anzahl von Spalten festlegen möchten, müssen Sie das Attribut „columns“ hinzufügen und die gewünschte Anzahl verdeutlichen. Wenn Sie also 6 Spalten mit jeweils einem anderen Produkt wünschen, können Sie den Shortcode verwenden:

 [ products limit="12" columns="4" ]

B. Paginieren

Ein weiteres Beispiel ist das paginate-Attribut, das Ihre Produkte in verschiedene Seiten unterteilt. Mit diesem Shortcode können Sie die Anzahl der auf jeder Seite angezeigten Artikel festlegen.

Um es zu verwenden, setzen Sie paginate = „true“ und geben Sie dann den folgenden Shortcode ein:

 [ products limit="12" columns="4" paginate="true" ]

C. Produkte sortieren mit „orderby“

Das Attribut orderby eröffnet vielfältige Möglichkeiten, da Sie Ihre Produkte nach mehreren Kriterien sortieren können, um sie durch das Hinzufügen von Bedingungen beliebig anzuzeigen. Diese schließen ein:

• • id: Produkte nach Produkt-ID anzeigen.
  • Popularität : Mit diesem Attribut werden die Produkte, die am häufigsten gekauft werden, zuerst angezeigt.
  • Titel : Produkte nach Titel sortieren. Dies ist die Standardreihenfolge von orderby.
  • Bewertung : Eine weitere interessante Möglichkeit, Produkte zu sortieren, basiert auf ihrem durchschnittlichen Bewertungswert.
  • date : um die Artikel nach dem Datum ihrer Veröffentlichung zu sortieren. Standardmäßig wird das älteste Produkt zuerst angezeigt. Sie können dies jedoch mit dem Datumsattribut ändern.
  • rand : Mit diesem Attribut können Sie die Reihenfolge der Produkte beim Neuladen der Seite ändern. Bei Websites, auf denen Caching aktiviert ist und die Produkte in einer festen Reihenfolge gespeichert werden, funktioniert dieses Attribut jedoch möglicherweise nicht.
  • menu_order : Dies funktioniert nur, wenn Sie Menübestellungen festgelegt haben, und es werden Produkte gemäß dieser Reihenfolge angezeigt. Die niedrigste Nummer wird zuerst angezeigt.

Wenn Sie noch mehr Anpassungen wünschen, können Sie noch einen Schritt weiter gehen und diese Optionen kombinieren, indem Sie einfach ein Leerzeichen dazwischen einfügen. Sie könnten beispielsweise versuchen, die Shortcodes zu mischen, um sechs Produktspalten in einer Reihenfolge basierend auf ihrer Beliebtheit wie folgt anzuzeigen:

 [ products limit="12" columns="4" orderby="popularity" ]

Weitere Produktattribute

Es gibt mehrere weitere Produktattribute in WooCommerce, die Sie verwenden können, indem Sie sie mit dem Shortcode „ Produkte“ kombinieren. Einige der wichtigsten sind:

• • SKU: Sie können Ihre Produkte basierend auf ihrer SKU (Lagerhaltungseinheit) anzeigen. Wenn Sie mehrere SKUs hinzufügen möchten, trennen Sie diese einfach durch Kommas.
  • on_sale : Wie der Name schon sagt, zeigt dieses Attribut alle im Angebot befindlichen Produkte Ihres Shops an.
  • Kategorie : Es ist auch eine gute Idee, Produkte nach Kategorien anzuzeigen. Sie können mehrere Kategorien haben, die die Slugs durch Kommas trennen.
  • best_selling : Dies ist eine gute Option, wenn Sie zuerst Ihre beliebtesten und meistverkauften Produkte zeigen möchten.
  • top_rated : Nach der gleichen Logik können Sie auch Ihre am besten bewerteten Artikel anzeigen.
  • class : Dieses Attribut hilft Ihnen, die Reihenfolge mit benutzerdefiniertem CSS zu ändern, indem Sie eine HTML-Wrapper-Klasse hinzufügen.

Wenn Sie beispielsweise Ihre meistverkauften Produkte, vier pro Reihe, mit maximal zwölf Artikeln anzeigen möchten, können Sie diesen Shortcode verwenden:

 [ products limit="12" columns="4" best_selling="true" ]

Sichtweite

Mit diesem Attribut können Sie Produkte basierend auf den Sichtbarkeitseinstellungen anzeigen. Einige der Optionen sind:

• • • Katalog : Er ruft Produkte ab, die nur auf der Shop-Seite sichtbar sind
    • Suche: Zeigt Produkte an, die nur auf der Suchseite sichtbar sind
    • sichtbar: Es ist eine Kombination der beiden vorherigen, da es Produkte abruft, die auf der Shop-Seite und in den Suchergebnissen sichtbar sind.
    • versteckt: Zeigt Produkte an, auf die nur über eine direkte URL zugegriffen werden kann.
    • Featured : Es werden nur Produkte abgerufen, die als Featured markiert sind

Wenn Sie beispielsweise Ihre vorgestellten Produkte vier pro Reihe mit maximal zwölf Artikeln anzeigen möchten, können Sie diesen Shortcode verwenden:

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

Inhaltsproduktattribute

Innerhalb von Produkt-Shortcodes gibt es Inhaltsproduktattribute, die Sie verwenden können, um Produkte auf einer bestimmten Seite oder einem bestimmten Beitrag abzurufen. Genauer gesagt ist es möglich, Inhalte basierend auf den verfügbaren Attributen oder Attributbegriffen abzurufen (dies sind Variationen dieses Attributs). Sie können dies tun, indem Sie den Slug einschließen, die Begriffe spezifizieren und sie mit den Attributen kombinieren. Dies kann etwas verwirrend sein, also schauen wir uns jeden von ihnen genauer an:

• • Attribut: Es hilft, Produkte anzuzeigen, indem es die Slugs umschließt
  • terms: Es erwähnt die Attributterme durch Kommas getrennt
  • term_operator: Es gibt Ihnen mehr Kontrolle darüber, wie die Attribute angezeigt werden. Es gibt drei Operatoren:
    • UND : Es werden Produkte mit allen Attributen angezeigt, die Sie ausgewählt haben.
    • IN : Es zeigt die Produkte an, die dieses ausgewählte Attribut haben.
    • NICHT IN : Es werden Produkte angezeigt, die nicht die ausgewählten Attribute haben.

Kategorien

Nach der gleichen Logik wie Inhaltsproduktattribute können Sie auch Artikel basierend auf ihren Kategorien anzeigen:

• • • Kategorie: Um die Kategorie auszuwählen, die Sie anzeigen möchten
    • cat_operator: Sie können Bedingungen anwenden, um die gewünschten Elemente anzuzeigen:
      • UND: Die angezeigten Produkte müssen zu allen ausgewählten Kategorien gehören
      • IN: Die angezeigten Produkte müssen mindestens einer der ausgewählten Kategorien angehören
      • NICHT IN: Die angezeigten Produkte müssen keiner der ausgewählten Kategorien angehören
    • Sie können Produkte auch nach einer durch Kommas getrennten Liste von Post-IDs oder einer Liste von SKUs anzeigen.
    • Es gibt mehrere weitere Shortcodes/Attribute, die zu den Produkt-Shortcodes gehören: Spezielle Attribute, Produktkategorie und Produktkategorie. Die Logik ist sehr ähnlich zu dem, was Sie oben gelesen haben, aber falls Sie einen Blick darauf werfen möchten, können Sie dies überprüfen.
    • Wenn Sie mehr über Shortcodes erfahren möchten, können Sie diese Seite besuchen und sich die 8 Szenarien ansehen.

Wenn Sie beispielsweise Produkte für bestimmte Kategorien anzeigen möchten, vier pro Reihe, mit maximal zwölf Artikeln, können Sie diesen Shortcode verwenden:

 [ products limit="12" columns="4" category="hoodies, tshirts" ]

3. Produktseiten-Shortcodes

Mit dieser Art von WooCommerce-Shortcode können Sie verschiedene Produktseiten mithilfe von zwei Attributen anzeigen: Produkt-IDs und SKUs. Der Code dafür ist .

Es ist wichtig zu beachten, dass Sie sogar die beiden folgenden Shortcodes verwenden können:

 [ product_page ]

oder

 [ product_page sku="hoodie" ]

4. Shortcode für verwandte Produkte

Wenn Sie E-Commerce-Shops wie Amazon oder Alibaba verwendet haben, ist Ihnen wahrscheinlich aufgefallen, dass beim Betrachten eines Produkts andere Artikel angezeigt werden, die verwandt sind. Wenn Sie beispielsweise nach einem Zelt suchen, werden Ihnen andere ähnliche Zelte und Schlafsäcke angezeigt. Denn wer ein Zelt braucht, interessiert sich wahrscheinlich auch für einen Schlafsack.

Folglich ist es eine ausgezeichnete Idee, Ihren Käufern verwandte Produkte zu zeigen, um Ihren Umsatz zu steigern. In WooCommerce ist dies mit dem Related Products Shortcode möglich. Sie können genau angeben, wie viele Produkte die Benutzer sehen sollen. Wenn Sie beispielsweise 4 Produkte anzeigen möchten, sollte der Shortcode lauten:

 [ related_products limit="4" ]

5. Schaltfläche „In den Warenkorb“ .

Eine Schaltfläche zum Hinzufügen zum Warenkorb ist eine weitere hervorragende Möglichkeit, das Kundenerlebnis in Ihrem Geschäft zu verbessern und die Konversionsrate zu erhöhen. Und das Beste daran ist, dass es sehr einfach ist.

Angenommen, Sie möchten den Preis eines Produkts und eine Schaltfläche „In den Warenkorb“ auf einem Beitrag oder einer Seite anzeigen. Der Shortcode, den Sie verwenden müssen, ist

 [ add_to_cart sku="hoodie" ]

Mit WooCommerce-Shortcodes können Sie Ihre Käufer auch auf eine andere URL umleiten, anstatt einen Artikel in den Warenkorb zu legen. Dazu müssen Sie schreiben

 [ add_to_cart_url ]

für das Produkt mit der ID 219.

Liste nützlicher Shortcodes für WooCommerce

Abschließend finden Sie hier eine Liste der nützlichsten WooCommerce-Shortcodes, die Sie auf Ihrer Website verwenden können.

• Warenkorbseiten-Shortcode.

 [ woocommerce_cart ]

• Seite anschauen

 [ woocommerce_checkout ]

• Benutzerkonto.

 [ woocommerce_my_account ]

• Auftragsverfolgungsformular.

 [ woocommerce_order_tracking ]

• Shortcode für Produkte.

 [ products ]

• Ausgewählte Produkte.

 [ featured_products ]

• Verkaufsprodukte.

 [ sale_products ]

• Meistverkaufte Produkte.

 [ best_selling_products ]

• Kürzlich hinzugefügte Produkte.

 [ recent_products ]

• Produkteigenschaft.

 [ product_attribute ]

• Erstklassige Produkte.

 [ top_rated_products ]

• Produktkategorie: um Produkte in einer bestimmten Kategorie anzuzeigen.

 [ product_category ]

• Produktkategorien: Zeigt alle Ihre Produktkategorien an.

 [ product_categories ]

• Shop-Nachrichten: um Nachrichten anzuzeigen.

 [ shop_messages ]

• Produktfilter: Zeigt einen Produktsuchfilter an.

 [ woocommerce_product_filter ]

• Filterattribut.

 [ woocommerce_product_filter_attribute ]

• Produktfilterkategorie.

 [ woocommerce_product_filter_category ]

• Preis filtern.

 [ woocommerce_product_filter_price ]

• Produktfilter-Tag.

 [ woocommerce_product_filter_tag ]

• Filterbewertung.

 [ woocommerce_product_filter_rating ]

• Produktfilter Verkauf: Zeigt einen Live-Filter für Produkte im Angebot an.

 [ woocommerce_product_filter_sale ]

• Produktfilter zurücksetzen: Zeigt eine Schaltfläche zum Löschen aller Live-Filter an.

 [ woocommerce_product_filter_reset ]

WooCommerce Shortcodes: Fazit

Alles in allem helfen Ihnen WooCommerce-Shortcodes dabei, Ihren Shop anzupassen, ohne lange Codezeilen schreiben zu müssen. Auf diese Weise können Sie verschiedene Layouts und Alternativen testen, um das richtige für Ihr Geschäft zu finden. Auch wenn sie auf den ersten Blick kompliziert erscheinen können, ist die Wahrheit, dass sie mit ein wenig Übung Ihr Leben viel einfacher machen und Ihnen helfen werden, Ihr Geschäft auf die nächste Stufe zu heben.

Weitere Alternativen zum Anpassen Ihres Online-Shops finden Sie in unseren Leitfäden unter:

• Funktion „In den Warenkorb“ programmgesteuert in WooCommerce hinzufügen
• WooCommerce Ajax in den Warenkorb legen

Was halten Sie von WooCommerce-Shortcodes? Bitte teilen Sie uns Ihre Gedanken in den Kommentaren unten mit.