Guide du BBCode

Introduction

Qu’est-ce que le BBCode ?
Le BBCode est une implémentation spéciale du code HTML. Vous pouvez utiliser le BBCode dans vos messages sur le forum sous réserve que cette fonctionnalité ait été autorisée par un administrateur. De plus, vous pouvez désactiver les BBCodes sur chacun de vos messages depuis le formulaire de rédaction. Le BBCode est similaire à l’architecture du code HTML, les balises sont contenues entre des crochets « [ » et « ] » à la place des chevrons « < » et « > », et il offre un meilleur contrôle sur la mise en forme. Selon le style que vous utilisez, vous pouvez trouver et utiliser très facilement du BBCode dans vos messages depuis une interface cliquable située juste au-dessus du formulaire de rédaction. Si ces brèves explications ne vous conviennent pas, vous pouvez consulter le guide suivant qui s’avère très explicite.
Haut

Mise en forme du texte

Comment puis-je mettre du texte en gras, en italique et en souligné ?
Le BBCode inclut des balises qui vous permettent de modifier rapidement le style de votre texte brut. Ceci peut être effectué de différentes manières :
  • Pour mettre une partie d’un texte en gras, il faut l’enfermer entre les balises « [b][/b] ». Par exemple :

    [b]Salut[/b]

    Deviendra : Salut
  • Pour souligner une partie d’un texte, utilisez les balises « [u][/u] ». Par exemple :

    [u]Bonjour[/u]

    Deviendra : Bonjour
  • Pour mettre une partie d’un texte en italique, utilisez les balises « [i][/i] ». Par exemple :

    C’est [i]super ![/i]

    Deviendra : C’est super !
