La version 5.4 de WordPress a été publiée le 31 mars 2020. Qu'apporte cette version aux utilisateurs et aux développeurs ? Notre aperçu : ce qui est nouveau dans WordPress et Gutenberg.

WordPress continue de nettoyer son éditeur Gutenberg et lui donne de nouvelles fonctions. Avant de passer aux prochaines étapes de développement, c'est-à-dire à la collaboration et au multilinguisme. Certaines nouvelles fonctionnalités peuvent être source de confusion pour les utilisateurs, vous devez donc vous y préparer. Nous résumons pour vous tous les changements importants.

Widget : État du site web

La nouveauté de WordPress 5.4 qui se remarque au premier coup d'œil : dans le Tableau de bord, il y a maintenant un nouveau widget sur "l'état du site web". La fonction qui se cache derrière existe déjà depuis WordPress 5.2. Tu la trouveras dans le backend sous "outils". Avec ce nouvel emplacement central, de nombreux utilisateurs devraient le remarquer pour la première fois :

L'idée derrière cette fonctionnalité : les administrateurs mais aussi les utilisateurs de WordPress doivent être informés des éventuelles vulnérabilités de l'installation. De même, un coup d'œil aux détails liés dans le widget offre des suggestions d'amélioration ou des conseils sur d'éventuelles vulnérabilités de sécurité. Il s'agit par exemple de

• Une liste des sites inactifs Plugins et Themes. Vous devez toujours les supprimer, car ils peuvent être la cible de pirates informatiques, même lorsqu'ils sont handicapés.
• Suggestions de modules PHP qui devraient être installés sur votre serveur. Dans le cas contraire, WordPress peut fonctionner lentement ou certaines fonctions peuvent manquer. Voir cette liste dans le WordPress Hostingl'équipe.
• Un avertissement si votre site web n'utilise pas encore de connexion HTTPS.

Le cryptage via SSL est un must absolu pour tout site web professionnel. Par exemple via Let's Encrypt. Google exige également une connexion sécurisée, sinon votre site web perdra des rangs et des visiteurs importants. Dans l'idéal, les certificats SSL sont inclus dans votre pack d'hébergement - cela réduit votre effort.

Jusqu'à présent, les fonctionnalités de la section État du site ou Améliorations sont encore gérables. Cela changera certainement dans les versions futures. Cependant, l'onglet "Rapport" contient des informations passionnantes :

Vous obtiendrez ainsi de nombreux détails sur votre configuration de WordPress et WooCommerce. Vous pouvez les exporter, par exemple comme outil pour vos fournisseurs de services WordPress . Ou à des fins de débogage pour les développeurs de Plugins et Themes.

Gutenberg En mode plein écran

Tu ne savais pas que Gutenberg dispose d'un mode plein écran ? Tu seras alors irrité lorsque tu ouvriras pour la première fois l'éditeur dans la version 5.4. La barre du tableau de bord sur le côté gauche est manquante. Cela présente des avantages mais aussi des inconvénients :

• Surtout sur les petits écrans, vous disposez maintenant de plus d'espace pour votre contenu.
• Vous ne serez pas distrait par les commentaires reçus, Plugins à mettre à jour, etc. pendant que vous écrivez
• En même temps, la barre latérale est manquante pour les processus individuels

Le dernier point ralentit surtout lorsque vous devez passer de la vue d'ensemble du poste à l'éditeur lors de la mise à jour de vos textes. Ou lorsque vous voulez appeler brièvement la médiathèque.

Le mode plein écran est contre-productif pour votre travail ? Vous pouvez ensuite rétablir l'ancienne vue familière comme suit :

1. Accédez aux options avancées de Gutenberg (les trois points verticaux à côté de l'icône de l'engrenage en haut à droite)
2. Jusqu'à présent, ils s'appellent "More tools & options" dans l'éditeur.
3. Décoche la case "Fullscreen Mode".

Le comportement - mode plein écran activé ou désactivé - peut également être prédéfini avec quelques lignes de JavaScript :

const isFullscreenMode = wp.data.select( 'core/edit-post' ).isFeatureActive( 'fullscreenMode' );

if ( isFullscreenMode ) {
    wp.data.dispatch( 'core/edit-post' ).toggleFeature( 'fullscreenMode' );
}

C'est particulièrement pratique si, en tant qu'administrateur ou développeur, vous êtes submergé par les demandes de vos utilisateurs dès que la version WordPress 5.4 est mise en ligne sur votre site web.

Gutenberg Bloquer les icônes sociales

Avec cette fonction, tu peux insérer des références ou des icônes vers tes présences sur les réseaux sociaux en un clic de souris. Les options de base de "Social Icon" :

