Lorsque WordPress 5.0 est finalement sorti, l’éditeur Gutenberg WordPress a remplacé l’éditeur classique comme éditeur par défaut de WordPress. Cela a constitué une refonte majeure de l’expérience de publication de contenu.
Maintenant, à partir de notre expérience du développement de sites web WordPress, nous allons partager plusieurs idées sur la façon d’utiliser cette fonctionnalité.
Le déploiement de Gutenberg
WordPress a plusieurs développements passionnants en réserve et Gutenberg WordPress pose les bases d’un nouveau WordPress plus brillant et meilleur. Gutenberg est la première étape de la stratégie de déploiement de WordPress en trois volets. En plus de la refonte de l’éditeur, les deux autres étapes de cette stratégie incluent une concentration approfondie sur les modèles de page, ainsi que la transformation de WordPress en un personnalisateur de site Web complet.
L’éditeur de bloc Gutenberg WordPress existe désormais et vous pouvez l’utiliser pour créer votre nouveau site web d’entreprise afin d’atteindre vos objectifs commerciaux en fournissant une présentation d’entreprise de haute qualité sur Internet.
Pensez-vous que WordPress est une bonne plateforme pour un site web d’entreprise ? Notre spécialiste de WordPress a décrit les avantages et les inconvénients de WordPress dans l’article 6 signes qui indiquent qu’un site web a besoin d’être remanié.
L’environnement Gutenberg WordPress
Cet éditeur de WordPress porte le nom du fondateur de la presse à imprimer mobile, Johannes Gutenberg. Il a été développé dans le seul but de faciliter l’utilisation de l’éditeur visuel sur WP. Il y parvient notamment en introduisant des blocs et en offrant des options de mise en page avancées supplémentaires. L’interface utilisateur basée sur des blocs est conçue pour être flexible et a un aspect différent de celui de l’ancien éditeur classique.
Chaque composant de la page est représenté sous la forme d’un bloc modulaire accessible à partir d’un menu de blocs, pouvant être déposé n’importe où et édité pour créer une présentation personnalisée selon les souhaits des utilisateurs. C’était une excellente idée pour les personnes non-techniciennes qui ne peuvent pas ou n’aiment pas le code de personnaliser les pages.
Lorsque vous utilisez l’éditeur Gutenberg dans WordPress, vous devez vous attendre à ce qui suit :
- Une façon modernisée de rédiger, d’éditer et de publier le contenu qui met l’accent sur la simplicité et la convivialité
- Des blocs qui unifient plusieurs interfaces
- Développement de blocs de primes supérieurs aux widgets et aux shortcodes
- Un nouvel outil qui permet aux développeurs de personnaliser entièrement le site
- L’utilisation de Gutenberg dans WordPress peut vous aider à améliorer votre référencement, mais cet éditeur n’est pas un facteur de classement (vous l’avez deviné, il vaut donc mieux commander des services de référencement pour augmenter le trafic sur votre site)
Obtenir l’éditeur Gutenberg WordPress
Tout d’abord, Gutenberg ne travaille qu’avec WordPress 4.8 ou plus récent. La dernière version de Gutenberg WordPress peut être téléchargée à partir du dépôt de WordPress ou en la recherchant dans l’option « Add New » de votre tableau de bord WordPress.
Une fois installé, Gutenberg WordPress ne remplacera pas votre éditeur WP par défaut mais apparaîtra sous forme de lien sous vos messages. Grâce à ce lien, vous pouvez maintenant ouvrir l’éditeur Gutenberg.
Un menu Gutenberg sera également ajouté à votre tableau de bord.
Utiliser l’éditeur Gutenberg WordPress
À première vue, vous pouvez dire que Gutenberg est très différent de l’éditeur auquel vous êtes habitué sur WordPress.
Gutenberg est écrit en React – un framework JavaScript. Il tire également parti des technologies modernes telles que WebPack, REST API, ESnext + JSX, etc. Il ouvre ainsi un tout nouveau monde aux développeurs en termes de développement de blocs.
L’éditeur Gutenberg WordPress vous offre un environnement d’écriture propre et sans distraction, avec une typographie impeccable et beaucoup d’espace d’écriture. Cet éditeur s’attache vraiment à mettre l’accent sur l’écriture, ce qui est particulièrement favorable aux personnes qui écrivent sur des ordinateurs portables.
Les paramètres de Gutenberg WordPress peuvent être ouverts par document ou par bloc à partir de l’icône en forme de roue dentée placée en haut à droite de l’éditeur. À côté de cette icône, il y a trois points qui permettent de passer à un éditeur de code.
Les blocs sont au cœur de la création de contenu à l’aide de Gutenberg WordPress. Les blocs sont des modules qui sont préconstruits pour aider un utilisateur à présenter le contenu de son site WordPress de manière plus claire et plus cohérente. Les blocs présentent essentiellement une technique de style unifiée qui ne nécessite pas de programmation avancée ou d’autres fonctionnalités de formatage telles que les shortcodes, les formats de posts, l’option de thème, etc.
Le concept des blocs permet une personnalisation facile et rapide. Grâce à ces blocs, il est possible de définir chaque aspect du contenu. Il est possible de définir plus précisément leurs spécifications par bloc. Une seule ligne de texte peut, par exemple, être transformée en citation en ajustant son type de bloc. Chaque type de bloc est accompagné d’un ensemble unique d’options qui permettent de définir l’emplacement, la décoration et de nombreuses autres caractéristiques du contenu.
Gutenberg WordPress propose des différents blocs Chaque bloc peut être personnalisé pour avoir sa propre mise en page et peut également être enregistré comme bloc réutilisable.
Par conséquent, Gutenberg WordPress ressemble à une solution moderne pour implémenter la meilleure conception UI/UX sur un site WordPress pour le rendre convivial, augmenter le taux de conversion et gagner plus en conséquence.
Comparatif entre Gutenberg et l’éditeur classique
Gutenberg, tout comme l’éditeur classique, est principalement conçu pour éditer uniquement le contenu. Il est cependant différent
de la manière suivante:
- Il comprend divers blocs extensibles qui ont des attributs définis
- Il se concentre principalement sur la création de contenu et, par conséquent, l’interface offre des interactions minimales
avec des outils de développement. L’interface utilisateur ressemble donc à un éditeur frontal. - Le contenu créé avec l’éditeur classique peut être entièrement converti à Gutenberg. Cependant, le contenu Gutenberg ne peut être que partiellement converti en classique.
- Le contenu Gutenberg est stocké sous forme de commentaires HTML sémantiques, tandis que le contenu classique est stocké sous forme de raccourcis.
Compatibilité de l’éditeur Gutenberg WordPress
Étant donné que Gutenberg WordPress est un changement nouveau et important, il est essentiel que vous vérifiiez que vos produits seront compatibles avec cet éditeur. Gutenberg WordPress affecte les shortcodes, les types de messages personnalisés (CPT), les métaboxes ainsi que tout contenu généré. Les thèmes WordPress, à leur tour, modifient l’éditeur via les styles de l’éditeur. La plupart des plugins sont néanmoins compatibles avec Gutenberg dans WordPress.
Avantages de l’éditeur Gutenberg dans WordPress
Les avis positifs disent que cet éditeur offre un grand espace d’écriture et une interface sans distraction. Les avantages de l’utilisation de l’éditeur WordPress de Gutenberg sont donc nombreux :
- Gutenberg est facile à utiliser, même pour les utilisateurs non techniques et les débutants.
- Il permet à l’utilisateur de créer facilement des articles WordPress comportant une grande variété de contenus multimédia.
- Il réduit la dépendance excessive à l’égard de TinyMCE.
- Les développeurs de thèmes et de plugins peuvent créer des blocs personnalisés sans effort.
- L’utilisation des blocs est facile, amusante et la nouvelle option d’alignement qu’ils offrent est géniale.
- Gutenberg fonctionne très bien sur toutes les plateformes, y compris les mobiles.
- Il permet de développer des modèles en pleine largeur, en haute résolution et réactifs.
Inconvénients de l’éditeur Gutenberg dans WordPress
La plupart des critiques négatives sur Gutenberg WordPress proviennent d’utilisateurs qui sont réticents à adopter cet éditeur pour
diverses raisons. Malgré cela, l’éditeur présente plusieurs inconvénients, notamment
- Il est incompatible avec certains des plugins. Mais c’est un problème courant pour les développeurs de plugins WordPress.
Comme vous pouvez le voir, il n’y a qu’un seul inconvénient. Vous devez juste vous y habituer.
Comment désactiver l’éditeur Gutenberg WordPress
Si, pour certaines raisons, vous ne souhaitez pas l’utiliser ou si vous commencez à rencontrer des problèmes avec le site, vous pouvez désactiver complètement Gutenberg WordPress en ajoutant un petit code au fichier de fonction (function.php) de votre thème actuel.
Avant d’apporter des modifications à « function.php », faites toujours une sauvegarde ou une copie de sauvegarde, afin de pouvoir le rétablir dans son état initial si une erreur se produit.
Option 1 ; Ajout du code de restauration pour PHP 7 et supérieur.
if( ‘disable_gutenberg’ ){
add_filter( ‘use_block_editor_for_post_type’, ‘__return_false’, 100 );
add_action( ‘admin_init’, function(){
remove_action( ‘admin_notices’, [ ‘WP_Privacy_Policy_Content’, ‘notice’ ] );
add_action( ‘edit_form_after_title’, [ ‘WP_Privacy_Policy_Content’, ‘notice’ ] );
});
}
Ajoutez le code ci-dessus jusqu’à la toute fin ; juste avant la balise PHP de fermeture ?>. Si vous ne pouvez pas voir la balise PHP ?> et que vous n’êtes pas familier avec « function.php », placez le code à la toute fin du fichier. Sinon, vous pouvez placer le code n’importe où dans « function.php », si vous êtes expérimenté et savez ce que vous faites.
Il est important de noter que le code ne fonctionnera que si vous disposez d’une version de PHP 7 ou supérieure. Si vous ne connaissez pas la version de PHP que vous utilisez, mettez-la à jour et appliquez ensuite le code indiqué dans la première option (voir ci-dessus).
Si vous disposez de l’ancienne version 5.6, passez immédiatement à la deuxième option de cet article (Cochez ci-dessous) ou mettez à jour la version sur l’hébergement.
Option 2 ; ajout d’un code modifié pour la version PHP 5.6.
Utilisez le code ci-dessous:
if( ‘disable_gutenberg’ ){
add_filter( ‘use_block_editor_for_post_type’, ‘__return_false’, 100 ) ;
add_action( ‘admin_init’, function(){
remove_action( ‘admin_notices’, array(‘WP_Privacy_Policy_Content’, ‘notice’ )) ;
add_action( ‘edit_form_after_title’, array( ‘WP_Privacy_Policy_Content’, ‘notice’ ) 😉
}) ;
}
IMPORTANT À NOTER : Vérifiez toujours la version de WordPress que vous utilisez lorsque vous essayez de désactiver Gutenberg. Si vous avez WordPress 4.9, et que vous utilisez une ancienne version de PHP, la désactivation de Gutenberg pourrait ne pas réussir en raison de la couche de protection ajoutée à WordPress 4.9. Vous pourriez voir l’erreur suivante : « SYNTAX ERROR, UNEXPECTED ‘[‘] »
S’il n’y a pas d’erreurs et que le fichier est enregistré, alors tout va bien et Gutenberg est désactivé.
En général, l’erreur SYNTAX ERROR, UNEXPECTED « [ » survient à cause des crochets. En PHP 7, un tableau est défini uniquement par des crochets [] alors que, dans les anciennes versions, les tableaux sont définis par des parenthèses ().
RÉSOUDRE » SYNTAX ERROR, UNEXPECTED ‘[‘ »
Si vous voyez une erreur quelque part due aux crochets et qu’il n’est pas possible de connecter une version plus récente de PHP, alors :
// Replace it
[… Here is the contents of the array]
// Replace with this
array (… Here is the contents of the array)
// I hope it is clear that without words … Here the contents of the array
Mise à jour de l’éditeur Gutenberg WordPress:
Une introduction à Gutenberg 9.2
Gutenberg 9.2 propose un nouveau cadre, de nouveaux modèles d’interaction, une nouvelle expérience utilisateur et de nouvelles fonctionnalités pour WordPress. Il s’agit d’une nouvelle transformation du fonctionnement de WordPress. Elle semble meilleure que la version précédente.
Fonctionnalités de WordPress Gutenberg 9.2
1. Image Alt Texte Repli
Le texte alternatif dans les images tient une place essentielle dans le monde du référencement et peut parfois être pénible. Le nouveau WordPress comprend une fonction appelée alt text fallback qui reprend la légende de votre image comme texte alt. Vous avez donc moins de travail à faire. D’autre part, il est préférable de créer un texte alt unique à partir de la légende, car vous ne voudriez pas que le lecteur d’écran lise deux fois le même texte.
2. Une sécurité accrue
La solution de sécurité est une des principales caractéristiques bienvenues. L’attaque ReDos – Expression régulière de refus de service est particulièrement traitée dans cette version de Gutenberg 9.2.
3. Sous-titres dans les vidéos
Gutenberg 9.2 permet d’ajouter des sous-titres aux vidéos. C’est une fonctionnalité assez intéressante pour les visiteurs malentendants ou qui réduisent le volume sonore lorsqu’ils visitent votre site.
4. Informations sur les modèles
La dernière version de WordPress Gutenberg 9.2 comprend également une liste déroulante d’informations sur les modèles. Il indique le nom et la description du modèle actuellement utilisé. Il s’agit d’une fonction simple mais très utile.
5. Modifications de la mise en page
Le nouveau WordPress donne la possibilité de créer des mises en page par colonnes. Cette approche rend le processus de construction de pages plus robuste. C’est vrai, mais les développeurs ont besoin d’un certain temps pour s’habituer à cette fonctionnalité.
6. Écran des widgets
Il y a beaucoup d’améliorations en termes d’accessibilité sur l’écran du widget. Au lieu de s’appuyer sur les valeurs par défaut, il est désormais possible d’ajouter des étiquettes plus significatives dans ARIA avec plus de description dans le nouvel écran Widgets.
Gutenberg 9.2 a également obtenu des tonnes d’améliorations en termes de correction de bogues, d’amélioration des performances et de correction de la qualité du code, tout comme les sites d’édition modernes.
Nous pouvons désormais vous recommander d’utiliser Gutenberg dans certains cas. Vous avez besoin de plus d’informations sur la façon d’utiliser l’éditeur Gutenberg WordPress pour obtenir les meilleurs résultats ?