Sujet Précédent Sujet Suivant

Comment faire la coloration de code source

busenu21 - Modifié le 28 janv. 2020 à 12:06
cs_PaTaTe Messages postés 2126 Date d'inscription mercredi 21 août 2002 Statut Contributeur Dernière intervention 19 février 2021 - 6 févr. 2020 à 01:03

bonjour et bien à vous les amis

je conçu un blog et la rédaction des tuto passe sans problème mais je cherche comment faire pour que le code source soit coloré lors de la lecture du tuto par un visiteur de mon blog .

c'est un peut comme quand on lut un tuto sur ccm on voit bien que les codes sources sont coloré ce qui permet la compréhension du lecteur ou visiteur.

merci d'avance

A voir également:

Comment faire une source
Source tree - Conseils pratiques -[Fiches pratiques]
Code source formulaire d'inscription php mysql - Forum PHP
Formulaire java code source - Forum Java
Source code streaming ✓ - Forum Java
Application windev avec code source ✓ - Forum Autres langages

4 réponses

Réponse 1 / 4

NHenry Messages postés 15113 Date d'inscription vendredi 14 mars 2003 Statut Modérateur Dernière intervention 22 avril 2024 159
28 janv. 2020 à 18:54

Cela s'appelle de la coloration syntaxique.

busenu21
29 janv. 2020 à 17:07

bonjour NHenry et merci pour la correction du terme ;

je voudrait bien voir aussi la réponse svp
merci cordialement

Réponse 2 / 4

@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
Modifié le 29 janv. 2020 à 16:11

bonjour

un exemple en javascript utilisant un regex et un objet json pour les mots réservé

<!doctype html>
 <html lang="fr">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <head>
 <style type="text/css">

 body{
  font-family:Verdana, Geneva, sans-serif;
  background-color:#b2bdc6;
 } 
 
 .coode{
  color:blue;
 }

 pre{
  background-color:gray;
 } 
 </style>
 <script>
 
 var un_objet={
   "Private" : "<span class='coode'>Private</span>",
   "Sub" : "<span class='coode'>Sub</span>",
   "If" :"<span class='coode'>If</span>",
   "Exit" :"<span class='coode'>Exit</span>",
   "End" : "<span class='coode'>End</span>",
   "Error" : "<span class='coode'>Error</span>",
   "GoTo" : "<span class='coode'>Goto</span>",
   "True" : "<span class='coode'>True</span>",
   "False" : "<span class='coode'>False</span>",
   "Then" : "<span class='coode'>Then</span>",
   "On" : "<span class='coode'>On</span>",
 };

function obj_key(){ 
 
 var txt=document.getElementById("tar").value

 for (var x in un_objet){
 
    var regex = new RegExp(x,'g');
 
    txt=txt.replace(regex,un_objet[x])
 
 }
  document.getElementById("rendu").innerHTML=txt
 }

 </script>
 </head>
 <body>
 <br>
 <button onclick="obj_key()">coloration</button>
 
 <textarea id="tar" style="height:350px;width:450px">Private Sub AskPin_Click()
On Error GoTo AskPin_Click_Error

If Len(Userid) < 6 Then
MsgBox ("Le nom d'utilisateur doit comporter au moins 6 caractères"), vbExclamation
Exit Sub
End If

Instr1.Visible = True
Instr3.Visible = False
End If
On Error GoTo 0
Exit Sub
AskPin_Click_Error:
ErrHdl ("AskPin_Click dans Connexion")
End Sub</textarea>
 <br>
 <span id="demo"></span>
 
 <pre id="rendu"></pre>
 </body>
 </html>

le tout étant court et simple je te laisse comprendre par toi même.

busenu21
29 janv. 2020 à 17:43

Bonjour karamel grand merci pour ce code !

ceci me permet d'avoir une idée pour la suite.

est ce que tu peut mettre quelques code php sur ceci ?
pour le moment j'utilise fckeditor pour la redaction de mes articles et tutos alors est ce possible d'integré ce code à fckeditor ?

merci bien cher ami.

Réponse 3 / 4

@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
30 janv. 2020 à 09:15

ce que j'ai mis est une approche ça demande a être amélioré surtout au niveau des regex (Expression régulière) de même pour une utilisation avec du code php il faut intégré a l'objet les mots réserve du langage php quand a l’intégration dans fckeditor je ne peut rien dire ne connaissant pas sont fonctionnement.

il faut bien avoir en tete que le code ne fait que rajouter des balises span avec une class a chaque mot réserve pour moi sa ne peut que servir a un affichage a l’écran

NHenry Messages postés 15113 Date d'inscription vendredi 14 mars 2003 Statut Modérateur Dernière intervention 22 avril 2024 159
30 janv. 2020 à 19:07

Il existe un paquet de code pour le faire.
Une recherches et quelques teste te permettront de trouver ce que tu cherches.

busenu21 > NHenry Messages postés 15113 Date d'inscription vendredi 14 mars 2003 Statut Modérateur Dernière intervention 22 avril 2024
31 janv. 2020 à 08:12

bonjour un lien vers n de tes découverte m'aidera beaucoup

merci cordialement

NHenry Messages postés 15113 Date d'inscription vendredi 14 mars 2003 Statut Modérateur Dernière intervention 22 avril 2024 159 > busenu21
31 janv. 2020 à 19:02

Tu veux l'utiliser pour quel langage ?
Pour du PHP : https://www.php.net/manual/en/function.highlight-string.php

busenu21 > NHenry Messages postés 15113 Date d'inscription vendredi 14 mars 2003 Statut Modérateur Dernière intervention 22 avril 2024
3 févr. 2020 à 12:32

justement pour du php

merci beaucoup pour le lien

Réponse 4 / 4

cs_PaTaTe Messages postés 2126 Date d'inscription mercredi 21 août 2002 Statut Contributeur Dernière intervention 19 février 2021 2
6 févr. 2020 à 01:03

En JavaScript, il y a une librairie plus de 180 langages : https://hightlightjs.org/

Cordialement,

Discussions similaires

Faut-il dire "une source" ou "un source"?

GMAO

Portail Intranet open source

GED

gestion de ressources humaines

Votre réponse

Discussions similaires