Lors de la rédaction de billets sous Wordpress, il peut s’avérer utile voire indispensable d’afficher du code d’un langage particulier et de proposer les outils nécessaires pour aider le lecteur à diffuser et utiliser ce code. Voici une sélection de 5 plugins pour Wordpress répondant à ces besoins.
Liste des 5 plugins
Syntax Highlighter and Code Prettifier
Un excellent plugin pour afficher toute sorte de code dans vos billets. Les 3 petites icônes sur la droite permettent dans l’ordre: d’ouvrir le code isolé dans une fenêtre pop-up, d’imprimer le code en 1 clic, d’avoir des informations sur le plug-in. Je regrette tout de même l’impossibilité de copier le code en 1 seul clic.
Exemple d’utilisation:
body {
font-family: Verdana, Arial, Sans-Serif;
font-size: 0.8em;
color: #333;
text-align: center;
padding-bottom: 20px;
}
#page {
background-color: #FFF;
margin: 0 auto;
padding: 0;
width: 1000px;
text-align: left;
}
Résultat:
Syntax Highlighter and Code Prettifier
Ce plugin supporte tous les langages ci-dessous, les autres plugins de cette liste suppportent eux aussi, à quelques différences près, les mêmes langages:
- Bash/shell
- C#
- C++
- CSS
- Delphi
- Diff
- Groovy
- JavaScript
- Java
- Perl
- PHP
- Plain Text
- Python
- Ruby
- Scala
- SQL
- Visual Basic
- XML
Ce plugin est très similaire au plugin précédent mais il propose en plus une fonction pour copier le code dans le presse-papier en 1 seul clic.
Exemple d’utilisation:
body {
font-family: Verdana, Arial, Sans-Serif;
font-size: 0.8em;
color: #333;
text-align: center;
padding-bottom: 20px;
}
#page {
background-color: #FFF;
margin: 0 auto;
padding: 0;
width: 1000px;
text-align: left;
}
Résultat:
Google Syntax Lighlighter
WP-CodeBox offre 2 fonctions différentes des 2 précédents plugins. Il donne la possibilité de télécharger le code source en question dans un fichier et aussi de développer ou réduire la zone d’affichage du code.
Exemple d’utilisation:
body {
font-family: Verdana, Arial, Sans-Serif;
font-size: 0.8em;
color: #333;
text-align: center;
padding-bottom: 20px;
}
#page {
background-color: #FFF;
margin: 0 auto;
padding: 0;
width: 1000px;
text-align: left;
}
Résultat:
WP-CodeBox
Les 2 derniers plugins ne permettent que la coloration syntaxique, la numérotation des lignes et l’indentation du code.
Exemple d’utilisation:
body {
font-family: Verdana, Arial, Sans-Serif;
font-size: 0.8em;
color: #333;
text-align: center;
padding-bottom: 20px;
}
#page {
background-color: #FFF;
margin: 0 auto;
padding: 0;
width: 1000px;
text-align: left;
}
Résultat:
Dean’s Code Highlighter
Exemple d’utilisation:
body {
font-family: Verdana, Arial, Sans-Serif;
font-size: 0.8em;
color: #333;
text-align: center;
padding-bottom: 20px;
}
#page {
background-color: #FFF;
margin: 0 auto;
padding: 0;
width: 1000px;
text-align: left;
}
Résultat:
WP-Syntax
Conclusion
Il existe des dizaines de plugins permettant l’affichage de code dans un article de Wordpress, n’hésitez pas à en tester plusieurs afin de vous donner une idée des fonctions disponibles et des différents types d’affichage proposés. Si vous avez des questions ou suggestions, n’hésitez pas à les poster dans les commentaires ci-dessous.
No related posts.
La liste des entrées complémentaires est établie par le module d’extension YARPP.
Tags : Code Prettifier, Dean's Code Highlighter, Google Syntax Highlighter, plugin, Syntax Highlighter, Wordpress, WP-CodeBox, WP-Syntax
Hodler : Il s’agit des supports des 3 premiers cours. Si...