06/04/2013 Des CSS dans la coloration syntaxique de PHP

PHP propose une fonction native pour la coloration syntaxique du code : highlight_string

Très simple d'utilisation, elle présente néanmoins l'inconvénient de retourner une chaîne en HTML où la syntaxe est colorée grâce à des attributs "style", bref les couleurs sont "en dur".


highlight_string('<?php echo "hello world !"; /* hello */ ?>');

renverra


<span>
 <span><?php </span>
 <span>echo </span>
 <span>"hello world !"</span>
 <span>; </span>
 <span>/* hello */ </span>
 <span>?></span>
</span>

Tout bon intégrateur qui se respecte préférera utiliser des classes à la place, par exemple pour passer les commentaires en italique ou pour agir sur l'apparence du code grâce à du jQuery... Il préférera ça :


<span class="highlight_string_html"><span class="highlight_string_default"><?php </span><span class="highlight_string_keyword">echo </span><span class="highlight_string_string">"hello world !"</span><span class="highlight_string_keyword">; </span><span class="highlight_string_comment">/* hello */ </span><span class="highlight_string_default">?></span></span>

Voilà comment faire.

Du côté de PHP

On va faire en sorte que la fonction highlight_string ne renvoie plus des couleurs mais les types de coloration (commentaire, mot clé, chaîne etc.). On les remplacera ensuite par les noms des classes.


/* 1. modifier la configuration de la fonction : récupérer le type de coloration à la place de la couleur */
$arr=array(
	"string",
	"comment",
	"keyword",
	"default",
	"html");
foreach ($arr as $element) {
	ini_set(
		"highlight.".$element,
		"{This will be the ".$element." class !}"
		);
	}
// Pour un commentaire, la fonction ne renverra plus <span> mais <span>

/* 2. récupérer le code coloré */
$code=highlight_string(
	'<?php echo "hello world !"; /* hello */ ?>'
	,true
	);

/* 3. remplacer les attributs style par des classes */
$code=preg_replace(
	'/style="color: {This will be the ([a-z]+) class !}',
	'class="highlight_string_${1}"',
	$code);

echo $code;

Du côté des CSS

Il n'y a plus qu'à définir les classes correspondantes :


.highlight_string_string  { color : #DD0000}
.highlight_string_comment { color : #FF8000; font-style:italic}
.highlight_string_keyword { color : #007700}
.highlight_string_default { color : #0000BB}
.highlight_string_html    { color : #000000}

et le tour est joué.

Commentaires

Ajouter un commentaire :

Votre commentaire a bien été posté et sera publié après validation par le webmaster du site.