Une nouvelle expérience d’édition de code, plus puissante et plus agréable

WordPress.com vient de franchir une étape importante en rendant l’édition de code directement depuis l’interface d’administration plus agréable et plus performante. Que vous écriviez du code au quotidien ou que vous soyez simplement curieux d’y toucher de temps en temps, vous bénéficiez désormais de fonctionnalités modernes comme la coloration syntaxique, l’autocomplétion, ou encore la recherche et le remplacement dans l’éditeur de code.

Lancée la semaine dernière, cette mise à jour améliore deux zones clés de l’expérience WordPress.com :

• L’éditeur de code intégré à l’éditeur WordPress
• La zone de CSS personnalisé

Voici un aperçu de ce qui vous attend.

Un éditeur plus lisible pour le code

Vous avez déjà ouvert l’éditeur de code depuis l’éditeur de blocs ou de site et découvert un mur de texte sans aucune mise en forme?

On rêvait tous d’un éditeur un peu plus évolué : une interface qui facilite la lecture du code, accélère la saisie, signale les erreurs au passage… Bref, un outil digne de ce nom.

C’est désormais chose faite. Plus besoin d’installer une extension ou de bidouiller pour en profiter : tout le monde y a accès dès maintenant.

Et comme vous pouvez le voir ci-dessous, la différence est flagrante :

Du CSS bien plus lisible dans la zone de code personnalisé

L’édition de CSS personnalisé, elle aussi, a bénéficié d’un vrai coup de neuf.
Même si les améliorations dans les éditeurs sont les bienvenues, c’est souvent dans la zone « CSS supplémentaire » (accessible depuis le panneau Styles de l’éditeur de site) qu’on rédige vraiment du code.

Avant, cette zone ressemblait à un simple champ de texte sans mise en forme.

Maintenant, elle offre la même expérience agréable que les autres éditeurs de code :

Quelles nouveautés vous attendent ?

Voici ce que vous trouverez dans ce nouvel environnement d’édition :

• Coloration syntaxique : Le code est mis en couleur selon le langage utilisé, ce qui facilite grandement la lecture et la compréhension.
• Autocomplétion : Gagnez du temps, évitez les fautes de frappe, et écrivez plus efficacement grâce à la suggestion automatique.
• Mise en forme intelligente : Numérotation des lignes, indentation automatique, appariement des parenthèses et des accolades… tout est là pour une expérience fluide.
• Prise en charge des langages : HTML et CSS sont reconnus automatiquement et mis en valeur — fini les zones en « texte brut » !

Et ce n’est pas tout : la recherche et le remplacement font aussi leur apparition. Il suffit d’appuyer sur Command + F (Mac) ou Ctrl + F (Windows) pour afficher le panneau dédié en bas de l’éditeur.

Ce panneau vous permet de :

• Faire une recherche sensible à la casse (majuscules/minuscules)
• Utiliser des expressions régulières
• Rechercher des mots entiers uniquement

Vous pouvez ensuite choisir de remplacer chaque occurrence individuellement, ou toutes d’un coup.

Et ensuite ?

Avec ces nouveautés, WordPress.com se rapproche d’un véritable environnement de développement intégré, tout en restant simple et accessible. C’est une belle avancée pour les développeurs, les utilisateurs expérimentés… et tous ceux qui aiment mettre les mains dans le code à l’occasion.

Mais ce n’est qu’un début. Ce nouveau système d’édition de code va continuer d’évoluer.

Personnellement, j’aimerais beaucoup que ces améliorations s’étendent aussi aux blocs « Code » et « HTML ». Peut-être que je réussirai à convaincre l’équipe de les ajouter dans une prochaine mise à jour !

En tout cas, que vous soyez un bidouilleur occasionnel ou un codeur assidu, l’avenir s’annonce prometteur. Testez ces nouveaux éditeurs dès maintenant, et n’hésitez pas à nous faire part de vos impressions !