Getwid – Blocs WordPress personnalisables pour Gutenberg

Gutenberg. La simple mention de ce mot peut faire fondre la glace. Habituellement, vous pouvez entendre une broche tomber dans le silence qui s’ensuit après que vous avez crié «GUTENBERG!» À certains endroits. Vous ne devriez peut-être pas crier mais ce n’est pas le problème. C’est une journée froide pour l’éditeur Gutenberg, ou c’est?

Lorsque Gutenberg est devenu l'éditeur de contenu par défaut de WordPress, de nombreux utilisateurs, débutants comme développeurs, étaient sceptiques. Ce fut une transition angoissante parce que – le changement. Grâce au nouvel éditeur, les utilisateurs devaient apprendre et s’adapter à une nouvelle façon de créer du contenu dans WordPress.

C’est vrai qu’il est difficile de changer les vieilles habitudes, ce qui explique peut-être pourquoi Gutenberg a dû affronter une forte résistance au début. Mais les choses ont énormément changé avec le temps. Tandis que de nombreux utilisateurs étaient perplexes au début, le nouvel éditeur lui a vite plu, en particulier quand il est si facile à utiliser et, surtout, qu’il s’agit d’extensions avec des plugins.

Grâce à des plugins tels que Getwid, l’objet de l’examen d’aujourd’hui, vous pouvez dynamiser Gutenberg d’une manière que vous n’aviez jamais imaginée. Et si l'élan se maintient (et il le fera), Gutenberg a un avenir très prometteur. À mon avis, de plus en plus d’utilisateurs n’auront guère besoin des créateurs de pages WordPress pour créer d’impressionnantes pages et publications.

Dans l’examen d’aujourd’hui, nous examinons toutes les fonctionnalités qui font de Getwid l’un des meilleurs plugins Gutenberg que vous trouverez sur le Web. Pour vous montrer à quoi vous attendre, nous testons le plugin et allons brièvement sur plus de 30 blocs que Getwid apporte à un éditeur déjà puissant de Gutenberg.

Avec ce préambule, il y a une tonne à couvrir, alors il vaut mieux obtenir large il. Regarde ce que j'ai fait là? Haha. OK, commençons.

Qu'est-ce que Getwid?

Tout d'abord, qu'est-ce que Getwid est? Eh bien, Getwid est un plugin astucieux qui vous aide à étendre l’éditeur Gutenberg en masse. Beaucoup simple? En d’autres termes, c’est une belle collection de 34 blocs qui vous permet de créer un contenu brillant dans Gutenberg.

Selon Motopress, le développeur, Getwid se connecte de manière transparente à Gutenberg, «… rendant la transition globale vers Gutenberg moins stressante». Une transition plus douce est particulièrement importante pour les utilisateurs novices. La meilleure partie est que le plugin est téléchargeable gratuitement sur WordPress.org, ce qui signifie que vous pouvez vous lancer immédiatement.

Getwid respecte les meilleures normes de codage WordPress, vous offrant la solution idéale pour enrichir votre contenu sans fouiller dans le code. En outre, il est entièrement compatible avec tous les thèmes WordPress prêts pour Gutenberg, ce qui signifie que vous ne rencontrerez aucun problème d’incompatibilité.

De plus, Getwid est compatible avec les autres plugins tiers de Gutenberg, ce qui vous offre davantage de fonctionnalités pour créer le contenu attrayant que vous désirez. En outre, Getwid propose une multitude d'options vous permettant de personnaliser chaque bloc en fonction de votre marque et de vos préférences.

Blocs Gutenberg faciles à utiliser

De plus, l’add-on est incroyablement facile à configurer et à utiliser, ce qui signifie que vous n’avez pas besoin d’un développeur pour vous tenir la main. Vous n’avez pas besoin de connaissances en codage non plus. De plus, Getwid propose les dernières astuces de performance, telles que la minification CSS, pour vous permettre de créer un contenu fantastique sans vous soucier de la vitesse de votre site WordPress.

