comment faire la coloration de code source sur un blog ? Résolu/Fermé

Question

bonjour mes chers amis tout d'abord mes vœux les meilleurs a tous

j'ai un problème qui m'agace vraiment et je ne trouve toujours pas des solutions, voici mon problème : 

comment faire la coloration de code source sur une page web  ? 
quand je rédige par exemple un tuto qui explique comment crée une page web que le code soit coloré quand le visiteur lut le tuto.

merci d'avance mes chers amis

cs_PaTaTe · Answer

Bonjour,

Pour simplifier à outrance, un système de colorisation syntaxique va substituer un mot du langage par ce même mot mais en lui ajoutant un style. Par exemple admettons que ton code soit stocké dans la variable $code :

$colCode = replace_str('function', '<span style="color:blue;">function</span>', $code);

$colCode contiendra le code avec le mot function colorisé en bleu. Ceci n'a de pour but que te montrer simplement comment faire mais il est préférable de passer par un CSS au lieux de mettre le style en dur, rien que pour la maintenance, ça sera plus simple ^^

Après, je suis sur que des classes PHP voire même JS existent pour faire le taf

Cordialement,

[Dal] · Answer

Salut busenu21,

Pour la coloration syntaxique, des bibliothèques JavaScript comme :

https://highlightjs.org/
https://highlightjs.org/usage/

sont communément utilisées

Dal

[Dal] · Answer

Le lien que j'ai donné https://highlightjs.org/usage/ comporte un tutoriel "Getting started" qui explique comment utiliser la bibliothèque JavaScript dans le code de ton site. Tu n'indiques rien sur ton site, ou ton système de blog, ni sur tes propres contraintes techniques. Cette bibliothèque peut être utilisée de multiples façons, y compris sur un serveur Node.js Pour une utilisation côté client, en gros, tu as le choix d'héberger la bibliothèque sur ton site, ou d'utiliser une bibliothèque packagée disponible sur un serveur CDN hébergeant la bibliothèque pour toi. Tu trouves ces informations sur la page précitée et la partie "Getting the Library", et sur le lien "download" tu vas obtenir aussi les URL à utiliser si tu optes pour un CDN, vois : https://highlightjs.org/download/ qui comporte les liens vers jsdelivr Par exemple, pour utiliser le package standard sur le CDN jsdelivr qui supporte tous les langages mentionnés dans la section "Common", tu peux faire :

This is an example of use of highlight.js

for C code:


#include 

int main(void) {
    printf("hello, world
");
    
    return 0;
}
<∕code>






en ligne 21 j'ai été obligé de remplacer le slash de <∕code> par un caractère UTF8 y ressemblant pour que la coloration de syntaxe du forum affiche le code jusqu'au bout. Dans ton code à toi, met un vrai slash /.

Dal

Comment faire la coloration de code source sur un blog ?

3 réponses

Discussions similaires