{"id":107,"date":"2009-03-06T14:17:48","date_gmt":"2009-03-06T13:17:48","guid":{"rendered":"http:\/\/flaven.fr\/?p=107"},"modified":"2013-09-25T10:02:27","modified_gmt":"2013-09-25T08:02:27","slug":"choisir-un-plugin-wordpress-pour-poster-du-code-en-couleur","status":"publish","type":"post","link":"https:\/\/flaven.fr\/2009\/03\/choisir-un-plugin-wordpress-pour-poster-du-code-en-couleur\/","title":{"rendered":"Choisir un plugin WordPress pour poster du code en couleur"},"content":{"rendered":"


\nPour ceux d\u2019entre vous qui utilisent WordPress, qui pondent un \u00ab peu de code \u00bb \u00e0 leurs heures perdues… Dieu sait si vous \u00eates nombreux ! Un jour ou l\u2019autre, vous vous \u00eates demand\u00e9 comment ins\u00e9rer un morceau de code tout beau, tout chaud au sein d\u2019un post WordPress enfin montrer \u00e0 la face du monde votre expertise par exemple dans le langage assembleur …<\/p>\n

\tComme toujours dans le monde merveilleux du groupe \u00ab WordPress and the plugins \u00bb, il existe des b\u00e9quilles qui vous facilitent le travail en colorant \u00e0 la main chacune de vos balises. <\/p>\n

Des crit\u00e8res pour s\u00e9lectionner un plugin<\/h2>\n

J’ai jet\u00e9 mon d\u00e9volu sur ces 3 plugins mais \u00e0 l\u2019installation, je n\u2019en ai retenu qu\u2019un seul. Ces trois plugins r\u00e9pondent \u00e0 quelques crit\u00e8res objectifs que l\u2019on peut attendre en terme de \u00ab color coding \u00bb*<\/em> , \u00ab highlight coding \u00bb*<\/em>, \u00ab syntax highlighting \u00bb*<\/em>.<\/p>\n

    \n
  1. La possibilit\u00e9 d\u2019ajouter ou de retirer les num\u00e9ros de ligne.<\/li>\n
  2. La possibilit\u00e9 offerte pour les utilisateurs de faire un copier-coller facile sans se trimballer les num\u00e9ros de lignes. Internet est le r\u00e8gne du bout-de-code-copier-coller-\u00e0-droite-\u00e0-gauche.<\/li>\n
  3. La possibilit\u00e9 de poster des codes source dans un grand nombre de langage : actionscript, php, ruby…etc<\/li>\n<\/ol>\n

    * C\u2019est ainsi que l\u2019on nomme cette fonctionnalit\u00e9 recherch\u00e9e en cherchant dans google via ces deux termes, vous trouvez pl\u00e9thore de r\u00e9f\u00e9rences si la proposition de ce triptyque ne vous plait d\u00e9cid\u00e9ment pas. <\/em><\/p>\n

    Le go\u00fbt et les couleurs<\/h2>\n

    Le triptyque de plugins \u00e0 d\u00e9couvrir<\/p>\n

    Choix N\u00b01 – WP-syntax <\/h4>\n

    Ce plugin qui fonctionne \u00e0 merveille est celui de Ryan Mcgeary qui s\u2019appui sur GeSHi (Generic Syntax Highlighter) initialement con\u00e7u pour le syst\u00e8me de forums phpBB qui inclut nativement un tr\u00e8s grand nombre de langages. Notre choix pour ce blog m\u00eame.
    \nhttp:\/\/wordpress.org\/extend\/plugins\/wp-syntax\/<\/a>
    \n    http:\/\/ryan.mcgeary.org\/<\/a>
    \n    http:\/\/qbnz.com\/highlighter\/<\/a><\/p>\n

    Choix N\u00b02 \u2013 CodeColorer<\/h4>\n

    Ce plugin d\u2019un d\u00e9velopper ukrainien du nom de Dmytro Shteflyuk offre notamment en plus du num\u00e9ro de lignes le noir comme couleur par d\u00e9faut pour le code tr\u00e8s \u00ab ruby like \u00bb.
    \n    http:\/\/kpumuk.info\/projects\/wordpress-plugins\/codecolorer\/ <\/a><\/p>\n

    Choix N\u00b03 – Dojox WordPress Syntax Highlighter<\/h4>\n

    Ce plugin concut par les allemands de OS Expert.net r\u00e9pond lui aussi aux trois crit\u00e8res \u00e9nonc\u00e9s ci-dessus. ?
    \n    http:\/\/osexpert.net\/wordpress-syntax-highlighter<\/a><\/p>\n

    Envoyez les couleurs !<\/h2>\n

    Un exemple de PHP sous WP-syntax<\/h4>\n

    On renseigne le param\u00e8tre lang=”php”<\/strong> pour notifier qu’il s’agit de php.<\/p>\n

      \t\/\/ $Id: install.php,v 1.34.2.5 2008\/07\/09 21:48:41 drumm Exp $\r\n\r\n\trequire_once '.\/includes\/install.inc';\r\n\r\n\t\/**\r\n\t * The Drupal installation happens in a series of steps. We begin by verifying\r\n\t * that the current environment meets our minimum requirements. We then go\r\n\t * on to verify that settings.php is properly configured. From there we\r\n\t * connect to the configured database and verify that it meets our minimum\r\n\t * requirements. Finally we can allow the user to select an installation\r\n\t * profile and complete the installation process.\r\n\t *\r\n\t * @param $phase\r\n\t *   The installation phase we should proceed to.\r\n\t *\/\r\n\tfunction install_main() {\r\n\t  require_once '.\/includes\/bootstrap.inc';\r\n\t  drupal_bootstrap(DRUPAL_BOOTSTRAP_CONFIGURATION);\r\n\t  \/\/ This must go after drupal_bootstrap(), which unsets globals!\r\n\t  global $profile, $install_locale;\r\n\t  require_once '.\/modules\/system\/system.install';\r\n\t  require_once '.\/includes\/file.inc';\r\n\r\n\t  \/\/ Ensure correct page headers are sent (e.g. caching)\r\n\t  drupal_page_header();\r\n\r\n\t  \/\/ Check existing settings.php.\r\n\t  $verify = install_verify_settings();\r\n\r\n\t  \/\/ Drupal may already be installed.\r\n\t  if ($verify) {\r\n\t    \/\/ Establish a connection to the database.\r\n\t    require_once '.\/includes\/database.inc';\r\n\t    db_set_active();\r\n\t    \/\/ Check if Drupal is installed.\r\n\t    if (install_verify_drupal()) {\r\n\t      install_already_done_error();\r\n\t    }\r\n\t  }\r\n\r\n\t  \/\/ Load module basics (needed for hook invokes).\r\n\t  include_once '.\/includes\/module.inc';\r\n\t  $module_list['system']['filename'] = 'modules\/system\/system.module';\r\n\t  $module_list['filter']['filename'] = 'modules\/filter\/filter.module';\r\n\t  module_list(TRUE, FALSE, FALSE, $module_list);\r\n\t  drupal_load('module', 'system');\r\n\t  drupal_load('module', 'filter');\r\n\t<\/pre>\n
    Un exemple de CSS sous WP-syntax<\/h4>\n
    On renseigne le param\u00e8tre line=”1″<\/strong> pour faire appara\u00eetre les num\u00e9ros de ligne.<\/p>\n
      \r\n\t\r\n\t\/** general styles START **\/\r\n\thtml {\r\n\tmin-height: 100%;\r\n\tmargin-bottom: 1px;\r\n\t}\r\n\r\n\tbody {\r\n\tbackground-color: #E4F2FD;\r\n\tfont-family: \"Lucida Grande\", Trebuchet, Arial, sans-serif;\r\n\tfont-size: 12px;\r\n\tfont-weight: normal;\r\n\ttext-align: left;\r\n\tmargin: 0 auto 0 auto;\r\n\tpadding: 0;\r\n\tcolor: #000000;\r\n\tz-index: auto;\r\n\t}\r\n\r\n\tform {\r\n\tmargin: 0;\r\n\tpadding: 0;\r\n\t}\r\n\t\/** general styles STOP **\/\r\n\r\n\t\/* police text (begin) *\/\r\n\tp.hecube_website_text{\r\n\tfont-size: 12px;\r\n\ttext-align: justify;\r\n\tline-height: 20px;\r\n\tcolor: #464646;\r\n\ttext-decoration: none;\r\n\tmargin: 0px auto;\r\n\tpadding-top: 5px;\r\n\tpadding-bottom: 5px;\r\n\tpadding-left: 5px;\r\n\tz-index: auto;\r\n\t}\r\n\t\r\n\t<\/pre>\n
    Un exemple de XML sous WP-syntax<\/h4>\n
    \tOn renseigne le param\u00e8tre escaped=”true”<\/strong> lorsque le code contient les balises < et > transcrites en html.<\/p>\n
    \r\n\t\t<sitelist>\r\n\t\t<asset aspectRatio="normal" isSite="true" >\r\n\r\n\t\t<url><![CDATA[http:\/\/hecube.net]]><\/url>\r\n\t\t<headline><![CDATA[Le site de hecube.net]]><\/headline>\r\n\t\t<description><![CDATA[Hecube.net est une\r\n\t\tagence web sp\u00e9cialis\u00e9e dans\r\n\t\tla conception et la cr\u00e9ation de site internet, la promotion et\r\n\t\tl'animation de site web ainsi que l'h\u00e9bergement\r\n\t\tserveur d\u00e9di\u00e9 administr\u00e9.\r\n\t\tHecube accompagne les entreprises sur Internet en leur apportant le meilleur\r\n\t\tdes technologies web cr\u00e9atrices de\r\n\t\tnotori\u00e9t\u00e9]]><\/description>\r\n\t\t<\/asset>\r\n\t\t<\/sitelist>\r\n\t<\/pre>\n
    Pour aller plus loin<\/h2>\n