Haut
Comment puis-je modifier la taille ou la couleur du texte ?
Pour modifier la taille ou la couleur du texte, vous pourrez utiliser les balises suivantes. Cependant, gardez à l’esprit que le rendu visuel final dépendra également du navigateur internet et du système d’exploitation de l’utilisateur :
  • Pour insérer une couleur sur une partie d’un texte, il faut l’enfermer entre les balises « [color=][/color] ». Vous pouvez saisir le nom d’une couleur reconnue, comme par exemple « red », « blue » ou « yellow », ou saisir directement son code hexadécimal, comme « #FFFFFF » ou « #000000 ». Par exemple, pour mettre une partie d’un texte en rouge, vous pouvez utiliser :

    [color=red]Salut ![/color]

    Ou encore :

    [color=#FF0000]Salut ![/color]

    Ce qui, dans les deux cas, deviendra : Salut !
  • Pour modifier la taille de la police de caractères d’une partie d’un texte, utilisez les balises « [size=][/size] ». Les balises dépendent du style que l’utilisateur a sélectionné, mais le format recommandé est une valeur numérique représentant la taille du texte en pourcentage, commençant de 50 (minuscule) et allant jusqu’à 200 (énorme). Par exemple :

    [size=30]MINUSCULE[/size]

    Deviendra : MINUSCULE

    Alors que :

    [size=200]ÉNORME ![/size]

    Deviendra : ÉNORME !
Haut
Puis-je combiner des balises de mise en forme ?
Bien sûr ! Par exemple, pour obtenir l’attention de tout le monde, vous pouvez écrire :

[size=200][color=red][b]REGARDEZ-MOI ![/b][/color][/size]

Ce qui deviendra : REGARDEZ-MOI !

Cependant, nous vous déconseillons fortement d’utiliser fréquemment ce genre de mise en forme ! Gardez à l’esprit qu’il faut simplement fermer les balises correctement et dans le bon ordre. Par exemple, ce qui suit est incorrect :

[b][u]Ceci est incorrect[/b][/u]
Haut

Citation et données de largeur fixe

Citation de texte dans les réponses
Il y a deux manières de citer un texte, avec ou sans référence :
  • Lorsque vous utilisez la fonction de citation afin de répondre à un message sur le forum, vous devriez noter que le texte qui est ajouté à la fenêtre du message est inséré entre les balises « [quote=""][/quote] ». Cette méthode vous permet de citer, comme référence, une personne ou autre chose que vous choisissez de commenter ! Par exemple, pour citer une partie d’un texte rédigé par M. Blobby, vous devez saisir :

    [quote="M. Blobby"]Le texte que M. Blobby a rédigé sera situé ici[/quote]

    Le rendu final, « M. Blobby a écrit », sera ajouté automatiquement avant le texte actuel. Gardez à l’esprit que vous devez obligatoirement insérer les guillemets anglais « " " » autour du nom que vous citez, ils ne sont pas optionnels.
  • La seconde méthode vous permet de citer quelque chose de manière anonyme. Pour l’utiliser, enfermez le texte entre les balises « [quote][/quote] ». Lorsque vous consulterez le message ultérieurement, il affichera simplement le texte dans un bloc de citation.
Haut
Mise en forme de code ou de données de largeur fixe
Si vous souhaitez insérer un fragment de code ou quelque chose qui demande une largeur fixe, comme la police de caractères « Courier », vous devez enfermer le texte entre les balises « [code][/code] ». Par exemple :

[code]echo "Ceci est un fragment de code";[/code]

Toutes les balises de mise en forme présentes entre les balises « [code][/code] » sont conservées telles quelles lorsque vous consulterez le message ultérieurement.
Haut

Genèse de listes

Création d’une liste non-ordonnée
Le BBCode prend en charge deux types de liste, la liste ordonnée et la liste non-ordonnée. Elles sont pratiquement identiques par rapport à leur équivalent en HTML. Une liste non-ordonnée publie chaque article l’un après l’autre, en utilisant le caractère étoile. Pour créer une liste non-ordonnée, vous devez utiliser les balises « [list][/list] » et définir chaque article dans la liste en utilisant les balises « [*] ». Par exemple, pour lister vos couleurs favorites, vous pouvez utiliser :

[list]
[*]Rouge
[*]Bleu
[*]Jaune
[/list]

Ce qui deviendra la liste :
  • Rouge
  • Bleu
  • Jaune

Vous pouvez également créer une liste à puces en utilisant « [list=disc][/list] », « [list=circle][/list] » ou « [list=square][/list] ».
Haut
Création d’une liste ordonnée
Le second type de liste, la liste ordonnée, vous donne le contrôle sur ce qui est affiché devant chaque article. Vous devez utiliser les balises « [list=1][/list] » afin de créer une liste numérotée, ou bien encore les balises « [list=a][/list] » afin de créer une liste alphabétique. Comme pour la liste non-ordonnée, les articles doivent être définis en utilisant la balise « [*] ». Par exemple :

[list=1]
[*]Faire les boutiques
[*]Acheter un nouvel ordinateur
[*]Râler contre l’ordinateur lorsqu’il est bloqué
[/list]

Deviendra :
  1. Faire les boutiques
  2. Acheter un nouvel ordinateur
  3. Râler contre l’ordinateur lorsqu’il est bloqué
Pour créer une liste alphabétique, vous devez cependant utiliser :

[list=a]
[*]La première réponse possible
[*]La seconde réponse possible
[*]La troisième réponse possible
[/list]

Ce qui deviendra :
  1. La première réponse possible
  2. La seconde réponse possible
  3. La troisième réponse possible

[list=A]
[*]La première réponse possible
[*]La seconde réponse possible
[*]La troisième réponse possible
[/list]

Deviendra :
  1. La première réponse possible
  2. La seconde réponse possible
  3. La troisième réponse possible

[list=i]
[*]La première réponse possible
[*]La seconde réponse possible
[*]La troisième réponse possible
[/list]

Deviendra :
  1. La première réponse possible
  2. La seconde réponse possible
  3. La troisième réponse possible

[list=I]
[*]La première réponse possible
[*]La seconde réponse possible
[*]La troisième réponse possible
[/list]

Deviendra :
  1. La première réponse possible
  2. La seconde réponse possible
  3. La troisième réponse possible
Haut

Insertion de liens

Insérer un lien vers un site internet
Le BBCode de phpBB propose plusieurs manières de créer des liens.
  • La première emploie la balise « [url=][/url] », où ce qui est inséré après le signe égal « = » fera agir le contenu de cette balise en tant que lien. Par exemple, pour insérer un lien vers phpBB.com, vous pouvez utiliser :

    [url=https://www.phpbb.com/]Visitez phpBB.com ![/url]

    Ceci génèrera le lien suivant : Visitez phpBB.com ! Veuillez noter que le lien peut s’ouvrir dans la même fenêtre ou dans une nouvelle fenêtre, selon les préférences du navigateur des utilisateurs.
  • Si vous souhaitez que le lien soit affiché comme un lien basique, vous pouvez employer simplement ceci :

    [url]https://www.phpbb.com/[/url]

    Ceci générera le lien suivant : https://www.phpbb.com/
  • De plus, une des fonctionnalités de phpBB permet d’insérer les liens magiques, ce qui transformera n’importe quel lien en lien syntaxiquement correct, sans que vous n’ayez besoin d’indiquer des balises ou même encore d’ajouter « https:// ». Par exemple, en écrivant « www.phpbb.com » dans votre message, ceci se complètera automatiquement en « www.phpbb.com » lorsque vous verrez votre message par la suite.
  • La même chose est valable pour les adresses de courrier électronique, vous pouvez cependant indiquer une adresse explicite, par exemple :

    [email]inconnu@domaine.adr[/email]

    Ce qui deviendra : inconnu@domaine.adr, ou vous pouvez simplement écrire « inconnu@domaine.adr » dans votre message et celui-ci sera automatiquement converti lors de la visualisation.
Comme avec toutes les balises BBCode, vous pouvez insérer des liens autour d’autres balises comme « [img][/img] » (consultez la prochaine question), « [b][/b] », etc. Comme pour les balises de mise en forme, il vous appartient d’en assurer l’usage correct d’ouverture et de fermeture des balises, et ceci dans le bon ordre, comme par exemple :

[url=https://www.phpbb.com/][img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/url][/img]

N’est pas correct, ce qui peut mener à la suppression de votre message, soyez donc vigilant.
Haut

Affichage d’images dans les messages

Ajout d’une image à un message
Le BBCode de phpBB intègre une balise qui vous permet d’insérer des images dans vos messages. Les deux choses importantes à garder à l’esprit lors de l’utilisation des balises d’images sont que l’excès d’images dans les messages n’est pas apprécié par la plupart des d’utilisateurs et que l’image que vous souhaitez afficher doit être déjà disponible en ligne (elle ne peut pas exister seulement sur votre ordinateur, à moins que vous travailliez directement depuis un serveur internet !). Pour afficher une image, vous devez insérer entre les balises « [img][/img] » le lien pointant vers l’image. Par exemple :

[img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/img]

Comme noté précédemment dans la section des liens située ci-dessus, vous pouvez intégrer une image entre des balises « [url][/url] ». Par exemple :

[url=https://www.phpbb.com/][img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/img][/url]

Deviendra :

Haut
Transfert de pièces jointes dans un message
Les pièces jointes peuvent dès à présent être transférées dans les messages en utilisant le nouveau BBCode « [attachment=][/attachment] », si cette fonctionnalité a été activée par les administrateurs du forum et si vous en avez les permissions appropriées. Pour transférer des pièces jointes en ligne, cliquez sur le bouton respectif après votre sélection depuis la liste déroulante dans la page de rédaction.
Haut

Intégration de médias

Intégrer un média dans les messages provenant d’un service d’un autre site Web
Les utilisateurs peuvent intégrer du contenu multimédia (audio, vidéo) provenant de services fournis par d’autres sites Web en utilisant les balises du BBCode [media][/media], ou en publiant simplement l’adresse URL d’un lien pris en charge. Tel que, par exemple :

[media]https://youtu.be/QH2-TGUlwu4[/media]

Comme indiqué précédemment, le lien peut aussi être utilisé sans les balises du BBCode [media].

Ainsi, l’exemple montré ci-dessus affichera :



Le services des sites Web suivants sont supportés :
abcnews, acast, amazon, anchor, applepodcasts, audioboom, audiomack, bandcamp, bbcnews, bitchute, bleacherreport, brightcove, castos, cbsnews, clyp, cnbc, cnn, cnnmoney, codepen, comedycentral, coub, dailymotion, democracynow, dumpert, eighttracks, espn, facebook, falstad, flickr, foxnews, funnyordie, gamespot, getty, gfycat, gifs, giphy, gist, globalnews, gofundme, googledrive, googleplus, googlesheets, hudl, hulu, ign, imdb, imgur, indiegogo, instagram, internetarchive, izlesene, jsfiddle, jwplatform, kaltura, khl, kickstarter, libsyn, liveleak, livestream, mailru, medium, megaphone, metacafe, mixcloud, mlb, mrctv, msnbc, natgeochannel, natgeovideo, nbcnews, nbcsports, nhl, npr, nytimes, odysee, orfium, pastebin, pinterest, podbean, prezi, reddit, rumble, rutube, scribd, sendvid, slideshare, soundcloud, sporcle, sportsnet, spotify, spreaker, steamstore, stitcher, strawpoll, streamable, streamja, teamcoco, ted, telegram, theatlantic, theguardian, theonion, tiktok, tmz, tradingview, traileraddict, trendingviews, tumblr, twentyfoursevensports, twitch, twitter, ustream, vbox7, veoh, vevo, videodetective, vimeo, vine, vk, vocaroo, vox, washingtonpost, wistia, wshh, wsj, xboxclips, xboxdvr, youku, youmaker, youtube.

Une documentation complète à propos des services et des exemples d’adresses URL pris en charge, est disponible depuis la page : Sites pris en charges par le plugin MediaEmbed.
Haut

Divers

Puis-je ajouter mes propres balises ?
Si vous êtes un administrateur de ce forum et que vous en avez les permissions appropriées, vous pouvez ajouter davantage de BBCodes dans la section « Personnaliser les BBCodes ».
Haut

Boite des BBCodes avancés

Police de caractères
[font=Comic Sans MS]text[/font]

Exemple :
[font=Comic Sans MS]Le renard brun et rapide saute sur le chien paresseux.[/font]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
Haut
Texte surligné
[highlight=yellow]texte[/highlight] Astuce: vous pouvez également utiliser color=#FF0000

Exemple :
[highlight=yellow]Le renard brun et rapide saute sur le chien paresseux.[/highlight]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
Haut
Alignement du texte
[align=center|left|right|justify]texte[/align]

Exemple :
[align=center]Le renard brun et rapide saute sur le chien paresseux.[/align]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.

Haut
Texte flottant
[float=left|right]text[/float]

Exemple :
[float=right]Le renard brun et rapide saute sur le chien paresseux.[/float]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.

Haut
Texte barré
[s]texte[/s]

Exemple :
[s]Le renard brun et rapide saute sur le chien paresseux.[/s]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
Haut
Texte en indice
[sub]texte[/sub]

Exemple :
[sub]Le renard brun et rapide saute sur le chien paresseux.[/sub] Le renard brun et rapide saute sur le chien paresseux.

Résultat :
Le renard brun et rapide saute sur le chien paresseux. Le renard brun et rapide saute sur le chien paresseux.
Haut
Texte en exposant
[sup]texte[/sup]

Exemple :
[sup]Le renard brun et rapide saute sur le chien paresseux.[/sup] Le renard brun et rapide saute sur le chien paresseux.

Résultat :
Le renard brun et rapide saute sur le chien paresseux. Le renard brun et rapide saute sur le chien paresseux.
Haut
Texte lumineux
[glow=color]text[/glow]

Exemple :
[glow=red]Le renard brun et rapide saute sur le chien paresseux.[/glow]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
Haut
Ombres sur le texte
[shadow=color]text[/shadow]

Exemple :
[shadow=blue]Le renard brun et rapide saute sur le chien paresseux.[/shadow]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
Haut
Texte à courte ombre portée
[dropshadow=color]text[/dropshadow]

Exemple :
[dropshadow=blue]Le renard brun et rapide saute sur le chien paresseux.[/dropshadow]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
Haut
Texte flou
[blur=color]text[/blur]

Exemple :
[blur=blue]Le renard brun et rapide saute sur le chien paresseux.[/blur]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
Haut
Texte fondant
[fade]text[/fade]

Exemple :
[fade]Le renard brun et rapide saute sur le chien paresseux.[/fade]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
Haut
Texte préformaté
[pre]texte[/pre]

Exemple :
[pre]Le renard brun et rapide saute sur le chien paresseux. Le renard brun et rapide saute sur le chien paresseux.[/pre]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
	Le renard brun et rapide saute sur le chien paresseux.

Haut
Sens d’écriture
[dir=ltr|rtl]text[/dir]

Exemple :
[dir=rtl]Le renard brun et rapide saute sur le chien paresseux.[/dir]

Résultat :
Le renard brun et rapide saute sur le chien paresseux.
Haut
Spoiler le message
[spoil]texte[/spoil]

Exemple :
[spoil]Le renard brun et rapide saute sur le chien paresseux.[/spoil]

Résultat :
► Afficher le texte

Haut
Masquer aux invités
[hidden]text[/hidden]

Exemple :
[hidden]Le renard brun et rapide saute sur le chien paresseux.[/hidden]

Résultat :
Contenu caché
Vous devez être inscrit et connecté sur ce forum pour voir le contenu caché.

Haut
Message d’alerte
[mod=username]texte[/mod]

Exemple :
[mod=Nom d’utilisateur]Le renard brun et rapide saute sur le chien paresseux.[/mod]

Résultat :
 ! Message de : Nom d’utilisateur
Le renard brun et rapide saute sur le chien paresseux.

Haut
Message hors-sujet
[offtopic]texte[/offtopic]

Exemple :
[offtopic]Le renard brun et rapide saute sur le chien paresseux.[/offtopic]

Résultat :
Hors-sujet
Le renard brun et rapide saute sur le chien paresseux.

Haut
Texte [ASCII Art] NFO
[nfo]texte[/nfo]

Exemple :
[nfo]༼ つ ◕_◕ ༽つ ʕ•ᴥ•ʔ ¯\_(ツ)_/¯[/nfo]

Résultat :
༼ つ ◕_◕ ༽つ    ʕ•ᴥ•ʔ   ¯\_(ツ)_/¯

Haut