Aide sur les balises BBCode

[Karamel]

Ci dessous une aide pour utiliser au mieux les différentes balises.

Balises de formatage de texte
Le code suivant :

Code : Tout sélectionner

[b]bold[/b]
[i]italic[/i]
[u]underlined[/u]
[size=150]size 150[/size]

Donne le résultat suivant :
bold
italic
underlined
size 150
Le paramètre de size indique en pourcent la taille de la police.

Pour la couleur, le plus simple est de choisir par les boutons de rédaction, bien que le changement de couleur soit déconseillé. Imaginez que l'on change la couleur de fond du forum, le texte peut devenir complètement illisible... À moins de l'utiliser dans sa signature, il sera très fastidieux de traquer les textes illisibles et les modifier.Pour la mise en page il est donc préférable d'utiliser les balises ci-dessus.

Les listes
Pour créer une liste on utilise le code suivant :

Code : Tout sélectionner

[list]ligne 1
ligne 2[/list]

Ce qui donne :

• ligne 1
  ligne 2

Et pour que ça soit un peu plus joli (mais plus long à écrire) :

Code : Tout sélectionner

[list][*]ligne 1[/*][*]ligne 2[/*][/list]

• ligne 1
• ligne 2

Pour des puces numérotées :

Code : Tout sélectionner

[list=1][*]ligne 1[/*][*]ligne 2[/*][/list]
[list=a][*]ligne 1[/*][*]ligne 2[/*][/list]
[list=A][*]ligne 1[/*][*]ligne 2[/*][/list]
[list=i][*]ligne 1[/*][*]ligne 2[/*][/list]
[list=I][*]ligne 1[/*][*]ligne 2[/*][/list][/list]

Qui donnent :

1. ligne 1
2. ligne 2

1. ligne 1
2. ligne 2

1. ligne 1
2. ligne 2

1. ligne 1
2. ligne 2

1. ligne 1
2. ligne 2

Il n'est pas nécessaire de fermer les balises *, tant que les lignes sont sur une ligne différente.
Et on peut même imbriquer des listes (bien que je ne pense pas qu'on en aura pas besoin souvent) :

Code : Tout sélectionner

[list=I][*]1er chapitre
[list=A][*] grand A
[*]grand B[/list]
[*]2e chapitre[/list]

1. 1er chapitre
   1. grand A
   2. grand B
2. 2e chapitre

Le formatage spécial
La balise code sert à afficher du code brut comme pour les exemple de code de ce message par exemple, pour que les balises BBcode ne soient pas interprétées mais affichées.

Code : Tout sélectionner

[code]Exemple d'usage de la balise [b]bold[/b]

[/code]
Donne

Code : Tout sélectionner

Exemple d'usage de la balise [b]bold[/b]

Citations
Les citations s'utilisent automatiquement avec le bouton citer, mais autant savoir s'en servir pour les dupliquer, les modifier...

Code : Tout sélectionner

[quote="Un membre du forum"]C'est celui qui le dit qui l'est[/quote]

Donne le résultat suivant :

C'est celui qui le dit qui l'est

Il ne faut pas oublier les " " autour du nom de l'auteur, sinon on obtient une citation annonyme

Liens et images
Pour les images c'est simple, il suffit d'indiquer l'url de l'image entre les balises. Par exemple

Code : Tout sélectionner

[img]http://www.chezmoi.com/monimage.jpg[/img]

Par contre si vous connaissez la taille de l'image il est préférable d'utiliser la balise image :

Code : Tout sélectionner

[image=300*150]http://www.chezmoi.com/monimage.jpg[/image]

Ce code demande l'affichage de l'image en la dimensionnant en 300x150 pixels. Ceci permet de prévoir des espaces blancs pour l'affichage de l'image avant même qu'elle commence à charger, ce qui règle le problème de la perturbation de la mise en page lors du chargement.
Elle peut également être utilisée pour faire des redimensionnements. Même si elle peut avoir le même effet qu'une miniature, l'usage à cet effet est déconseillé car la petite image est en fait l'originale, et gardera donc son poids original et son temps de chargement. (une miniature d'une photo de 1Mo aussi ridiculement petite soit elle fera toujours 1Mo, alors qu'une vraie miniature sera peut être 10 fois moins lourde)

Pour les liens, on peut soit utiliser le lien directement, soit indiquer un texte de remplacement :

Code : Tout sélectionner

[url]http://www.jeuxdeliens.fr[/url]
[url=http://www.jeuxdeliens.fr]Le forum Jeux de Liens[/url]

Ce qui donne :
http://www.jeuxdeliens.fr
Le forum Jeux de Liens

Pour faire une image cliquable (une miniature qui ouvre la grande image au clic) on utilise une combinaison de url et img (ou mieux image pour fixer la taille de l'image miniature)

Code : Tout sélectionner

[url=http://www.chezmoi.fr/magrandeimage.jpg][img]http://www.chezmoi.fr/maminiature.jpg[/img][/url]

Affiche maminiature.jpg avec un lien vers magrandeimage.jpg quand on clique dessus.

Texte caché
Pour un spoiler, la réponse à une devinette ou d'autres choses où un contenu ne doit pas être visible directement, on utilise la balise hidden.

Code : Tout sélectionner

[hidden]La curiosité est un vilain défaut ;)[/hidden]

Donne :
[hidden]Et en plus on regarde quand même (ce n'est pas le texte indiqué dans le code du dessus)[/hidden]
On peut mettre d'autres balises pour formater le contenu caché.

Il y a aussi une variante pour changer le texte affiché devant le bouton :

Code : Tout sélectionner

[hidden="Voir la réponse"]Sauf qu'il n'y a pas de question[/hidden]

Donne :

Sauf qu'il n'y a pas de question

Comme pour quote il ne faut pas oublier les " ". Il est par contre impossible d'ajouter des balises dans ce texte personnalisé, donc pas de formatage spécial.

Et voilà, vous savez à peu près tout sur les balises du forum.
Ce guide est amené à évoluer avec le temps, d'autres balises peuvent s'ajouter au fil des besoins et modifications
Bonne rédaction !

[Mad Hatter]

Par contre si vous connaissez la taille de l'image il est préférable d'utiliser la balise image :

Code : Tout sélectionner

[image=300*150]http://www.chezmoi.com/monimage.jpg[/img]

Je n y arrive pas

[Emma]

je ne comprends pas ton problème en fait tu n'arrives pas à inserer des images via des fichiers joints?

[Mad Hatter]

Et bien la balise où l'on indique la taille des éléments en pixels ne fonctionne pas et pourtant j'ai bien vérifié les dimensions en pixels des images.

[Karamel]

C'est parce que j'ai écrit n'importe quoi.

Ça n'est pas [/img] qu'il faut mettre à la fin mais [/image]. Pour aller plus vite tu as aussi le bouton image= au dessus de la zone de texte quand tu écris un message

Je corrige ça au dessus.

[Mad Hatter]

La dernière partie de la balise image a été perdue.

J'ai

[image=]

au lieu de

[image=] [/image]

[Alexandra_TV]

Celle-ci est avec la balise img



Celle-ci est avec la balise image= mais cependant, j'ai du refermer la balise de par moi-même car elle n'apparait pas d’elle-même

Alexandra