Intégration de ShopEngine avec Gutenberg pour la boutique WooCommerce

Enfin, l'attente est terminée! ShopEngine est désormais compatible avec votre Éditeur de blocs Gutenberg. Auparavant, vous ne pouviez accéder aux widgets ShopEngine que via la fenêtre Elementor, n'est-ce pas ?

Mais maintenant, ShopEngine est disponible au-delà de cela. En plus d'accéder aux widgets ShopEngine via Elementor, vous pouvez utiliser ShopEngine dans Gutenberg pour la boutique WooCommerce. Cependant, dans Gutenberg, ces widgets apparaîtront sous forme de blocs.

En fait, les fonctions des widgets Elementor et des blocs Gutenberg sont identiques. Alors, où est la différence ? La différence réside dans l'application. Pour les widgets Elementor, vous deviez glisser et déposer les widgets sur les zones désignées pour afficher la sortie. Mais pour les blocs Gutenberg, il vous suffit de cliquer sur les blocs et votre travail est terminé.

Un aperçu de Gutenberg :

En tant qu'utilisateur de WordPress, vous devez connaître le terme Gutenberg. Il s'agit d'un éditeur de contenu WordPress, également connu sous le nom d'éditeur de blocs WordPress. De nos jours, Gutenberg est l’éditeur WordPress le plus populaire parmi les utilisateurs de WordPress en raison de sa facilité d’utilisation. Beaucoup Plugins WordPress Gutenberg sont également disponibles auprès de développeurs tiers.

Auparavant, les gens étaient plus habitués à utiliser « Classic Editor », un autre éditeur WordPress. Depuis l’avènement de Gutenberg, les gens ont davantage adopté l’éditeur de blocs que l’éditeur classique. La spécialité de Gutenberg est son contenu basé sur des blocs.

Qu'il s'agisse d'un paragraphe, d'une image ou d'un bouton, chacun de ces éléments est un bloc. Contrairement à Classic Editor, cet éditeur de contenu basé sur des blocs vous permet de manipuler votre contenu avec plus de contrôle. La meilleure partie de cet éditeur de blocs est qu'il permet aux développeurs tiers d'intégrer des blocs personnalisés.

Et c'est exactement sur cela que nous allons nous concentrer sur ce blog informatif puisque désormais, un tas de fonctionnalités de ShopEngine seront à votre disposition dans Gutenberg pour WooCommerce. Avant de nous étendre sur Les blocs personnalisés de ShopEngine dans Gutenberg, permettez-moi de vous expliquer pourquoi nous ShopEngine intégré à Gutenberg pour WooCommerce.

Pourquoi intégrer ShopEngine à Gutenberg :

ShopEngine a été initialement conçu exclusivement pour Elementor. Cela signifie que vous pouvez créer vos pages WooCommerce uniquement pour Elementor. Mais maintenant, comme je l'ai mentionné plus tôt, ShopEngine a fait un pas en avant après avoir été intégré à Gutenberg.

Alors, qu'est-ce qui nous a fait intégrer ShopEngine avec Gutenberg pour WooCommerce? Pour répondre à cette question, permettez-moi de vous présenter des éléments de données.

Selon le gutenstats.blog, Gutenberg a reçu jusqu'à présent 76 millions d'installations actives. En plus de cela, 264,5 millions d’articles écrits avec Gutenberg à ce jour.

Je pense que ces données sont suffisantes pour convaincre quiconque de la raison pour laquelle nous avons étendu la gamme ShopEngine à Gutenberg. Des millions de personnes utilisent Gutenberg pour développer leur contenu et nous ne voulons pas qu'elles passent à côté de cette occasion fascinante. fonctionnalités que ShopEngine des offres.

Quelques autres raisons de l'intégration de ShopEngine avec Gutenberg :

Permettez-moi de souligner un point qui Gutenberg n'est pas seulement un éditeur de contenu. Le projet Gutenberg vise à transformer l'éditeur de blocs en un outil d'édition complet du site dans le futur proche.

L'idée est de vous laisser concevoir le 100% de votre site WooCommerce avec l'éditeur Gutenberg. Si cela se produit, la demande pour Gutenberg risque de monter en flèche. Cela vaut donc la peine d'intégrer ShopEngine avec Gutenberg pour WooCommerce, n'est-ce pas ?

• Avec Gutenberg, vous n'avez pas besoin d'utiliser des shortcodes pour intégrer du contenu. Au lieu de cela, vous pouvez déployer les blocs pour ajouter les éléments de page nécessaires.
• Gutenberg est exempt de problèmes de compatibilité, les développeurs peuvent donc facilement intégrer la prise en charge de Gutenberg dans leurs plugins.
• Gutenberg génère un code léger et constitue également un outil à chargement rapide.

Certains des blocs ShopEngine notables de Gutenberg :

Avant de faire la lumière sur les blocs ShopEngine, permettez-moi de préciser que ShopEngine est livré avec 65+ widgets, 13+ modules, et une myriade de modèles pour les pages de la boutique WooCommerce destinées aux utilisateurs d'Elementor. Après l'intégration de ShopEngine avec Gutenberg pour WooCommerce, vous pouvez désormais accéder à Plus de 45 blocs ShopEngine à Gutenberg.