• Vous pouvez déterminer vous-même le type, le nombre et l'ordre des icônes, ainsi que les liens respectifs, bien entendu.
• Il existe près de 40 icônes ou réseaux disponibles
• Outre WordPress , Twitter, Facebook, YouTube ou Instagram, il s'agit par exemple de Dropbox, Etsy, RSS, Flickr, GitHub, LinkedIn, Pinterest, Skype, Vimeo ou Spotify.
• Des liens vers d'autres sites web (par exemple, des auteurs invités) ou vers des adresses électroniques peuvent également être insérés.

Un peu déroutant : si tu veux supprimer une icône existante, tu peux le faire en cliquant sur l'icône, puis en utilisant l'option "Supprimer le bloc". Ensuite, ce n'est pas le bloc complet qui est supprimé, mais seulement l'entrée correspondante :

Par défaut, le bloc que tu as créé n'est pas un élément réutilisable. Cela signifie que si tu apportes des modifications, par exemple en ajoutant ou en supprimant des icônes sociales, tu devras le faire à nouveau lors d'une intégration ultérieure de "Social Icon" dans un autre bloc ou une autre publication. La solution : tu convertis ton résultat en un bloc réutilisable et tu n'utilises plus que celui-ci.

Conseil : de nombreux utilisateurs ne connaissent pas encore la fonction "blocs réutilisables". Elle est très pratique : lorsque Google+ a disparu, il te suffisait d'adapter la modification dans l'élément réutilisable. Dans les blocs correspondants des différentes contributions, la modification se fait alors automatiquement.

Gutenberg Boutons de blocage

Le nom en dit long : tu peux utiliser ce nouveau bloc WordPress pour intégrer des boutons textuels dans tes messages. Par exemple, pour télécharger des livres électroniques ou pour rediriger vers les pages de renvoi centrales. Les boutons peuvent être personnalisés comme suit :

• Différents styles (complètement colorés ou avec un contour seulement)
• Couleur de fond et de texte librement sélectionnable, également avec des couleurs individuelles (via des valeurs de couleur hexadécimales)
• Fond monochrome ou avec dégradé (salutations de l'époque sauvage du web design)
• Réglages des bords (rayon des coins)
• Options de liens comme target _blank

Les utilisateurs attentifs de Gutenberg savent qu'il existe déjà un bloc appelé "Bouton". Cependant, la nouvelle option "Buttons" offre beaucoup plus d'options :

En outre, vous pouvez désormais insérer plusieurs boutons les uns après les autres, sans que cela ne nuise à votre mise en page. Vous pouvez ajuster l'ordre des boutons comme vous le souhaitez par glisser-déposer.

Note : A l'origine, WordPress 5.4 était censé obtenir un nouveau bloc Navigation pour insérer un menu de navigation également dans le contenu d'une page ou d'un article. Toutefois, cet ajustement a été reporté à une date ultérieure.

Écran : Bienvenue à l'éditeur de bloc

Comme sur WooCommerce , les utilisateurs de Gutenberg sont désormais accueillis avec un "guide de bienvenue". Celui-ci contient :

• Une introduction au fonctionnement de l'approche par blocs
• Explication de base des options par bloc (par exemple, couleur, largeur, alignement)
• Notes sur la bibliothèque du bloc

Un lien à la fin mène à un manuel pour Gutenberg. Mais c'est en anglais.

Nous vous recommandons les sources suivantes si vous n'avez pas encore travaillé avec le nouveau rédacteur en chef de WordPress :

• La vue d'ensemble pour les nouveaux arrivants sur de.wordpress.org
• Le guide rapide du webtimiser
• Six bonnes raisons de cesser de haïr Gutenberg
• Lisez notre article Gutenberg vs. WordPress Page Builder

Pour les administrateurs, le guide n'est pas nouveau, mais pour les utilisateurs et les éditeurs, il pourrait être intéressant. Elle devrait les aider à s'orienter plus rapidement sur Gutenberg . Cela peut également réduire votre effort de soutien en tant qu'administrateur.

Conseil : le guide de bienvenue ne démarre automatiquement que lorsque vous réinstallez WordPress ou utilisez Gutenberg pour la première fois. Vous voulez le démarrer manuellement ? Vous pouvez le faire dans les options générales sous Outils -> Guide d'accueil ( sous le point où vous pouvez passer du code à l'éditeur visuel).

Insérer l'image du message par glisser-déposer

Parfois, ce sont les petits changements qui font le bonheur des utilisateurs de WordPress . Avec la version 5.4, vous pouvez télécharger l'image du message par glisser-déposer. Exemple :

1. Vous avez déjà édité ou reçu l'image, et elle se trouve dans un dossier sur votre ordinateur.
2. De là, fais-la glisser avec la souris vers la zone "Définir l'image de la publication" dans la barre latérale droite de Gutenberg à partir de la version WordPress 5.4
3. Terminé - le téléchargement vers la médiathèque se fait automatiquement en arrière-plan