En parlant de contenu fantastique, Getwid vous aide à «… créer des pages de destination efficaces, afficher des pages de services dynamiques, créer des portefeuilles accrocheurs», ajoutez de magnifiques curseurs, créez des en-têtes fantastiques, affichez des tableaux de prix et bien plus encore! Il vous offre tous les blocs dont vous avez besoin pour suralimenter «… les sites Web commerciaux, les startups, les projets créatifs et une diversité d'autres niches.»

Getwid List of Blocks de Gutenberg

Getwid est livré avec un bon nombre de blocs Gutenberg. N'oubliez pas que cela fonctionne également avec les blocs principaux de Gutenberg, ce qui signifie que rien ne devrait vous empêcher de créer un contenu génial qui convient à votre site Web. Voici la liste des blocs Gutenberg disponibles dans Getwid (Attention: c’est un peu fou):

• Section
• Média et curseur de texte
• Curseur d'image
• Icône
• Boîte à icônes
• Bannière (oui, avec animations – woo hoo!)
• Les accordéons
• Onglets
• Basculer
• Galerie d'images
• Google Maps
• Messages récents
• Titre avancé
• Boîte à images
• Spacer avancé
• Liens sociaux
• Groupe de boutons
• Témoignage
• Boîte à personnes
• Instagram
• Barre de progression
• Barre de progression circulaire
• Compteur
• Boîte de prix
• Formulaire de contact
• Post carrousel
• Poster Slider
• Type de message personnalisé
• Liste de prix
• MailChimp
• Popup vidéo
• Image Hotspot
• Compte à rebours
• Chronologie du contenu

Ouf, quelle liste? Et de penser que chacun des blocs ci-dessus comporte de nombreux paramètres, styles et options, vous permettant de concevoir votre contenu comme vous le souhaitez.

Jusqu'ici tout va bien, le plugin Getwid Gutenberg Block semble très prometteur.

Maintenant que vous savez avec quoi nous travaillons, installons Getwid et examinons les différents blocs. J'espère que la section suivante vous plaira autant que lorsque j'ai testé le plugin.

Comment installer le plugin Getwid Gutenberg Blocks

Puisque Getwid est disponible dans le référentiel officiel des plugins WordPress, nous ne perdons pas de temps à télécharger le plugin sur votre ordinateur. Au lieu de cela, nous installerons le plug-in directement à partir du tableau de bord d'administrateur WordPress.

Sans plus tarder, connectez-vous à votre tableau de bord d'administrateur WordPress et accédez à Plugins> Ajouter un nouveau comme je l'indique dans le screengrab ci-dessous.

Sur le Ajouter des plugins page, entrez «Getwid» dans la case de recherche par mot clé, puis appuyez sur la touche Installer Maintenant comme indiqué ci-dessous.

Sans perdre une seconde, cliquez sur le bouton Activer comme je le souligne ci-dessous pour finaliser l’installation.

Et c'est tout; Je ne mentais pas quand je vous ai dit que la mise en place de Getwid est facile

Voyons maintenant ce que Getwid a à offrir dans l’éditeur Gutenberg. Pour savoir ce qui est en magasin, nous devons créer une nouvelle page ou publier. Travaillez avec ce que vous voulez.

Ajout d'une nouvelle page

Je vais travailler avec une page uniquement à des fins d'illustration. Et aussi parce que j'utilise le thème total vénéré de WordPress, livré avec un modèle de page de destination.

A présent, vous savez probablement déjà comment ajouter une nouvelle page dans WordPress, mais si vous êtes un débutant absolu, accédez à Pages> Ajouter nouveau, comme on le voit ci-dessous.

Ajoutez le titre de votre page et choisissez les paramètres requis. Par exemple, si vous souhaitez créer une page de destination pleine largeur comme la vôtre, sélectionnez cette option dans la liste déroulante. Attributs de page section, comme indiqué ci-dessous.

Notez que vous pouvez avoir différentes options dans le Attributs de page section en fonction de votre thème.

Ajout de blocs Getwid Gutenberg

Ajouter des blocs Getwid revient à ajouter des blocs Gutenberg typiques. Clique le plus (+) bouton, faites défiler Getwid Des blocs, et choisissez le bloc que vous voulez.

Bloc de section

Pour ajouter une section Getwid, par exemple, ajoutez simplement le Section bloquer, comme indiqué ci-dessous.

