Accueil > Utilisation du BBcode > Formatage du texte avec le BBcode

Formatage du texte avec le BBcode

Présentation

Ce site internet possède un petit formulaire pour aider les utilisateurs à mettre en forme un message. Celui-ci se présente de cett façon à chaque fois que vous souhaitez rédiger un message:

Formulaire de mise en forme utilisé sur InfoWebMaster

Formulaire de mise en forme sur InfoWebMaster

Vous l'avez peut-être remarqué, il est divisé en plusieurs partie. Tout en haut, vous avez les boutons pour mettre en forme votre message de la façon que vous souhaitez. Juste en dessous il y a la liste des smiley que vous pouvez insérer dans vos messages.

Balises d'effet sur le texte

Mettre en gras

Pour mettre en gras il faut utiliser l'icône suivant: gras .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[b]Texte en gras[/b]

Résultat obtenu:

Texte en gras

Mettre en italique

Pour mettre en italique il faut utiliser l'icône suivant: .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[i]Texte en italique[/i]

Résultat obtenu:

Texte en italique

Souligner

Pour souligner un texte il faut utiliser l'icône suivant: .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[u]Texte souligné[/u]

Résultat obtenu:

Texte souligné

Barrer

Pour barrer un texte il faut utiliser l'icône suivant: barrer .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[s]Texte barré[/s]

Résultat obtenu:

Texte barré

Balises pour ajouter des éléments

Ajouter un lien

Pour jouter un lien il faut utiliser l'icône suivant: Insérer une URL .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[url]http://www.infowebmaster.fr[/url]

Résultat obtenu:

http://www.infowebmaster.fr

Néanmoins avec le code ci-dessus vous ne pouvez que utilisez des adresses internet. Pour personnalisé le texte inclus dans le lien il faut utilisez le code de cette façon:

BBcode:

[url=http://www.infowebmaster.fr]Site pour webmaster[/url]

Résultat obtenu:

Site pour webmaster

Ajouter une image

Pour ajouter un lien il faut utiliser l'icône suivant: Ajouter une photo .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[img]http://www.infowebmaster.fr/img/logo/bouton_infowebmaster_80x15.png[/img]

Résultat obtenu:

Insérer une citation

Pour insérer une citation il faut utiliser l'icône suivant: .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[citation=AUTEUR]Citation diverse[/citation]

Résultat obtenu:

Citation : AUTEUR

Citation diverse

Néanmoins, pour vraiment bien utiliser cette option il faut préciser le nom de l'auteur, comme dans l'exemple ci-dessous:

BBcode:

[citation=Jeff tardif]Qui se rappelle du nom du deuxième homme a avoir mis un pied sur la lune? Personne… Vous devez arriver premier.[/citation]

Résultat obtenu:

Citation : Jeff tardif

Qui se rappelle du nom du deuxième homme a avoir mis un pied sur la lune? Personne… Vous devez arriver premier.

Balises pour aligner le contenu

Centrer

Pour centrer un élément (texte, image,...) il faut utiliser l'icône suivant: centrer .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[centrer]Texte à centrer[/centrer]

Résultat obtenu:

Texte à centrer

Justifier du texte

Pour centrer un élément (texte, image,...) il faut utiliser l'icône suivant: justifier .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[justifier]Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor.[/justifier]

Résultat obtenu:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor.

Aligner à droite

Pour aligner le texte à droite il faut utiliser l'icône suivant: aligner à droite .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[align_droite]Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor.[/align_droite]

Résultat obtenu:

Faire flotter un élément à droite

Pour faire flotter un élément de votre page à droite il faut utiliser l'icône suivant: flotter à droite .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[flotter_droite][img]http://www.infowebmaster.fr/img/logo/bouton_infowebmaster_80x15.png[/img][/flotter_droite]Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor.

Résultat obtenu:

Balises de titre

Titre principale

Pour ajouter un titre principale il faut utiliser l'icône suivant: .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[h2]Titre principale[/h2]

Résultat obtenu:

Titre principale

Sous-titre

Pour ajouter un titre principale il faut utiliser l'icône suivant: titre secondaire .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[h3]Sous-titre[/h3]

Résultat obtenu:

Sous-titre

Sous-titre secondaire

Pour ajouter un titre principale il faut utiliser l'icône suivant: sous-titre .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[h4]Sous-titre secondaire[/h4]

Résultat obtenu:

Sous-titre secondaire

Balises de liste à puces

Liste ordinaire

Pour ajouter un titre principale il faut utiliser l'icône suivant: liste à puce .
Cet icône fait apparaitre le code suivant sous la même forme que le code ci-dessous:

BBcode:

[liste][puce]Puce numéro 1[/puce][/liste]

Résultat obtenu:

Puce numéro 1

Pour ajouter des puces dans cette liste il convient de faire ceci:

BBcode:

[liste]
[puce]Puce numéro 1[/puce]
[puce]Puce numéro 2[/puce]
[puce]Puce numéro 3[/puce]
[/liste]

Résultat obtenu:

Puce numéro 1
Puce numéro 2
Puce numéro 3

Liste numérotée

Pour ajouter un titre principale il faut utiliser l'icône suivant: liste à puce numéroté .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

[point][puce]Puce numéro 1[/puce][/point]

Résultat obtenu:

Puce numéro 1

Pour ajouter d'autres puces il convient d'utiliser un code tel que celui-ci:

BBcode:

[point]
[puce]Puce numéro 1[/puce]
[puce]Puce numéro 2[/puce]
[puce]Puce numéro 3[/puce]
[/point]

Résultat obtenu:

Puce numéro 1
Puce numéro 2
Puce numéro 3

Balises indice et exposant

Mettre en indice

Pour mettre en indice un élément il faut utiliser l'icône suivant: .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

123[sub]2[/sub]

Résultat obtenu:

123₂

Mettre en exposant

Pour mettre en exposant un élément il faut utiliser l'icône suivant: .
Cet icône fait apparaitre le code suivant sur le formulaire:

BBcode:

102[sup]3[/sup]

Résultat obtenu:

102³