ShopEngine-Integration mit Gutenberg für den WooCommerce Store

Endlich hat das Warten ein Ende! ShopEngine ist jetzt mit Ihrem Gutenberg- Blockeditor kompatibel. Früher konnten Sie auf ShopEngine-Widgets nur über das Elementor-Fenster zugreifen, richtig?

Aber jetzt ist ShopEngine darüber hinaus verfügbar. Neben dem Zugriff auf ShopEngine-Widgets über Elementor können Sie ShopEngine in Gutenberg für den WooCommerce-Shop verwenden. In Gutenberg werden diese Widgets jedoch als Blöcke angezeigt.

Tatsächlich sind die Funktionen von Elementor-Widgets und Gutenberg-Blöcken identisch. Wo ist dann der Unterschied? Der Unterschied liegt in der Anwendung. Für Elementor-Widgets mussten Sie Widgets per Drag-and-Drop auf die vorgesehenen Bereiche ziehen, um die Ausgabe anzuzeigen. Aber für Gutenberg-Blöcke müssen Sie nur auf die Blöcke klicken und Ihre Arbeit ist erledigt.

Ein Überblick über Gutenberg:

Als WordPress-Benutzer müssen Sie mit dem Begriff Gutenberg vertraut sein. Es ist ein WordPress-Inhaltseditor, auch bekannt als WordPress-Blockeditor. Heutzutage ist Gutenberg aufgrund seiner Benutzerfreundlichkeit der beliebteste WordPress-Editor unter den WordPress-Benutzern. Viele WordPress Gutenberg-Plugins sind auch von Drittanbietern erhältlich.

Früher waren die Leute eher daran gewöhnt, „Classic Editor“, einen anderen WordPress-Editor, zu verwenden. Seit dem Aufkommen von Gutenberg haben die Leute den Blockeditor mehr angenommen als den klassischen Editor. Die Spezialität von Gutenberg ist sein blockbasierter Inhalt .

Egal ob Absatz, Bild oder Button, jedes dieser Elemente ist ein Block. Im Gegensatz zum klassischen Editor können Sie mit diesem blockbasierten Inhaltseditor Ihre Inhalte mit mehr Kontrolle bearbeiten. Das Beste an diesem Blockeditor ist, dass Entwickler von Drittanbietern benutzerdefinierte Blöcke einbetten können.

Und genau darauf konzentrieren wir uns in diesem informativen Blog, denn von nun an stehen Ihnen in Gutenberg für WooCommerce jede Menge Funktionen von ShopEngine zur Verfügung. Bevor wir uns mit den benutzerdefinierten Blöcken von ShopEngine in Gutenberg befassen, möchte ich erläutern, warum wir ShopEngine mit Gutenberg für WooCommerce integriert haben .

Warum ShopEngine mit Gutenberg integrieren:

ShopEngine wurde ursprünglich ausschließlich für Elementor entwickelt. Das bedeutet, dass Sie Ihre WooCommerce-Seiten nur für Elementor erstellen können. Aber jetzt, wie ich bereits erwähnt habe, ist ShopEngine nach der Integration mit Gutenberg einen Schritt nach vorne gegangen.

Was hat uns also dazu gebracht, ShopEngine mit Gutenberg für WooCommerce zu integrieren ? Um diese Frage zu beantworten, lassen Sie mich Ihnen Daten präsentieren-

Laut gutenstats.blog hat Gutenberg bisher 76 Millionen aktive Installationen erhalten. Darüber hinaus wurden bis heute 264,5 Millionen Posts mit Gutenberg geschrieben.

Ich denke, diese Daten reichen aus, um jeden davon zu überzeugen, warum wir das Sortiment von ShopEngine auf Gutenberg erweitert haben. Millionen von Menschen setzen Gutenberg ein, um ihre Inhalte zu entwickeln, und wir möchten nicht, dass sie die fesselnden Funktionen von ShopEngine verpassen.

Einige weitere Gründe für die ShopEngine-Integration mit Gutenberg:

Lassen Sie mich einen Punkt betonen, dass Gutenberg nicht nur ein Herausgeber von Inhalten ist . Das Gutenberg-Projekt zielt darauf ab, den Blockeditor in naher Zukunft in ein vollständiges Website-Bearbeitungstool zu verwandeln.

Die Idee ist, dass Sie 100% Ihrer WooCommerce-Site mit dem Gutenberg-Editor gestalten können. Wenn dies geschieht, wird die Nachfrage nach Gutenberg wahrscheinlich in die Höhe schnellen. Es lohnt sich also, ShopEngine mit Gutenberg für WooCommerce zu integrieren, oder?

• Mit Gutenberg müssen Sie keine Shortcodes verwenden, um Inhalte einzubetten. Stattdessen können Sie die Blöcke bereitstellen, um die erforderlichen Seitenelemente hinzuzufügen.
• Gutenberg ist frei von Kompatibilitätsproblemen, sodass Entwickler die Gutenberg-Unterstützung problemlos in ihre Plugins integrieren können.
• Gutenberg gibt einen leichten Code aus und ist auch ein schnell ladendes Tool.

Einige der bemerkenswerten ShopEngine-Blöcke in Gutenberg:

Bevor ich die ShopEngine-Blöcke beleuchte, möchte ich klarstellen, dass ShopEngine mit über 65 Widgets , über 13 Modulen und unzähligen Vorlagen für WooCommerce-Shopseiten für Elementor-Benutzer geliefert wird. Nach der Integration von ShopEngine mit Gutenberg für WooCommerce können Sie jetzt auf über 45 ShopEngine-Blöcke in Gutenberg zugreifen.