Seules les métadonnées de l'image doivent être ajoutées ultérieurement si nécessaire, en cliquant sur l'image insérée. Ou dans la médiathèque de WordPress. C'est probablement le plus grand "danger" de cette nouvelle option pratique : elle se fait au détriment d'attributs qui peuvent être importants pour ton référencement.

Bloc optimisé Messages récents

L'affichage d'autres articles sous tes articles de blog est très apprécié par de nombreux lecteurs. Il en va de même pour les derniers articles (actuellement appelés "Latest Posts" dans Gutenberg ). Ainsi, tes utilisateurs restent plus longtemps sur ton site. Les valeurs "durée de la visite" et "pages vues par visite" augmentent - les deux sont des indicateurs importants pour l'optimisation des moteurs de recherche (SEO).

Le taux de clic de cette fonction augmente considérablement si vous utilisez non seulement des liens textuels, mais aussi si les images des billets respectifs sont affichées. C'est exactement ce qui est possible à partir de WordPress 5.4 :

Autres nouveautés dans le bloc "Dernières contributions" :

• Définir la taille de l'image de prévisualisation
• Vous pouvez définir des valeurs fixes en pixels, ou utiliser différentes valeurs en pourcentage.
• L'alignement de l'image peut également être ajusté (aligné à gauche, centré, aligné à droite).

Est-ce que l'aperçu doit montrer l'article complet ou seulement un extrait du texte ? Certains blogs rapportent que cette option a également été ajoutée. Mais elle existe déjà dans WordPress 5.3, sous "Paramètres du contenu des articles" .

Couleur du texte pour les mots et phrases individuels

Jusqu'à présent, la couleur du texte dans Gutenberg ne pouvait être modifiée que pour un paragraphe ou une section complète. Avec WordPress 5.4, il est désormais possible de changer la couleur des lettres, des mots ou des phrases :

Pour ce faire, sélectionne la partie correspondante dans le texte courant avec la souris. Dans les options avancées (à côté de l'icône de lien), tu trouveras l'entrée "Couleur du texte". Tu peux choisir parmi les couleurs prédéfinies ou définir une couleur individuelle. Pour cela, tu as le choix entre un tableau de couleurs RGB et des valeurs de couleurs hexadécimales.

Autres changements

WordPress 5.4 apporte sous le capot de nombreux petits ajustements, pour le système lui-même ou aussi pour l'éditeur Gutenberg. Voici un aperçu des points les plus importants :

• Pour les blocs individuels, il existe désormais des options de couleur et de dégradé étendues, par exemple pour le bloc de couverture (image ou vidéo avec texte en superposition) mais aussi pour les groupes et les colonnes.
• La navigation dans les miettes de pain des blocs imbriqués a été rendue plus claire
• Dans la vue du smartphone, la barre d'outils reste en haut, donc elle ne disparaît plus du focus
• Dans le bloc "Galerie", tu peux influencer la taille de l'image (quatre niveaux : image d'aperçu, moyenne, grande, taille complète).
• Il y a maintenant une légende pour les tableaux, et pour les images, l'attribut de titre peut être attribué directement dans l'éditeur (sous les options avancées).
• Les vidéos du portail TikTok sont disponibles dans l'éditeur de bloc en tant que nouvelle source intégrée

En outre, la convivialité de Gutenberg a été optimisée à certains endroits, par exemple en simplifiant la sélection multiple des blocs ou la navigation avec la touche de tabulation. Ce dernier travaille désormais également dans les barres latérales des blocs.

Conseil : si vous cherchez des informations sur la future feuille de route de WordPress , visitez le blog du projet germanophone WordPress . Ou visitez le site https://de. wordpress.org /about/roadmap/.

Changements pour les développeurs

Pour ceux qui travaillent en coulisses sur WordPress , il existe également de nouvelles possibilités. Mais aussi plus de performance :

• Vitesse accrue : l'équipe de développement autour de l'éditeur de bloc a réussi à réduire le temps de chargement de 14 %, selon ses propres informations.
• Widget calendrier : les liens de navigation sont déplacés vers un élément HTML nav qui suit immédiatement l'élément table, pour un HTML valide (selon la spécification 5.1).
• Une sémantique cohérente : La fonction do_shortcode() est remplacée par apply_shortcode() remplace
• Favicons : Les demandes de Favicon peuvent être gérées de manière plus flexible, le logo WordPress sert de solution de repli
• Journal d'erreurs : Erreur dans wp_login_failed sont présentés plus en détail

Vous pouvez en savoir plus à ce sujet - ainsi que sur d'autres ajustements - dans les annonces officielles de WordPress 5.4. Des conseils pour les tests WordPress 5.4 peuvent être trouvés ici.

Quelles sont vos questions sur WordPress 5.4 ? N'hésitez pas à utiliser la fonction de commentaire. Vous souhaitez être informé des nouvelles contributions à WordPress ? Alors suivez-nous sur Twitter, Facebook ou via notre newsletter.