ShopEngine-Integration mit Gutenberg für WooCommerce Store

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

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

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

Ein Überblick über Gutenberg:

Als WordPress-Benutzer müssen Sie mit dem Begriff vertraut sein Gutenberg. Es handelt sich um einen 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 Drittentwicklern erhältlich.

Früher war man eher daran gewöhnt, den „Classic Editor“ zu verwenden, einen anderen WordPress-Editor. Seit der Einführung von Gutenberg ist der Blockeditor im Vergleich zum klassischen Editor beliebter. 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 er es Drittentwicklern ermöglicht, benutzerdefinierte Blöcke einzubetten.

Und genau darauf konzentrieren wir uns in diesem informativen Blog, denn von nun an stehen Ihnen in Gutenberg für WooCommerce zahlreiche ShopEngine-Funktionen zur Verfügung. Bevor wir näher darauf eingehen Benutzerdefinierte Blöcke von ShopEngine in Gutenberg, lassen Sie mich erklären, warum wir integrierte ShopEngine mit Gutenberg für WooCommerce.

Warum ShopEngine mit Gutenberg integrieren:

ShopEngine wurde ursprünglich exklusiv 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 geprägt? Integrieren Sie ShopEngine mit Gutenberg für WooCommerce? Um diese Frage zu beantworten, möchte ich Ihnen einige Daten präsentieren:

Gemäß der gutenstats.blogBisher hat Gutenberg 76 Millionen aktive Installationen erhalten. Darüber hinaus wurden bisher 264,5 Millionen Beiträge mit Gutenberg geschrieben.

Diese Daten reichen meiner Meinung nach aus, um jeden davon zu überzeugen, warum wir das Angebot von ShopEngine auf Gutenberg ausgeweitet haben. Millionen von Menschen nutzen Gutenberg, um ihre Inhalte zu entwickeln, und wir möchten nicht, dass ihnen das Spannende entgeht Funktionen, die ShopEngine bietet an.

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

Lassen Sie mich einen Punkt hervorheben Gutenberg ist nicht nur ein Content-Editor. Das Gutenberg-Projekt zielt darauf ab, den Blockeditor in einen zu verwandeln Vollständiges Bearbeitungstool für die Website in naher Zukunft.

Die Idee besteht darin, dass Sie mit dem Gutenberg-Editor 100% Ihrer WooCommerce-Site entwerfen können. Sollte dies geschehen, dürfte die Nachfrage nach Gutenberg sprunghaft ansteigen. 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 weist keine Kompatibilitätsprobleme auf, sodass Entwickler die Gutenberg-Unterstützung problemlos in ihre Plugins integrieren können.
• Gutenberg gibt einen schlanken Code aus und ist außerdem ein schnell ladendes Tool.

Einige der bemerkenswerten ShopEngine-Blöcke in Gutenberg:

Bevor ich näher auf ShopEngine-Blöcke eingehe, möchte ich klarstellen, dass ShopEngine im Lieferumfang enthalten ist Über 65 Widgets, 13+ Module, Und unzählige Vorlagen für WooCommerce-Shopseiten für Elementor-Benutzer. Nach der Integration von ShopEngine mit Gutenberg für WooCommerce können Sie nun Zugriff darauf erhalten Über 45 ShopEngine-Blöcke in Gutenberg.

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 Produktname Der Block 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 Block „Produkttitel“ 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. Produktliste Der Block 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 auswählen, in der die Produkte angezeigt werden sollen. 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, Verkaufsabzeichen ein-/ausblenden, Rabattprozentsatz usw. auswählen.

Produktbeschreibung:

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

Zahlung an der Kasse:

Wie das Checkout-Zahlungs-Widget in Elementor, Kasse Zahlungssperre arbeitet in Gutenberg. Sie können den Block „Zahlung zur Kasse“ anzeigen, wenn Sie fortfahren Erstellen Sie eine Vorlage für Ihre Checkout-Seite. Danach können Sie die Checkout-Zahlungssperre 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 des Kontrollkästchens, die Schaltflächenfarbe, die Typografie, den Rahmen usw. anpassen.

Archivprodukte:

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

Die Seite „Archivprodukte“ verfügt über zahlreiche Segmente, darunter Layout, Inhalt, Paginierung, Bewertung usw. Die Seite enthält zahlreiche Elemente wie Produkttitel, Produktbild, Produktpreis, Produktbeschreibung, Produktfußzeile usw.

Warenkorbtisch:

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

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

Kürzlich angesehene Produkte:

Mit ShopEngine's Block „Zuletzt angesehene Produkte“.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 in der rechten Seitenleiste die Parameter sehen, die sich auf kürzlich angesehene Produkte beziehen. 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:

Also, was halten Sie von unserem Schritt? Integrieren Sie ShopEngine mit Gutenberg für WooCommerce? Teilen Sie uns Ihre Erfahrungen mit der Bereitstellung von ShopEngine-Blöcken im Gutenberg-Shop für WooCommerce mit.

Sie sind herzlich willkommen, uns positives oder negatives Feedback zur Gutenberg-Integration für WooCommerce zu geben. Wir würden uns auch über Vorschläge von Ihnen freuen, um unseren Integrationsprozess zu optimieren. Unsere Arbeiten laufen jedoch weiter ShopEngine-Integration mit Gutenberg ist noch in Bearbeitung. In Kürze werden wir mit dem Projekt fertig sein.