Ajouter la coloration syntaxique sur un Blog WordPress

Il existe diverses manières d’ajouter la coloration syntaxique sur un blog WordPress.


Si autrefois il fallait le faire manuellement, en bon fainéant, nous allons utiliser un des nombreux plugins qui le permettent.

Déterminer s’il vaut mieux utiliser la façon manuelle :

  1. Faites un test de rapidité de votre site.
    Vous pouvez utiliser le service Google Insight, mais il existe de nombreux autres sites équivalents.
  2. Observez les résultats obtenus.
    Si votre site souffre déjà de lenteurs, préférez la version manuelle.

Sinon, si vous n’avez pas de problèmes, l’installation d’un plugin sera plus rapide et plus simple.

Ajouter la coloration syntaxique manuellement

Pour ajouter cette fonction manuellement, vous trouverez les procédures pour différents outils sur ce site.
Choisissez toujours la procédure qui vous semble la plus rapide, claire, et simple.

Les plugins de coloration syntaxique sur WordPress

Il existe à présent de nombreux plugins permettant de remplir cette fonction.

Mais tous ne fonctionneront pas pour vous.
En fait ces plugins sont adaptés à un type d’éditeur particulier.
Pour installer le bon plugin vous devez connaitre l’éditeur que vous utilisez.

Là encore il en existe plusieurs : Classic, Gutemberg, Blocks, Elementor.
Les deux premiers sont obsolètes (nuls, pourris, périmés ! hum, pardon, je m’acharne… ^^)

Personnellement j’utilise Blocks pour un article basique et Elementor pour avoir des modèles de designs plus poussés.

Déterminer l’éditeur utilisé par WordPress et choisir le bon plugin

  1. Rendez vous dans la section Extensions de votre interface d’administration.
  2. Recherchez quel éditeur est activé.
  3. Cliquez sur Ajouter une extension et recherchez “color syntax”
  4. Lisez les descriptions et choisissez un plugin prévu pour votre éditeur.

Si comme moi, vous utilisez Blocks la plupart du temps, je vous recommande Enlighter qui est très pratique et propose différents thèmes sélectionnables pour chaque bloc de code.

Utilisation du plugin Enlighter

  1. Rendez vous dans l’éditeur, en créant un article de test.
  2. Créez un bloc de type préformaté.
  3. Sur la droite dans les options du bloc vous pouvez choisir le langage et le thème de votre bloc de code.



Voila ! Vous savez à présent intégrer dans vos articles des blocs de code facilement lisibles et repérables.


Si vous êtes débutant en programmation, je vous invite à télécharger votre guide pour apprendre simplement et rapidement.

Si vous avez déjà un certain niveau, consultez l’article sur les Design Patterns.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *