Apprendre le BBCode

J'ai pu observer que les membres ne se servait pas trop des différentes fonctions pour personnaliser les messages (Italique, gras etc..) et j'en ai conclus que l'utilisation des balises BBCode ne vous disais rien, je vais donc vous expliquer en détail comment elle fonctionne =)

I.Qu'est ce que c'est ?
Les balises BBCode (Bulletin Board Code) permette une personnalisation de vos message comme dans les exemples suivant :

Citation :

Italique

Gras

Couleur

Taille

Ecole Pascal

Comme vous avez pu le voir ces textes ont différentes propriétés (Gras, italique couleur, taille et lien), pour appliquer ce genre de propriété c'est un peu près comme Word mais il y a une notion importante à retenir, il existe deux parties : le code et le visuel !
-Le visuel c'est le message quand il est vu par d'autre membres ou par vous même, la partie Visuel n'est que visible lorsque vous avez terminé votre message et l'avez envoyé.
-Le code n'est visible que par la personne qui est en train d'écrire le message, la partie code est donc avant le visuel puisqu'il s'agit du moment où le membre qui écris le message.
Exemples :
En ce moment vous lisez mon message, c'est donc l'étape visuel...
L'étape code elle ressemble à celle-ci (Cette exemple reprend celui-ci dans haut mais cette fois ci en code) :

Code:

[i]Italique[/i]

[b]Gras[/b]

[color=blue]C[/color][color=red]o[/color][color=yellow]u[/color][color=blue]l[/color][color=green]e[/color][color=red]u[/color][color=yellow]r[/color]

[size=16]Taille[/size]

