Ajouter du code coloré

Pour afficher du code telquel :

function get_total_topics($forum_id) {  
global $NPDS_Prefix;  
$sql = "SELECT count(*) AS total FROM ".$NPDS_Prefix."forumtopics WHERE forum_id='$forum_id'";   
if (!$result = sql_query($sql))      
return("ERROR");   
if (!$myrow = sql_fetch_assoc($result))     
return("ERROR");  
sql_free_result($result);  
return($myrow[total]);
}

Il nous faut installer une librairie jquery nommée SyntaxHighlighter.

installation

Téléchager SyntaxHighlighter à cette adresse : http://alexgorbatchev.com/wiki/SyntaxHighlighter:Download

Ensuite décompresser l'archive et dans votre répértoire include (/modules/include/) créer un dossier nommé SyntaxHighlighter. Placez-y tout les dossiers de l'archive.

Vous devriez avoir ces 3 dossiers

1. scripts
2. src
3. styles

Modification du fichier header_head.inc
il se trouve dans le même dossier (include)

Ajouter ces lignes ci-dessous

Les configurations du scripts.

Dans mon fichier header_head.inc, il y a plusieurs configurations que j'utilise

SyntaxHighlighter.all(); // obligatoire
SyntaxHighlighter.config.clipboardSwf = 'scripts/clipboard.swf'; //affiche le flash permettant de voir,imprimer le code
SyntaxHighlighter.config.stripBrs = true; //Permet de ne pas afficher les sauts de lignes 

SyntaxHighlighter.config.tagName = "pre"; // Encadrement du code dans les balises 
...
SyntaxHighlighter.defaults['smart-tabs'] = true; //affichage du nombre de ligne
SyntaxHighlighter.config.strings.viewSource = "Voir la source";	// traduction de viewSource
SyntaxHighlighter.config.strings.print = "imprimer"; //traduction de Print	

Vous pouvez modifier, ajouter des configuration à votre guise.
Liste des configurations possible : http://alexgorbatchev.com/wiki/SyntaxHighlighter:Configuration

Comment l'utiliser ?

Pour colorier notre code, ensuite rien de plus simple

votre code

Ici dans l'exemple le code sera coloré pour du php (class="brush: php"). Pour changer de language, se référer au contenu de header_head.inc. Vous pouvez rajouter d'autre languages

http://alexgorbatchev.com/wiki/SyntaxHighlighter:Brushes

Vous pouvez avec ce moyen l'utiliser n'importe où dans votre NPDS.

- Comment l'incruster dans le forum ?
- Comment l'incruster dans tiny_mce ? (A venir)

Pour toutes questions: Forum

Cet article provient de NPDS Thèmes

L'URL pour cet article est : http://styles.npds.org/sections.php?op=viewarticle&artid=17