Aussi simple que A, B, C. Après cela, vous devez concevoir / styliser votre section comme bon vous semble. Le bloc de section vous permet de créer de superbes mises en page section par section sans codage. Vous pouvez facilement ajouter des curseurs, des images d'arrière-plan, des vidéos, de la parallaxe, des animations, des formes, plusieurs couleurs, etc. à votre section. Pour voir une page créée à l'aide de blocs de section, consultez la démo de section suivante.

Comme indiqué dans l'image ci-dessous, vous pouvez ajouter n'importe quel bloc à l'intérieur du bloc de section. En outre, vous pouvez personnaliser la section à votre guise.

À droite de la page, vous avez beaucoup d'options pour personnaliser la section. Nous allons passer brièvement en revue les options de haut en bas.

• Taille – Définissez les dimensions de votre section ici. Au moment de la rédaction, vous avez trois options de largeur, à savoir: En boîte, pleine largeur, et Douane. De plus, vous pouvez définir différentes hauteurs de section pour les ordinateurs de bureau, les tablettes et les appareils mobiles. Enfin, vous avez la possibilité de spécifier les espaces entre les blocs de contenu dans le bloc de section.
• Rembourrage – L'option vous permet de définir le remplissage de votre section pour les ordinateurs de bureau, les tablettes et les appareils mobiles.
• Marge – Ajoutez des marges autour de votre bloc de section pour divers appareils.
• Alignement – Ici, vous pouvez spécifier la verticale et l’horizontale de votre section pour différents appareils.
• Couleur de l'arrière plan – Vous pouvez ajouter n'importe quelle couleur de fond aux sections.
• Dégradé de fond – Cette option vous aide à créer des dégradés d’arrière-plan pour votre section. Cette option est pratique si vous ne souhaitez pas utiliser d’arrière-plan de couleur unie.
• Image de fond – Ici, vous pouvez ajouter une image d’arrière-plan à votre section, au lieu d’utiliser des couleurs.
• Fond curseur – Vous pouvez maintenant ajouter des curseurs d’arrière-plan à vos sections de page. C'est gentil?
• Vidéo de fond – Vous souhaitez enrichir votre section avec une vidéo d'arrière-plan? Si oui, Getwid a votre dos.
• Premier plan – Ajouter des effets de premier plan à votre section.
• Diviseurs – Ajouter des séparateurs entre vos sections
• Animation d'entrée – Grâce à Getwid, vous pouvez animer différentes sections à votre guise.
• Avancée – Ici, vous pouvez ajouter une ancre HTML et une classe CSS

Bloc curseur de média et de texte

Pour ajouter un bloc de curseur multimédia et texte, cliquez sur le bouton plus (+) icône, faites défiler jusqu'à Getwid Blocks et cliquez Média et curseur de texte, comme indiqué ci-dessous.

Une fois que vous avez ajouté le bloc, vous pouvez télécharger votre média et ajouter du texte. En plus de cela, vous pouvez personnaliser le bloc à partir de la barre latérale droite, comme indiqué dans l'image ci-dessous.

Voici quelques notes sur les options de bloc média et texte dans la barre latérale droite, comme indiqué ci-dessus:

• Paramètres – Sous l'onglet Paramètres, vous pouvez spécifier le nombre de diapositives, la taille de l'image, la hauteur du curseur, la largeur du contenu et l'alignement vertical / horizontal.
• Couleur du texte – L'option vous permet de personnaliser la couleur du texte sur votre curseur
• Couleur de superposition – Vous pouvez définir la couleur de superposition et spécifier l'opacité de la superposition
• Rembourrage – Utilisez cette option pour ajouter facilement du rembourrage autour de vos curseurs multimédia et texte.
• Réglages du curseur – Ici, vous pouvez ajouter une animation à votre curseur et activer le diaporama
• Animation de texte – Animez le texte sur vos curseurs
• Avancée – Ajoutez une classe CSS personnalisée pour pouvoir personnaliser davantage vos curseurs

Voici un excellent exemple du bloc curseur de média et texte en action.

Curseur d'image