Selon le type de page que vous sélectionnez pour créer un modèle pour votre boutique WooCommerce, les blocs Gutenberg s'afficheront en conséquence. De plus, vous aurez accès à des modules comme Aperçu rapide, échantillons de variations, comparaison de produits et liste de souhaits.

Jetons un coup d'œil à certains des blocs ShopEngine dans la boutique Gutenberg pour WooCommerce.

Titre du produit :

Le Titre du produit le bloc apparaît sur une seule page pour un produit spécifique. Après avoir sélectionné un type de page unique pour créer votre modèle, il vous suffit de cliquer sur le bloc Titre du produit dans la barre latérale.

Immédiatement après, le titre de votre produit apparaîtra sur la page. Dans la barre latérale droite, vous pouvez modifier la balise de titre, l'alignement, la couleur et la typographie.

Liste de produits:

La liste des produits affiche tous les types de produits que vous vendez dans votre boutique WooCommerce. Liste de produits Le bloc apparaît dans tous les types de pages, y compris les pages simples, de boutique, de paiement et de panier. Une fois que vous avez sélectionné le type de page, cliquez sur la liste de produits dans la fenêtre contextuelle ou la barre latérale.

Assurez-vous de sélectionner la catégorie de produits pour que les produits s'affichent. Dans la barre latérale droite, vous pouvez sélectionner et personnaliser différents éléments de la liste de produits. Vous pouvez sélectionner le nombre de produits par page, les balises, afficher/masquer le badge de vente, le pourcentage de remise, etc.

Description du produit:

Si vous créez un modèle de page unique, Description du produit Le bloc apparaîtra dans la barre latérale. Pour faire apparaître la description du produit sur votre page, cliquez sur le bloc de description du produit. Vous pouvez personnaliser la description et également la styliser en modifiant la typographie, la couleur, l'alignement, etc.

Paiement à la caisse :

Comme le widget Checkout Payment dans Elementor, Commander Blocage du paiement travaille à Gutenberg. Vous pouvez voir le bloc « Paiement à la caisse » si vous allez sur créer un modèle pour votre page de paiement. Après cela, vous pouvez ajouter le bloc de paiement de caisse selon vos besoins pour votre boutique WooCommerce.

Vous aurez la possibilité de modifier le style du contenu, les méthodes de paiement, le bouton, etc. Vous pouvez modifier la position de la case à cocher, la couleur du bouton, la typographie, la bordure, etc.

Produits d'archives :

La page des produits archivés contient tous les produits publiés en un seul endroit. Pour créer un modèle de page d'archive dans Gutenberg pour WooCommerce, allez simplement dans la barre latérale gauche et cliquez sur le bouton Bloc Produits d'archives. Tous les produits de l'inventaire apparaîtront les uns après les autres.

La page Archiver les produits propose une multitude de segments, notamment la mise en page, le contenu, la pagination, l'évaluation, etc. La page contient de nombreux éléments tels que le titre du produit, l'image du produit, le prix du produit, la description du produit, le pied de page du produit, etc.

Tableau du chariot :

Dans le tableau du panier, tous les détails de vos produits sélectionnés apparaissent, y compris le nom des produits, le prix, la quantité, le sous-total et le montant total. Avec ShopEngine Bloc de table, vous pouvez présenter à vos acheteurs toutes les informations pertinentes pour vos produits via un tableau de panier dans le Page du panier WooCommerce.

Afin de personnaliser le contenu et de styliser les différents éléments du tableau du panier, vous obtiendrez des paramètres dans la barre latérale droite. Vous pouvez modifier les couleurs de l'en-tête et du pied de page du produit, la couleur de la bordure, la couleur du texte, ainsi que personnaliser les sections de contenu, notamment le titre, le prix, la quantité, le total, etc.

Derniers produits consultés:

Avec ShopEngine Bloc Produits récemment consultés, vous pouvez présenter les produits que vos utilisateurs ont récemment consultés ou consultés dans votre boutique WooCommerce. Vous pouvez afficher les produits récemment consultés sur la page de la boutique, la page produit, la page du panier, etc.

Comme pour les autres blocs, vous pouvez remarquer les paramètres liés aux produits récemment consultés dans la barre latérale droite. En tirant parti des paramètres, vous pouvez spécifier le nombre de produits à afficher, afficher/masquer les badges de vente, définir l'espace entre les colonnes et les lignes, ajuster la hauteur des images de produits, etc.

Liquidation:

Alors, que pensez-vous de notre déménagement vers intégrer ShopEngine avec Gutenberg pour WooCommerce? Faites-nous part de votre expérience de déploiement de blocs ShopEngine dans la boutique Gutenberg pour WooCommerce.

N'hésitez pas à donner votre avis positif ou négatif sur l'intégration de Gutenberg pour WooCommerce. Nous apprécierions également de recevoir vos suggestions pour rationaliser notre processus d’intégration. Cependant, nos travaux sur Intégration de ShopEngine avec Gutenberg est toujours en cours. Bientôt, nous en aurons terminé avec le projet.