Abhängig vom Seitentyp, den Sie zum Erstellen einer Vorlage für Ihren WooCommerce-Shop auswählen, werden Gutenberg-Blöcke entsprechend angezeigt. Darüber hinaus erhalten Sie Zugriff auf Module wie Schnellansicht, Variationsmuster, Produktvergleich und Wunschliste .

Werfen wir einen Blick auf einige der ShopEngine-Blöcke in Gutenberg für den WooCommerce-Shop.

Produktname:

Der Produkttitelblock wird auf einer einzelnen Seite für ein bestimmtes Produkt angezeigt. Nachdem Sie den Einzelseitentyp zum Erstellen Ihrer Vorlage ausgewählt haben, müssen Sie nur noch auf den Produkttitelblock in der Seitenleiste klicken.

Unmittelbar danach erscheint Ihr Produkttitel auf der Seite. In der rechten Seitenleiste können Sie Titel-Tag, Ausrichtung, Farbe und Typografie ändern.

Produktliste:

Die Produktliste zeigt alle Arten von Produkten an, die Sie in Ihrem WooCommerce-Shop verkaufen. Der Produktlistenblock erscheint auf allen Arten von Seiten, einschließlich Einzel-, Shop-, Checkout- und Warenkorbseiten. Nachdem Sie den Seitentyp ausgewählt haben, klicken Sie im Popup oder in der Seitenleiste auf die Produktliste.

Stellen Sie sicher, dass Sie die Produktkategorie für die anzuzeigenden Produkte auswählen. In der rechten Seitenleiste können Sie verschiedene Elemente der Produktliste auswählen und anpassen. Sie können die Anzahl der Produkte pro Seite, Tags, das Verkaufsabzeichen ein-/ausblenden, den Rabattprozentsatz usw. auswählen.

Produktbeschreibung:

Wenn Sie eine einzelne Seitenvorlage erstellen, wird der Produktbeschreibungsblock in der Seitenleiste angezeigt. Um die Produktbeschreibung auf Ihrer Seite anzuzeigen, klicken Sie auf den Produktbeschreibungsblock. Sie können die Beschreibung anpassen und auch stilisieren, indem Sie Typografie, Farbe, Ausrichtung usw. ändern.

Zahlung an der Kasse:

Wie das Checkout-Zahlungs-Widget in Elementor funktioniert der Checkout-Zahlungsblock in Gutenberg. Sie können den Block „Checkout Payment“ anzeigen, wenn Sie zur Erstellungsvorlage für Ihre Checkout-Seite gehen. Danach können Sie den Checkout-Zahlungsblock nach Bedarf für Ihren WooCommerce-Shop hinzufügen.

Sie haben die Möglichkeit, den Inhaltsstil, die Zahlungsmethoden, die Schaltfläche usw. zu ändern. Sie können die Position der Kontrollkästchen, die Farbe der Schaltfläche, die Typografie, den Rahmen usw. anpassen.

Archiv Produkte:

Die Seite „Archivierte Produkte“ enthält alle geposteten Produkte an einem Ort. Um eine Vorlage für die Archivseite in Gutenberg für WooCommerce zu erstellen, gehen Sie einfach zur linken Seitenleiste und klicken Sie auf den Block Produkte archivieren . Alle Produkte des Inventars werden nacheinander angezeigt.

Die Archivproduktseite bietet eine Fülle von Segmenten, darunter Layout, Inhalt, Paginierung, Bewertung usw. Die Seite enthält viele Elemente wie Produkttitel, Produktbild, Produktpreis, Produktbeschreibung, Produktfußzeile und so weiter.

Wagentabelle:

In der Warenkorbtabelle werden alle Details Ihrer ausgewählten Produkte angezeigt, einschließlich Produktname, Preis, Menge, Zwischensumme und Gesamtbetrag. Mit dem Warenkorbtabellenblock von ShopEngine können Sie Ihren Käufern alle für Ihre Produkte relevanten Informationen über eine Warenkorbtabelle auf der WooCommerce-Warenkorbseite präsentieren.

Um den Inhalt anzupassen und verschiedene Elemente der Warenkorbtabelle zu stilisieren, erhalten Sie Parameter in der rechten Seitenleiste. Sie können Kopf- und Fußzeilenfarben, Randfarbe, Textfarbe des Produkts anpassen sowie Inhaltsabschnitte anpassen, einschließlich Titel, Preis, Menge, Gesamtsumme usw.

Kürzlich angesehene Produkte:

Mit dem Block „Zuletzt angesehene Produkte“ von ShopEngine können Sie die Produkte präsentieren, die Ihre Benutzer kürzlich in Ihrem WooCommerce-Shop durchsucht oder angesehen haben. Sie können kürzlich angesehene Produkte auf der Shop-Seite, Produktseite, Warenkorbseite usw. anzeigen.

Wie bei den anderen Blöcken können Sie die Parameter für kürzlich angesehene Produkte in der rechten Seitenleiste sehen. Mithilfe der Parameter können Sie die Anzahl der anzuzeigenden Produkte angeben, Verkaufsabzeichen ein-/ausblenden, den Spalten- und Zeilenabstand festlegen, die Höhe der Produktbilder anpassen usw.

Auflösung:

Was halten Sie also von unserem Schritt, ShopEngine mit Gutenberg für WooCommerce zu integrieren ? Teilen Sie uns Ihre Erfahrungen mit der Bereitstellung von ShopEngine-Blöcken in Gutenberg für den WooCommerce-Shop mit.

Sie sind herzlich eingeladen, positives oder negatives Feedback zur Gutenberg-Integration für WooCommerce zu geben. Wir würden uns auch freuen, Vorschläge von Ihnen entgegenzunehmen, um unseren Integrationsprozess zu optimieren. Unsere Arbeiten an der ShopEngine-Integration mit Gutenberg sind jedoch noch im Gange. In Kürze sind wir mit dem Projekt fertig.