WooCommerce: Erste Schritte mit WooCommerce-Blöcken – TEIL 1

Veröffentlicht: 2022-01-26

Seit WordPress 5.0 wurde der Standardseiten-/Beitragseditor komplett neu entwickelt. Sicher haben Sie schon von Gutenberg gehört.

Die schlechte Nachricht ist, dass WooCommerce sich viel langsamer der neuen Bearbeitungserfahrung anschloss, und es gibt noch wichtige Dinge zu entwickeln, um es Gutenberg-freundlich zu machen.

Der Kompatibilitätsfortschritt kann über das offizielle Plugin von WooCommerce Blocks verfolgt werden, das besagt: „ Sie können dieses Plugin verwenden, wenn Sie auf alle verfügbaren Blöcke für WooCommerce zugreifen möchten – einschließlich experimenteller. Unsere aktuellen „stabilen“ Blöcke sind in WooCommerce gebündelt und können aus dem Abschnitt „WooCommerce“ im Block-Inserter hinzugefügt werden , weil Sie dort ihre „Beta“-Blöcke finden können, die sie „experimentell“ nennen, und das wird offiziell sein in WooCommerce freigegeben, sobald sie genehmigt wurden.

In diesem Artikel tauchen wir speziell in die WooCommerce-Blöcke ein – was sie sind, warum sie wichtig sind, wie viele Blöcke verfügbar sind und wie Sie sie verwenden können.

Da dies ein riesiges Thema ist – wir haben zwanzig WooCommerce-Blöcke zu behandeln – teilen wir es in zwei Teile. In diesem Artikel werden die ersten zehn Blöcke bewertet, die Sie in Ihrem Geschäft verwenden können. Aber lassen Sie uns zunächst herausfinden, was WooCommerce-Blöcke sind, und untersuchen, warum sie so wichtig sind.

Was sind WooCommerce-Blöcke und warum sind sie so wichtig?

WooCommerce erstellt automatisch Seiten wie Kategorieseiten und Shopseiten, um Ihre Produkte anzuzeigen. Es ist jedoch wahrscheinlich, dass eine andere WooCommerce-Website Ihrem E-Commerce-Shop ähnlich erscheint – wenn sie dieselbe Seite und dasselbe Produktlayout wie Sie wählen.

Mit WooCommerce Blocks können Sie Ihren Shop jedoch einzigartig machen und Ihre Produkte in der von Ihnen bevorzugten Art und Weise und im Layout präsentieren.

WooCommerce-Blöcke bieten Ihnen mehr Kontrolle über Ihr Shop-Design. Durch die Integration mit dem Block-Editor können Sie Ihren Shop anpassen, ohne eine einzige CSS-Zeile zu schreiben, Code hinzuzufügen oder Grafikdesign-Kenntnisse zu benötigen.

Sie können ganz einfach Blöcke mit einer einfachen Drag-and-Drop-Methode hinzufügen. Mit der benutzerfreundlichen Oberfläche von WooCommerce Block können Sie:

  • Erstellen Sie benutzerdefinierte Shopseiten
  • Erstellen Sie Zielseiten, um eine Sammlung von Produkten anzuzeigen
  • Fügen Sie Produktblöcke auf bestimmten Seiten oder sogar in Blogbeiträgen hinzu
  • Fügen Sie Produktempfehlungen, Produktbewertungen und Werbebanner hinzu, wo immer Sie möchten

Werfen wir also einen Blick auf die verschiedenen WooCommerce-Blöcke. Sie erhalten 20 eingebaute WooCommerce-Blöcke, wenn Sie WooCommerce installieren . Hier ist ein Blick auf die ersten zehn Blöcke und wie Sie sie verwenden können.

Eine Liste der wesentlichen WooCommerce-Blöcke [Teil 1]

1. Aktive Produktfilter

Quelle

Produktfilter erleichtern Ihren Kunden die Produktsuche. Ohne sie besteht die Gefahr, Kunden zu verlieren, da sie manuell nach den Produkten ihrer Wahl suchen müssen. Leider wird dieser Prozess zeitaufwändig und macht Ihre Website für Ihre Zielgruppe weniger nützlich und interaktiv.

Der Block Aktive Produktfilter zeigt die Produktfilter an, die derzeit in der aktuellen Ansicht aktiv sind (also Filter, die im vorherigen Schritt ausgewählt wurden). Darüber hinaus erfasst dieser Block automatisch die Attribute Ihres Produkts, sodass Ihre Kunden die aktiven Produkte nach beliebigen Attributen filtern können.

