Salut, les Cuistots, c’est Alex et bienvenue dans ce nouvel article où l’on va découvrir les nouvelles fonctionnalités de WordPress 4.9.

En fait, il s’agit de la transcription de la vidéo ci-dessus mais cela devrait être aussi agréable à lire qu’à écouter. À vous de voir ce que vous préférez 🙂



Allez c’est parti !

Alors, au moment où la vidéo a été tournée, les premières versions de WordPress 4.9 sont sorties (les versions bêta). J’ai pu les tester grâce à un petit plugin qui s’appelle “WordPress Bêta Tester” que vous pouvez installer sur un site en local par exemple, donc c’est ce que j’ai fait et j’ai commencé à fouiller un petit peu et j’ai regardé ce qu’il y avant de nouveau par rapport aux précédentes versions.

Ce que je vous propose aujourd’hui, c’est de découvrir ce qui va vraiment changer pour cette nouvelle version.

On passe sur mon écran, et donc vous pouvez-voir là je suis sur le tableau de bord de mon administration, je suis bien en version 4.9 bêta 4.

WordPress 4.9 version beta

Au moment où sortira cette vidéo, ce sera peut être en version RC “Release Candidate” : des versions bêta correspondant presque à la future version stable – là je pense que l’on a vraiment une bonne vision de ce que va être WordPress 4.9, même s’il peut y avoir encore quelques petits rectificatifs, corrections de bugs, etc., mais le gros des fonctionnalités est là.

On peut lister 3 axes d’amélioration de WordPress 4.9

  1. Les premières modifications, ça concerne le customizer (tout ce qui est dans Apparence => Personnaliser) ;
  2. Ensuite on parlera des widgets ;
  3. Et ensuite on parlera de l’éditeur de code.

Améliorations au niveau du customizer

Là ce qu’il y a de nouveau, c’est que l’on va pouvoir enregistrer des paramétrages.

customizer de wp 4.9

Auparavant, jusqu’à WordPress 4.8, on était obligé de publier directement ce que l’on modifiait dans le customizer, c’était mis en ligne automatiquement sinon c’était perdu.

Maintenant, on va pouvoir effectuer des changements et enregistrer tout ça.

Là mon site WP DEMO, j’ai mis un slogan un petit peu aléatoire “WP Demo 4.9”, là je vais faire quelques petites modifications :

  • En-tête du média :là je n’ai pas d’image sous la main, dommage, je ne vais pas modifier quelque chose ici.
  • Réglages de la page d’accueil : ici je vais mettre une page statique, voilà, ça, c’est ma page d’exemple, ce n’est pas très grave.

Quand on regarde en haut on a “Publier”, comme d’habitude ça met en ligne les modifications, mais là, j’ai une petite roue dentée, je vais cliquer dessus, et là j’ai plusieurs choix qui se proposent à moi :

trois choix pour sauvegarder ses modifications
  • Soit je publie ;
  • Soit j’enregistre en brouillon ;
  • Soit je planifie.

C’est plutôt pas mal.

Donc là, après on met une date comme si on planifiait un article, sauf que là on planifie des changements graphiques sur le site.

Admettons que vous travaillez toute la journée sur une mise à jour de votre site et vous voulez planifier cela la nuit pour que ça se mette en ligne tout seul et comme ça le lendemain matin : boom ça arrive ! ça peut être quelque chose d’intéressant !

Et là, juste en dessous, on peut aussi avoir un lien de prévisualisation, donc comme cela on peut partager ses changements à quelqu’un extérieur au site pour qu’il nous donne son avis par exemple.

partager un lien avec les modifications

Il faut enregistrer le brouillon avant d’avoir le lien : je vais le faire, enregistrer vos modifications, enregistrer le brouillon juste là haut et maintenant j’ai un lien que je peux copier.

Si on passe en navigation privée, j’ai mon lien et là je peux accéder à tous les changements. Donc là je retrouve bien mon petit titre comme ça, alors que si je retire ça, j’ai bien mon titre de base.

Donc voilà pour les modifications.

Qu’est-ce que j’ai d’autre à dire sur le customizer ?