En plus du curseur de texte et de média, Getwid vous offre la Curseur d'image bloquer aussi. Pour ce faire, accédez à Getwid Blocks et cliquez sur le Curseur d'image bloquer comme je détaille dans la capture d'écran ci-dessous.

Une fois que vous avez téléchargé ou ajouté des images de la bibliothèque multimédia, vous pouvez personnaliser le curseur à partir de la barre latérale droite, comme indiqué ci-dessous.

Dans la barre latérale droite, vous avez deux options:

• Paramètres d'image – Dans cet onglet, vous pouvez choisir la taille de l'image, rogner automatiquement les images et lier chaque image au fichier multimédia ou à la page de pièce jointe. Cela est particulièrement utile si vous êtes photographe et utilisez des curseurs d’image pour afficher votre travail.
• Réglages du curseur – Vous pouvez spécifier ici le nombre de diapositives que vous pouvez afficher sur différents périphériques, tels que les ordinateurs de bureau, les ordinateurs portables, les tablettes et les appareils mobiles.
• Paramètres de contrôle – Sous cet onglet, vous pouvez spécifier où afficher les flèches et les points de navigation.
• Avancée – Ajoutez une classe CSS personnalisée ici

Pour obtenir une meilleure image, voici une démonstration du curseur d’image pour votre plus grand plaisir.

Bloc bannière

Un bloc bannière vous permet de faire de la publicité sur votre site WordPress comme un patron. L'ajout d'un bloc de bannière est également simple. Aller vers Getwid Blocks à l'intérieur de l'éditeur Gutenberg et cliquez sur le Bannière bloquer, comme indiqué ci-dessous.

Une fois que vous avez ajouté le fichier multimédia de votre bannière, vous disposez de plusieurs options, comme indiqué dans l'image ci-dessous.

Comme vous pouvez le voir sur l'image ci-dessus, vous pouvez facilement ajouter un lien vers votre bannière et l'ouvrir dans un nouvel onglet. Dans la barre latérale droite, vous avez plus d'options pour personnaliser vos bannières. Ici, vous pouvez personnaliser la taille de la bannière, son alignement, ses couleurs et ses animations.

Vous avez beaucoup d'options pour créer des bannières attrayantes pour votre site web. N'hésitez pas à consulter ces démonstrations de bannières pour avoir un aperçu de ce que vous pouvez créer.

Autres blocs Getwid Gutenberg

Aussi tentant soit-il, je ne peux peut-être pas couvrir 30 autres blocs Getwid dans l’examen d’aujourd’hui. Si nous faisons cela, vous serez là toute la journée, car l’article deviendra trop long à lire.

Néanmoins, j'espère que vous pourrez maintenant ajouter et personnaliser le bloc Getwid Gutenberg de votre choix. Tout ce que vous avez à faire est de naviguer vers Getwid Blocks et cliquez sur le bloc que vous voulez. Après cela, ajoutez votre contenu et personnalisez le bloc à partir de la barre latérale droite, comme nous l’avons fait pour les autres blocs.

Pour voir plus d'exemples de blocs Getwid Gutenberg en action, veuillez visiter la page du plugin Getwid sur MotoPress. En outre, voici un article Meet Getwid qui examine de manière plus approfondie les offres du plugin.

---

Getwid est un puissant plugin Gutenberg avec une belle suite de blocs. De plus, chaque bloc est livré avec un ensemble unique d’options qui vous permettent de créer un contenu attrayant en un rien de temps.

En plus de cela, le plugin est incroyablement facile à configurer et à utiliser. Vous n'avez pas besoin de connaissances en programmation ni d'expérience préalable pour tirer parti de la puissance de Getwid afin de générer un engagement sur votre site Web.

Le plugin est 100% gratuit et open source, ce qui signifie que vous pouvez l’utiliser et le personnaliser en profondeur sans vous soucier de votre portefeuille ou de vos licences. C’est l’outil idéal à avoir dans votre boîte à outils professionnelle WordPress.

J'espère que vous pouvez maintenant utiliser Getwid pour donner vie à vos pages et messages WordPress sans vous mettre à suer. Sinon, veuillez exprimer vos préoccupations et vos suggestions dans la section commentaires.

En dehors de cela, quel est votre plugin de blocs Gutenberg préféré?