Bonjour,
Voici quelques temps maintenant qu'il m'a été demandé comment j'avais inclue les BBCodes sur ce site.
Pour la petite histoire, ces codes ne sont pas de moi mais viennent du site
Sur-la-Toile.com. J'ai simplement repris ces fonctions pour les adapter à NDPS. Après avoir demandé l'accord de l'administrateur de Sur-la-Toile (
Ben) pour publier ces bouts de codes, il m'a avoué lui-même pioché à droite à gauche pour obtenir ce résultat et autorise sans hésitations son partage. Merci Ben
Ces BBCodes sont en place sur EntraidElec depuis un bon moment déjà et certains détails ont pus m'échapper dans la rédaction de ce message, aussi je vous recommande bien-entendu de conserver des copies de vos fichiers avant de les modifier.
Insertion automatique des BBCodes dans le message
Tout d'abord, vous aurez à insérer des fonctions !!javascript!! dans votre fichier
lib/formhelp.java.php :
bbcodes_java.txt
Ces fonctions gèrent l'affichage de pop-up permettant d'y inclure le texte ou l'url à placer entre les balises.Les balises sont alors automatiquement insérées dans le message à l'emplacement du curseur. Vous devrez définir la forme de vos balises.
Occupez-vous seulement de la fonction
DoPrompt().
Exemple :
else if (action == "img") {
var thisImage = prompt("Entrez l'adresse de l'image.", "http://");
var imageBBCode = "
";
if (thisImage != null) {doInsert(" " + imageBBCode + " ", "");}
document.coolsus.message.focus();
Lorsque nous appellerons cette fonction, nous lui affecterons une variable. C'est cette variable qui permettra de déterminer le type de BBCode souhaité (image, gras, italique,..).
Dans cette exemple, pour l'appel au BBCode d'insertion d'image, la variable aura pour valeur "
img". Vous choisissez pour celle-ci le texte à afficher en pop-up, ici "
Entrez l'adresse de l'image". La ligne suivante détermine la balise à utiliser pour son affichage ultérieur. Vous n'êtes pas obligé d'utiliser les crochets. A vous de choisir la syntaxe qui convient la mieux. Gardez cependant à l'esprit que les internautes ont leurs habitudes. Essayez donc de conserver des formats standards.
Exemple 2 :
if (action == 'b') {question = "Entrez le texte à mettre en gras.";}
Ici, le BBCode pendra systématiquement comme syntaxe celle choisie lors de l'appel de la fonction (b, i, center, etc.) entouré de 2 crochets.
Si vous souhaitez utiliser des balises autre, modifiez alors cette ligne :
wrap_tags("[" + action + "]", "[/" + action + "]", question, reponse );
devient par exemple
wrap_tags("@" + action + "@", "@/" + action + "@", question, reponse );
Appel des fonctions d'insertion
Pour faire appel à ces fonctions, il vous faut modifier la fonction
HTML_Add() du fichier
functions.php, qui gère l'affichage de vos boutons.
Par exemple :
<a href=\"!!!!javascript!!!!: addText('<b>','</b>');\"><img src=\"editeur/editor_images/med_bold.gif\" border=\"0\" alt=\"\" width=\"18\" height=\"18\" /></a>
devient
<a href=\"!!!!javascript!!!!: DoPrompt('b');\"><img src=\"editeur/editor_images/med_bold.gif\" border=\"0\" alt=\"\" width=\"22\" height=\"22\" /></a></span>
Nous envoyons ici la valeur
b pour l'appel au BBCode de mise en caractères gras.
Affichage des BBCodes
Maintenant que vos messages contiennent des balises, il faut les interpréter. Le navigateur doit donc lire le contenu du message à afficher, déterminer si oui ou non il y a du BBCode, et appliquer les transformations au message.
Commencez par créer une nouvelle fonction dans
functions.php que vous appellerez ...
bbCode() pourquoi pas !
Dans cette fonction, nous viendrons scruter le message. Si l'une de nos balises est trouvée (ouvrante + fermante), ce qui se trouve entre les 2 prendra la forme que vous souhaitez, ce avec l'aide d'un
preg_replace()
preg_replace utilise des
expressions rationnelles. Comprendre ce qu'elles sont vous permettra de personnaliser à souhait vous BBCodes.
Les possibilités sont presque infinies, aussi je ne reprendrais ici que les BBCodes les plus courant :
function bbCode($message) {
$message = preg_replace('#\[b\](.*)\[/b\]#Usi', '<b>$1</b>', $message);
$message = preg_replace('#\[i\](.*)\[/i\]#Usi', '<i>$1</i>', $message);
$message = preg_replace('#\[img\](.*)\[/img\]#Usi', '<img src="$1" border="0">', $message);
$message = preg_replace('#\[url\](.*)\[/url\]#Usi', '<a href="$1" target="_blank">$1</a>', $message);
$message = preg_replace('#\[url=([^\]]*)\](.*)\[/url\]#Usi', '<a href="$1" title="$2" target="_blank">$2</a>', $message);
return($message);
}
Exemple :
$message = preg_replace('#\[b\](.*)\[/b\]#Usi', '<b>$1</b>', $message);
Ce code permet de placer entre des balises HTML <b> et </b> tout ce qui ce trouve dans un message entre les balises BBCode et .
(.*)défini le contenu situé entre les balises et comme variable $1. Vous choisissez alors ce qui entourera votre variable $1 après la 1ère virgule. Après la 2ème virgule se trouve la variable à analyser, donc le message.
Donc pour test , le navigateur comprendra <b>test</b> et affichera test
La première ligne destinée aux URL définira tout simplement ce qui se trouve entre les balises correspondantes comme étant à la fois l(URL de destination et le texte à afficher en lien.
La seconde écriture place ce qui se trouve derrière le = comme URL, et ce qui se trouve entre les balises comme texte du lien.
Ce n'est pas un cours sur les expressions régulières aussi je m'arrêterais là. De plus je ne maîtrise pas cela à la perfection et d'autres sites spécialisés seront sans doute plus à même de vous éclairer. Vous pouvez cependant partager à la suite de ce message vos différentes sources liées aux BBCodes, et pourquoi pas créer de nouvelles discussions sur ce forum pour vous faire aider.
Il ne manque pas quelque-chose ?
Ah si, il faut bien appeler cette fonction pour qu'elle serve à quelque-chose !
Et bien sur toutes vos pages permettant un affichage des messages du forum. La plus sollicitée est bien entendu (pour les utilisateurs d'NPDS toujours)
viewtopic.php, mais n'oubliez pas les pages offrant une pré-visualisation comme newtopic.php, editpost.php, reply.php mais aussi sur la messagerie privée, etc.
Vous avez déjà l'appel de la fonction
smilie() sur ces pages. Placez votre nouvelle fonction avec tout simplement :
if ($allow_bbcode==1) {
$message = Smilie($message);
$message = bbCode($message);
}
Si vous constatez des anomalies ou que vous avez des problèmes dans l'installation de ces scripts, n'hésitez pas !
[ Message modifié par Freud le 25-10-2008 à 12:22 ]