Si maintenant il y a une nouvelle façon de changer les thèmes, vous voyez avant il n’y avait pas ça ! Ce n’était pas comme ça !

changer les thèmes

Donc là on a les thèmes installés, ça c’est ce que j’ai installé, c’est pour une vidéo de tests de thèmes que j’ai installé tout ça et là j’ai les thèmes de WordPress.org, je clique ici et bien sûr j’ai tous les thèmes gratuits qui s’affichent et ensuite, tout simplement je peux les prévisualiser, les installer, etc.

L’autre chose aussi, je n’avais pas d’exemple à vous montrer, mais au final, il y en a un qui s’affiche tout seul, c’est l’insertion de notifications au niveau du customizer, donc là on en a une petite “Désolé, vous ne pouvez pas prévisualiser les nouveaux thèmes… lorsqu’on a des modifications programmées ou enregistrées…

avertissement dans le customizer

Je ne le savais pas, maintenant je le sais !

Donc là je pense qu’on est bon au niveau du customizer.

Les nouveaux widgets de WordPress 4.9

Après on va rester dans le customizer étant donné que l’on peut les modifier directement ici.

Donc là je vais aller dans la colonne latérale du blog et je vais faire “ajouter un widget” et là on retrouve notre liste de widgets et je vais donc pouvoir vous parler de cela ici.

nouveaux widgets dans le 4.9

Donc maintenant, on a un nouveau widget pour ajouter une galerie, je l’ajoute ici voilà.

Donc là, comme on peut le faire dans un article, on peut ajouter une galerie d’images maintenant dans une barre latérale ou dans un pied de page, ça peut être plutôt sympa.

Ensuite, on a des nouveautés au niveau du widget texte... attendez que je le trouve ! widget texte – je ne sais pas pourquoi je veux faire un glisser/déposer ?! –

mettre un média dans le widget texte

Comme vous pouvez le voir maintenant, on a un bouton pour ajouter un média, juste ici, et ça, c’est vraiment top justement, j’en parlais justement dans la… je ne sais plus si dans la vidéo de présentation de WordPress 4.8 où sur Facebook que j’en ai parlé, mais c’était vraiment dommage, on pouvait mettre un lien, mais on ne pouvait pas mettre d’images.

Il fallait toujours passer par le HTML pour mettre une image, maintenant c’est réglé.

On peut ajouter une image comme on peut le faire depuis n’importe quel article ou page donc ça, c’est plutôt cool.

Qu’est-ce que je peux vous dire d’autre ?

Aussi, les shortcodes sont interprétés dans le widget texte, avant il fallait passer par une petite ligne de code à insérer, soit dans notre thème, soit dans le wp-config.php si je ne me trompe pas, maintenant c’est interprété automatiquement.

Là je n’ai pas de shortcode sous la main pour vous montrer, mais vous pouvez désormais coller tous vos shortcodes, peut être que vous avez un shortcode de “contact form 7” ou de “gravity forms” pour insérer un formulaire de contact, maintenant vous pouvez le mettre directement dans le widget texte et ce sera interprété automatiquement.

Ah oui ! maintenant le widget texte supporte aussi tout ce qui est l’insertion de média : vous savez ce que l’on peut faire déjà sur un article quand on met un lien YouTube ou Dailymotion ou encore Vimeo, etc. maintenant ce sera aussi interprété.

Ce widget texte prend vraiment une plus grande importance parce que voilà, quand on se rappelle quelques versions de WordPress en arrière, on pouvait juste taper le texte et c’était tout, maintenant on a :

  • l’éditeur visuel ;
  • on peut rajouter des médias ;
  • les shortcodes sont interprétés ;
  • et les médias externes avec YouTube, etc. sont aussi affichés.

Alors, je rajoute un nouveau widget et maintenant on va parler du widget HTML personnalisé.

changement du widget html personnalisé

Comme vous pouvez le voir maintenant, il y a un petit éditeur de code et donc ça c’est vraiment beaucoup plus pratique, donc admettons que je veuille ajouter une balise H3, ça me ferme automatiquement la balise, j’ai vraiment une aide au niveau de la programmation au niveau de ce widget HTML personnalisé.