Sie können die Überschrift des Blocks gestalten und die Filter entweder als Chip (ähnlich wie Schaltflächen) oder als Liste anzeigen. So erleichtert dieser Block das Hinzufügen von Filtern wie Größe, Form oder Farbe des Produkts – was es für Ihre Kunden äußerst bequem macht.

2. Alle Bewertungen

Quelle

Das Anzeigen von Kundenbewertungen ist eine hervorragende Möglichkeit, die Glaubwürdigkeit und Authentizität Ihres Produkts zu demonstrieren. Es fungiert als Produkttestimonial, dem Käufer mehr vertrauen als den Produktansprüchen – und erhöht so die Chancen, dass Benutzer die Produkte kaufen.

Laut Trustpilot lesen 89 % der Kunden Online-Bewertungen, bevor sie die Produkte kaufen. Dies zeigt die integrale Rolle, die Kundenbewertungen in Ihren E-Commerce-Verkäufen spielen.

Daher kann die Einbeziehung des Blocks „Alle Bewertungen“ auf Ihrer WooCommerce-Website als Wendepunkt für Ihren Produktverkauf wirken.

Mit diesem Block können Sie die gesamte Liste aller Produktbewertungen anzeigen, die Sie irgendwo in Ihrem Geschäft erhalten haben – wie im Blogbeitrag oder auf der Zielseite.

Es bietet viele Anpassungsoptionen, bei denen Sie den Produktnamen, den Namen des Rezensenten, das Bewertungsdatum, die Produktbewertung, den Inhalt der Bewertung und das Produktbild entweder ausblenden oder anzeigen können.

Sie können die Einstellungen anpassen, indem Sie Benutzern erlauben, nach der niedrigsten Bewertung oder einer höheren Bewertung zu bestellen, oder sogar die Anzahl der anzuzeigenden Bewertungen festlegen und eine Option zum Laden weiterer Bewertungen für Ihre Kunden hinzufügen.

3. Alle Produkte

Quelle

Der Block „Alle Produkte“ zeigt alle Produkte in Ihrem WooCommerce-Shop an und verfügt über Sortier- und Paginierungsoptionen. Sie können diesen Block mit dem Block Aktive Produktfilter ausrichten, um ein Sortier-Dropdown anzuzeigen.

Mit der integrierten Paginierungsoption können Ihre Kunden Ihre Produkte einfach vorwärts und rückwärts navigieren, um die gesamte Produktseite anzuzeigen, wenn Sie nicht alle Produkte auf einer einzigen Seite anzeigen möchten.

Sie haben die Wahl, die standardmäßige Produktsortierreihenfolge auszuwählen – sei es, um nach den neuesten Produkten oder der Beliebtheit der Produkte zu sortieren. Sie können das Sortier-Dropdown bei Bedarf auch ausblenden. Darüber hinaus können Sie mit diesem Block zusätzliche Inhalte wie Bilder, Text und Videos hinzufügen.

4. Vorgestellte Kategorie

Quelle

Der Featured Category Block ermöglicht es Ihnen, Produkte aus einer bestimmten Produktkategorie auszuwählen, die Sie einrichten und als Featured-Kategorie oder in einem Call-to-Action-Banner anzeigen möchten.

Es ist eine perfekte Lösung, um eine bestimmte Produktkategorie auf Ihrer Zielseite oder einem Blog-Beitrag hervorzuheben – um den Verkehr zu steigern und den Umsatz dieser bestimmten Produktkategorie zu maximieren.

Eine der wichtigsten Funktionen ist die Fokuspunktauswahl, mit der Sie den Fokuspunkt des Produktbilds ziehen können, um ihn perfekt im Hintergrundcontainer zu platzieren. Dieser Block bietet Ihnen auch Optionen wie das Ausblenden oder Anzeigen von Produktbeschreibungen, das Hinzufügen einer Überlagerungsfarbe und das Ändern der Deckkraft.

Wenn Sie also kürzlich eine neue Produktkollektion eingeführt haben, kann Ihnen der Block „Empfohlene Kategorie“ dabei helfen, die Kollektion an mehreren Stellen Ihres Geschäfts anzuzeigen und den Umsatz zu steigern.

5. Ausgewählte Produkte

Quelle

Der Featured Product Block ermöglicht es Ihnen, Ihre Shop-Produkte in einem präsentablen, gut aussehenden und schön gestalteten Banner mit einem Call To Action (CTA) anzuzeigen.