[u][url=http://ecolepascal.free.fr/]Ecole Pascal[/url][/u]

Bon si vous me dites que vous avez rien compris c'est pas très grave, l'essentiel c'est de savoir l'utilisé et que ça ne vous empêche pas de dormir xD

II.Les balises textes :
Je vous ai expliqué qu'est ce que le BBCode nous allons passer à la pratique à présent, dans cette partie je vais vous montré les balises BBCode qui permette de modifier l'apparence du texte.

1.Gras :
Pour lettre le texte en gras il vous suffit de faire comme ceci quand vous écrivez votre message :

Code:

Voici un texte gras : [b]ceci est le texte gras[/b]

Visuel :

Citation :

Voici un texte gras : ceci est le texte gras

Pour ceux qui n'ont pas compris comment ça marche il vous suffit de mettre le texte que vous désiré mettre en gras entre les balises (Le b entre crochet), c'est pareil pour toutes les autres balises...

Remarques :
1.Vous avez peut-être remarqué que la balise fermante :

Code:

[/b]

Si vous regardez bien il y a une petite différence avec la balise ouverte, la balise fermante possède un slash (/), il est impérative de mettre dans chaque balise fermante un slash car c'est ce qui permet de différencier une balise ouvrante et une balise fermante

2.Le design obscure de ce Forum ne nous permet pas très bien de distinguer les textes en gras donc leurs utilisation n'est pas très utile

3.Je ne répéterais plus la manière d'utiliser les balises sauf si une utilisation particulière est requise...

2.Italique :

Code:

Voici un texte italique : [i]ceci est le texte italique[/i]

Visuel :

Citation :

Voici un texte italique : ceci est le texte italique

3.Souligné :

Code:

Voici un texte souligné : [u]ceci est le texte souligné[/u]

Visuel :

Citation :

Voici un texte souligné : ceci est le texte souligné

4.Barré :

Code:

Voici un texte barré: [strike]ceci est le texte barré[/strike]

Visuel :

Citation :

Voici un texte barré : ceci est le texte barré

5.Taille :

Code:

Voici un texte avec des tailles différentes :[size=16] ceci[/size] [size=10]est le[/size] [size=20]texte[/size]

Visuel :

Citation :

Voici un texte avec des tailles différentes : ceci est le texte

Remarque :
Pour définir une taille vous devez mettre votre valeur à coté de size=

6.Centré :

Code:

Voici un texte centré : [center]ceci est le texte centré[/center]

Visuel :

Citation :

Voici un texte centré :

ceci est le texte centré

Remarque :
La position ne se limite pas à être centré, vous pouvez choisir un coté en remplaçant center par left (Gauche) ou right (Droite)

7.Texte qui défile :

Code:

Voici un texte qui défile : [scroll]ceci est le texte qui défile[/scroll]

Visuel :

Citation :

Voici un texte qui défile : ceci est le texte qui défile

8.Couleur :

Code:

Voici un texte en couleur : [color=red]ceci est[/color]  [color=yellow]le texte[/color] [color=green]en couleur[/color]

Visuel :

Citation :

Voici un texte en couleur : ceci est le texte en couleur

Remarque :
Pour définir une couleur vous devez mettre votre nom couleur en Anglais à coté de color=

Maintenant on a un peu près fais le tour des balises qui permettent de modifier le texte mais il en reste bien d'autre...

III.Les balises "dynamiques" :
Dans cette partie nous traiterons des balise dis dynamique car elle rajoute des actions au message...

1.Hyperlien :
La balise hyperlien (Ou URL pour les intimes xD ) permet de mettre un lien sans pour autant mettre toute l'adresse URL, voici un exemple :

Citation :

Pour accéder au site de l'école Pascal cliquez ici

Voici comment faire pour utiliser cette balise :

Code:

Pour accéder au site de l'école Pascal cliquez [url=http://ecolepascal.free.fr/]ici[/url]

Dans cette exemple vous êtes envoyés vers l'école pascal mais imaginons que vous avez fait un montage, que vous l'avez mis sur Youtube et que vous voulez le montrer donc pour mettre le lien vous allez tout d'abord copier l'URL puis ensuite vous allez le copier à la place de http://ecolepascal.free.fr/, par conséquent l'URL de la page web doit être après url=

2.Citation :
Vous voulez répondre à un autre membre en citant une de ses phrases, BBCode à une balise pour différencier la citation et votre réponse !

Code:

Voici une citation : [quote]ceci est une citation[/quote]

Visuel :

Citation :

Voici une citation :

Citation :

ceci est une citation

Remarque :
Vous pouvez très bien utiliser les citations pour d'autre chose que citer, ici moi je les utilise pour mes exemples visuels.

3.Images :
Si vous voulez poster une image vous faites comment ? Je veux mettre le logo SilverLight donc je met le lien :

Citation :

Logo SilverLight
C'est déjà pas mal mais franchement BBCode propose une fonction mieux !

Code:

[img]http://blogs.ionis-group.com/epita/media/microsoft_silverlight_c.jpg[/img]

Visuel :

Comme vous avez pu le voir BBCode affiche l'image directement.

Conseil : Éviter d'afficher des images très grand car les dimensions du topic vont être changé,le chargement prend plus de temps et je doute que ça soit une œuvre d'art xD

Voila, c'est finis, évidemment il reste encore d'autre balise que je ne juge pas nécessaire de vous apprendre, mais si vous avez un problème quelconque faite le savoir

Remarque : si un jour vous décidez d'apprendre du XHTML vous remarquerez que le sytème de balise est très proche de celui de BBCode et c'est normal puisque BBCode vient de XHTML et CSS...

Merci pour ce post très complet,bien expliqué

Houahou
comment t'a fait un truck avec toute ces informations
Sa a du être super long
NON

Peut être, mais c'est le résultat qui compte Merci pour ces informations précieuses ( même si je les connais et les utilise occasionellement )
PS : Eren pense a limiter le nombre de tes smileys car après ca fait tout moche et bizarre

@EREN25 :
Franchement c'est plutôt facile à faire...
Je connais le BBCode par cœur, c'est pas sorcier franchement, en tout cas comparé à du PHP ou du C#...

Ba il faut être très parleur et avoir quelque chose a dire

Contrairement à certain qui parle pour ne rien dire !!!!!

merci xaviier pour cette explication complexe mais j'en savais deja une partie

Ouai c'était très complexe , mais quand tu là lu sa t'apprend beaucoup de truc!!

Il a raison c un peu compliqué^^^mais c bien expliqué merci

Moi je trouve ça pas du tous compliquer et en plus ce genre de chose est à savoir n'est ce pas SAMUCHIWA (^^^^^).

OK c'est cool

Sperate a écrit:

Il faux être passionner d'informatique.

Absolument pas...
Le BBCode est présent dans la plupart de ce type de Forum pré-fabriqué donc il vaut mieux s'y habituer et, comme l'a dit Cobra 11 c'est pas très complexe, c'est même à ta porté (j'espère ne pas me tromper )

Bien sûr Cobra 11 c'est pas compliqué mdr .

Merci Xaviier je ne connaissait pas tout le BBCode

le bbcode est simple, il suffit de savoir l'utiliser.

merci beaucoup même si j'en savais déjà une grosse partie

comme je le dit c'est assez simple il faut juste un peu de pratique.