balises fermées automatiquement

Et dernière chose dont je veux vous parler pour les widgets, après promis c’est terminé !

Le widget vidéo qui maintenant peut intégrer… on peut coller des liens de vidéos via “insérer à partir d’une adresse web“.

avec le widget vidéo insérer des liens youtube viméo...

Avant on pouvait mettre un lien YouTube et un lien Vimeo et c’était interprété, mais d’autres plateformes de vidéos comme Dailymotion n’étaient pas interprétées. Maintenant c’est réglé et on peut vraiment mettre des liens à partir d’une grande variété de plateformes vidéos, c’est un peu plus logique pour un widget vidéo que ça puisse accueillir des vidéos de n’importe où.

Donc voilà, on est bon sur les widgets.

On va pouvoir passer à la troisième partie des améliorations de WordPress 4.9.

Avant ça, on va faire une petite escale pour voir…

Les améliorations des menus

menus différents entre wp 4.8 et 4.9

Si vous allez regarder votre WordPress 4.8, vous verrez que dans le customizer, les menus ne se présentent pas comme cela, on n’a pas les emplacements qui sont présentés en dessous, donc c’est légèrement modifié, mais c’est mis à jour, je trouve que c’est quand même plus sympa, donc là on a une séparation entre les emplacements et les menus.

Au niveau du process de création, il n’y a pas grand-chose qui change, c’est plus au niveau de l’affichage sur cet écran.

Autre chose dont je peux vous parler pour les menus, pour WordPress 4.9, c’est… alors je ne sais pas si vous avez déjà eu l’expérience, mais lorsque vous changez de thème, les menus se désactivent, ils ne sont pas automatiquement.

Par exemple mon menu principal n’est pas automatiquement transféré dans le nouvel emplacement du menu principal de mon nouveau thème, parce que tout simplement, le nom des emplacements dans le code n’a pas le même nom.

Les développeurs de WordPress se sont penchés là dessus et ils sont parvenus à faire en sorte que le menu principal soit conservé lorsqu’on change de thème.

Je n’ai pas testé, peut être que ça le fait aussi sur les autres menus, mais en tout cas le menu principal, ça le fait, ils arrivent vraiment à le repérer, ça c’est plutôt pas mal, il faut avouer que c’est “chiant” quand on change de thème de remettre son menu : ça, c’est une chose en plus qui a été faite.

Dernière chose !

Là on va quitter le customizer, je vais peut être enregistrer le brouillon ? Allez ce n’est pas grave je n’enregistre pas, de toute façon je suis sur un site de démonstration.

L’éditeur de code de WordPress 4.9

Donc maintenant, je vous ai parlé de l’éditeur de code : vous savez que généralement, il est recommandé de le désactiver parce qu’on peut casser son site et donc WordPress 4.9 apporte quelques petites modifications sur ça.

Je vais me rendre dans Apparence >Thèmes et du coup je ne l’ai pas désactivé.

Là on peut voir qu’on a un message d’avertissement “Faites attention !” donc le reste n’a pas été traduit, mais ne vous inquiéter pas, pour la sortie de WordPress 4.9, normalement le 14 novembre, c’est vrai que je ne l’ai pas précisé, tout sera traduit parce qu’on a une super équipe de traduction.

avertissement pour l'éditeur de code

D’ailleurs j’en profite à nouveau pour les remercier ! À chaque fois que je fais une vidéo sur une nouvelle version de WordPress, je remercie les gens qui traduisent WordPress : merci les gars, merci à tout le monde !

On a un petit message d’avertissement pour nous dire “OK, là vous allez modifier votre thème et ça peut causer des problèmes si vous faites n’importe quoi, donc faites gaffe

Donc il y a un bouton retour pour revenir dans l’administration, mais plus dans l’éditeur et si on clique sur “j’ai compris”,  OK, on reste là ! ça c’est dit !

Comme vous pouvez le voir, on se retrouve encore avec une coloration syntaxique qui a été ajoutée, on peut mieux voir, mieux modifier son thème WordPress.

éditeur de code en couleur