Es bietet zahlreiche Einstellungen und Optionen, um den Produktpreis und die Beschreibung ein- oder auszublenden, die Textausrichtung zu steuern, eine Overlay-Farbe hinzuzufügen, die Hintergrundpositionierung und -opazität anzupassen, das Produktfoto zu überschreiben und den CTA der Schaltfläche zu ändern.

Dieser Block ist der perfekte Weg, um bestimmte Produkte in Ihren Blog-Beiträgen oder auf Ihrer Zielseite zu präsentieren und die Aufmerksamkeit der Kunden zu gewinnen – sie zum Kauf zu bewegen.

6. Produkte nach Kategorie

Quelle

Mit dem Block Produkte nach Kategorie können Sie Produkte aus einer oder mehreren ausgewählten Kategorien in einem Raster anzeigen.

Sie können die Anzahl der Zeilen und Spalten des Rasters mit einer Option zum Ausblenden oder Anzeigen des Produkttitels, des Preises, der Bewertung und der Schaltfläche „In den Warenkorb“ ändern. Dieser Block kann verschiedene Abschnitte mit verschiedenen Produktkategorien auf Ihrer Homepage erstellen.

7. Meistverkaufte Produkte

Quelle

Der Bestseller-Produktblock ermöglicht es Ihnen, die meistverkauften Produkte Ihres Shops in einem Raster anzuzeigen.

Das Design dieses Blocks ist dem des Blocks Produkte nach Kategorie sehr ähnlich, mit identischen Anpassungsoptionen. Beispielsweise können Sie für die Produkte entsprechende Filteroptionen festlegen – etwa nach Farbe, Größe und Preis filtern.

Mit diesem Block können Sie Kunden dazu anregen, Ihre meistverkauften Produkte zu durchsuchen und sie dazu verleiten, Produkte für sich selbst zu kaufen.

8. Produkte nach Preis filtern

Quelle

Dieser Block zeigt einen benutzerfreundlichen Schieberegler an, mit dem Kunden die Produkte nach Preis filtern können. Wenn Sie beispielsweise den linken Griff nach rechts ziehen, erhöht sich der Preis, während Sie ihn durch Ziehen des rechten Griffs nach links verringern.

Sie können die minimale und maximale Preisspanne bearbeiten und eine Schaltfläche hinzufügen, um die Überschriftsebene festzulegen. Es funktioniert perfekt in Kombination mit dem Block Alle Produkte.

9. Produkte nach Attributen filtern

Quelle

Dieser Block fügt einen Filter hinzu, mit dem Ihre Kunden Produkte nach Attributen filtern können. Die Attribute können Farbe, Größe oder sogar Lebensmittelgeschmack sein.

Sie haben die Wahl, den Filter entweder als Liste oder als Dropdown anzuzeigen. Darüber hinaus können Sie die Überschriftenebene auswählen, die Wortanzahl einbeziehen oder eine Schaltfläche hinzufügen.

10. Neueste Produkte

Quelle

Sie können diesen Block verwenden, um alle Ihre neuesten Produkteinführungen und neuesten Produkte in einem Raster anzuzeigen. Kunden können die Produkte nach einer relevanten Kategorie filtern.

Dieser Block ist perfekt, um die neuen Lagerbestände Ihres Geschäfts auf der Homepage zu präsentieren und zu vermarkten und mehr Blicke auf sich zu ziehen. Die Anpassungsoptionen ähneln denen des Bestseller-Blocks.

Fazit

Egal, ob Sie technisch versiert oder ein Laie sind – die Verwendung von WooCommerce-Blöcken ist die einfachste und kostengünstigste Möglichkeit, Ihre Produkte auf ansprechende Weise zu präsentieren und Ihr Geschäft auf die nächste Stufe zu heben.

Sie können Ihre Produkte auf jeder Seite und jedem Blogbeitrag auf Ihrer Website bewerben. Alles, was Sie tun müssen, ist, die Blöcke an eine bestimmte Stelle auf einer Seite zu ziehen – und die Seite wird live in Echtzeit aktualisiert.

Wenn Sie also Ihren WooCommerce-Shop aufpeppen und mehr Aufmerksamkeit erregen möchten, verwenden Sie die oben genannten WooCommerce-Blöcke.

Wir haben auch Teil 2 dieses Artikels mit zehn weiteren WooCommerce-Blöcken und Möglichkeiten, sie mit Leichtigkeit hinzuzufügen und zu bearbeiten. Schaut es euch an, wenn es nächste Woche live geht!