Bien sûr, on est d’accord, il vaut mieux passer par un thème enfant, là je n’en ai pas installé un parce que c’est pour la démonstration, mais il faut passer par un thème enfant pour modifier ça, il y a le générateur de thèmes enfant sur la Marmite, je peux vous donner l’adresse : wpmarmite.com/creer-theme-enfant.

Donc là vous mettez l’URL de votre site et boom vous avez un thème enfant qui est généré automatiquement.

Je reviens là-dessus, vous aurez donc la possibilité de modifier votre thème WordPress assez facilement à partir de l’administration.

modifications faciles du thème

Donc la coloration syntaxique comme on l’a vu tout à l’heure, on a aussi une auto complétion : donc là si je fais un font size par exemple (propriétés pour modifier la taille du texte), j’ai les propriétés CSS qui sont ajoutées automatiquement.

Là on a parlé du CSS, maintenant on va pouvoir aller voir un fichier PHP, donc je vais prendre archive.php et là on a la même chose, une coloration syntaxique : on voit bien notre HTML et notre PHP qui ressortent bien, on a des commentaires en orange donc c’est plutôt pas mal.

modifications dans le code

Autre chose que l’on a ici, on voit les dossiers présents sur notre thème WordPress : on peut aller dans les sous-dossiers et modifier ce qu’y nous intéresse, donc là par exemple du JS, je clique dessus et là même chose on a encore une coloration syntaxique.

Par exemple dans le functions.php, je reviens au niveau d’un fichier PHP, là ce que je n’ai pas dit tout à l’heure, on a un lien vers la documentation de chaque fonction, c’est plutôt pas mal.

lien vers la documentation wordpress

Donc si je veux en savoir plus sur la fonction is_single, je la sélectionne je clique là-dessus et ça ouvre un nouvel onglet avec la documentation de la fonction associée avec des exemples, etc. C’est plutôt pas mal quand on développe.

Après, on est tous d’accord, en tout cas la plupart des développeurs seront d’accord avec moi sur le fait qu‘il vaut mieux passer par un éditeur de code pour modifier son thème, tout simplement parce que ça permet de mieux gérer, d’avoir un meilleur aperçu et de ne pas tout bidouiller dans l’administration et surtout, si vous avez un développement qui est versionné, là ce sera plus simple à gérer que de modifier ça directement ici.

Après on est d’accord, si on a deux trois modifications à faire en CSS, ça peut être plutôt pratique, mais après on a déjà vu  que ça peut être aussi un risque au niveau de la sécurité si on laisse cet éditeur de code disponible.

WordPress 4.9 devrait sortir le 14 novembre

Voilà, je vous ai tout dit pour les nouvelles modifications de WordPress 4.9, alors bien sûr, il y a d’autres qui ont été ajoutées, mais qui sont plus sous le capot, qui concernent plus les développeurs de plugins et de thèmes.

Je ne vais pas forcément revenir dessus parce que même moi je ne comprends pas forcément tout, mais voilà, il y aura un encart pour inviter les gens à utiliser le nouvel éditeur visuel qui s’appelle Gutenberg (en fait non, il a été supprimé dans la beta 4 mais je n’avais pas connaissance de cette information lors du tournage de la vidéo).

Il faudra que je fasse une vidéo là-dessus d’ailleurs pour vous le présenter : ça change un petit peu l’expérience d’écriture par rapport à ce que l’on a sur les articles et ça, ça viendra pour WordPress 5.0, j’aurais l’occasion de vous en reparler pour vous présenter tout ça.

Voilà !

Merci beaucoup d’avoir suivi cette vidéo, bien sûr abonnez-vous à la chaîne YouTube de la Marmite pour recevoir les nouvelles vidéos, les podcasts, les #DisVoirAlex, les “Point Sécu”… toutes les vidéos que je peux produire et surtout, si vous voulez être tenus au courant de leur sortie, dès que je les mets en ligne, cliquez sur la petite cloche c’est super important, comme ça vous serez notifié 😉

Que dire d’autre à part vous remercier d’avoir parcouru cette transcription (j’espère que vous avez apprécié l’expérience) et sur ce je vous dis à très bientôt pour une nouvelle vidéo, ciao !