[Tutorial] Créer un message avec style et mise en forme

Message par **YannLP** » 26 août 2006, 14:11

##############################################################################
# Tutorial : Créer un message avec style et mise en forme. #
##############################################################################

Introduction

Qu'est-ce que le BBCode ?

Le BBCode est une implémentation spéciale du HTML. L'activation de l'utilisation du BBCode est déterminée par l'administrateur. En outre, vous pouvez désactiver le BBCode dans un message lors de sa composition. Le BBCode en lui-même est similaire au style du HTML; les balises sont contenues dans des crochets [ et ] à la place de < et >, et offrent un meilleur contrôle sur la manière dont quelque chose doit être affiché. Selon le modèle de document que vous utilisez, vous pourrez facilement rajouter du BBCode à vos messages à travers une interface de boutons cliquables au-dessus de la zone de texte lors de la composition de votre message. Toutefois, le guide qui suit pourra vous être utile.
Mise en forme du Texte

Créer du texte en gras, italique et souligné

Le BBCode comprend des balises qui vous permettent de changer rapidement le style de votre texte. Cela se réalise des manières suivantes :
- Pour rendre une partie de texte en gras, placez-le dans ; exemple :
  Code : Tout sélectionner
```
[b]Salut[/b]
```
  donnera Salut
- Pour souligner un texte, utilisez ; par exemple :
  Code : Tout sélectionner
```
[u]Bonjour[/u]
```
  donnera Bonjour
- Pour mettre un texte en italique, utilisez ; exemple :
  Code : Tout sélectionner
```
C'est [i]Super![/i]
```
  donnera C'est Super!
Changer la taille ou la couleur du texte

Pour changer la couleur ou la taille de votre texte, les balises suivantes peuvent êtres utilisées. Ayez en tête que le rendement du texte dépendra de votre navigateur internet et de votre système d'exploitation :
- Le changement de la couleur du texte se réalise en le plaçant dans [color=][/color]. Vous pouvez spécifier soit un nom de couleur reconnu (exemple : red, blue, yellow, etc.), ou soit un code couleur hexadecimal, exemple : #FFFFFF, #000000. Par exemple, pour créer du texte en rouge, vous pouvez utiliser :
  Code : Tout sélectionner
```
[color=red]Salut ![/color]
```
  ou
  Code : Tout sélectionner
```
[color=#FF0000]Salut ![/color]
```
  donneront tous deux Salut !
- Le changement de la taille de votre texte se réalise de la même manière que pour la couleur en utilisant [size=][/size]. Cette balise est dépendante du modèle de document que vous utilisez, mais le format recommandé est une valeur numérique représentant la taille du texte en pixels, de 1 (tellement petit que vous le verrez pas) jusqu'à 29 (très grand). Par exemple :
  Code : Tout sélectionner
```
[size=9]PETIT[/size]
```
  donnera PETIT
  
  alors que :
  Code : Tout sélectionner
```
[size=24]ENORME ![/size]
```
  donnera ENORME !
Puis-je combiner les balises de mise en forme ?

Oui, bien sûr que vous pouvez, par exemple pour attirer l'attention de quelqu'un, vous devriez écrire :
Code : Tout sélectionner
```
[size=18][color=red][b]REGARDEZ MOI ![/b][/color][/size]
```
devrait donner REGARDEZ MOI !

Néanmoins, nous ne vous recommandons pas d'écrire beaucoup de texte comme ci-dessus ! Rappelez-vous que c'est à vous de vous assurer de fermer les balises correctement. Par exemple, ce qui suit est incorrect :
Code : Tout sélectionner
```
[b][u]Ceci est incorrect[/b][/u]
```
Citation et texte à pas fixe

Citation dans les réponses

Il y a deux méthodes pour citer un texte, avec ou sans référence.
Lorsque vous utilisez la fonction Citer pour répondre à un message sur le forum, vous avez sûrement remarqué que le texte en citation est ajouté dans la zone de texte entre
Code : Tout sélectionner
```
[quote=""]
```
et
Code : Tout sélectionner
```
[/quote]
```
Cette méthode vous permet de citer avec une référence à une personne ou tout autre chose que vous aurez choisi de mettre ! Par exemple, pour citer un texte écrit par M. Dupont, vous devrez entrer :
Code : Tout sélectionner
```
[quote="M. Dupont"]Le texte écrit par M. Dupont devra être placé ici[/quote]
```
Cela ajoutera automatiquement,
M. Dupont a écrit :
avant votre texte. Rappelez-vous que vous devez inclure les guillemets "" autour de la référence que vous citez, ils ne sont pas optionnels.
La seconde méthode vous permet de citer quelque chose sans faire référence à l'auteur. Pour l'utiliser, placez le texte entre les balises
Code : Tout sélectionner
```
[quote]
```
et
Code : Tout sélectionner
```
[/quote]. 
```
Lorsque vous lirez votre message, il montrera simplement
avant votre texte.

Code ou police à pas fixe

Si vous voulez afficher des lignes de code ou toute chose qui nécessite une police à pas fixe, exemple : Police Courrier, vous devez placer le texte ou code dans les balises. Exemple :
Code : Tout sélectionner
```
[code]echo "Ceci est du code";
```
[/code]
Toute mise en forme utilisée dans les balises sera appliquée.
Code : Tout sélectionner
```
echo "Ceci est du code";
```
Création de Listes

Créer une liste non-ordonnée

Le BBCode supporte deux types de listes : les listes non-ordonnées et les listes ordonnées. Elles sont essentiellement identiques à leurs équivalents en HTML. Une liste non-ordonnée produit une liste dont les entrées sont les unes en-dessous des autres et indentées avec une puce. Pour créer une liste non-ordonnée, utilisez
Code : Tout sélectionner
```
[list][/list]
```
et définissez chaque entrée à l'intérieur de la liste en utilisant
Code : Tout sélectionner
```
[*]
```
Par exemple, pour établir une liste de vos couleurs favorites, vous pouvez utiliser :
Code : Tout sélectionner
```
[list]
[*]Rouge
[*]Bleu
[*]Jaune
[/list]
```
Cela donnera la liste suivante :
- Rouge
- Bleu
- Jaune
Créer une liste ordonnée

Le second type de liste vous donne le contrôle sur ce qui va être affiché avant chaque entrée. Pour créer une liste ordonnée, vous devez utiliser
Code : Tout sélectionner
```
[list=1][/list]
```
pour créer une liste numérotée ou alternativement
Code : Tout sélectionner
```
[list=a][/list]
```
pour une liste alphabétique. Comme pour les listes non-ordonnées, les entrées sont spécifiées en utilisant
Code : Tout sélectionner
```
[*]
```
Par exemple :
Code : Tout sélectionner
```
[list=1]
[*]Faire les magasins
[*]Acheter un nouvel ordinateur
[*]Injurier son ordinateur lorsqu'il plante
[/list]
```
donnera ce qui suit :
1. Faire les magasins
2. Acheter un nouvel ordinateur
3. Injurier son ordinateur lorsqu'il plante
Alors que pour une liste alphabétique, vous devez utiliser :
Code : Tout sélectionner
```
[list=a]
[*]La première réponse possible
[*]La seconde réponse possible
[*]La troisième réponse possible
[/list]
```
donnera :
1. La première réponse possible
2. La seconde réponse possible
3. La troisième réponse possible
Création de Liens

Créer un lien vers un autre site

Le BBCode de phpBB supporte plusieurs méthodes pour créer des liens, plus connus sous le sigle URLs.
La première méthode utilise les balises
Code : Tout sélectionner
```
[url=][/url]
```
tout ce que vous taperez après le signe = sera considéré comme le nom du lien. Par exemple, pour créer un lien vers phpBB.com vous devez utiliser :
Code : Tout sélectionner
```
[url=http://www.joachimgarraud.com/forum/]Visitez le forum ![/url]
```
Ceci générera le lien suivant : Visitez le forum !. Vous remarquerez que le lien ouvre une nouvelle fenêtre ; l'utilisateur peut donc continuer à parcourir les forums s'il le souhaite.
Si vous voulez que le lien affiche directement l'URL, vous devez simplement utiliser :
Code : Tout sélectionner
```
[url]http://www.joachimgarraud.com/forum/[/url]
```
Ceci donnera le lien suivant : http://www.joachimgarraud.com/forum/
De plus, phpBB possède une fonctionnalité appelé Magic Links; celle-ci convertira automatiquement une URL en un lien cliquable sans que vous ayez à insérer une balise BBCode ou http://. Par exemple, en tapant l'url http://www.joachimgarraud.com dans votre message, celui-ci sera automatiquement convertit en lien http://www.joachimgarraud.com lorsque vous le lirez.
La même chose s'applique aux adresses e-mail; vous pouvez soit spécifier une adresse e-mail explicitement, par exemple :
Code : Tout sélectionner
```
[email]personne@domaine.com[/email]
```
qui donnera personne@domaine.com, ou soit en tapant personne@domaine.com dans votre message et sera automatiquement convertit lorsque vous le lirez.
Comme pour toutes les balises BBCode, encadrez tout autre balise comme (reportez-vous à la partie suivante), etc. Comme pour les balises de mise en forme, c'est à vous de vous assurer que l'ordre des balises d'ouverture et de fermeture est correct, par exemple :
Code : Tout sélectionner
```
[url=http://www.joachimgarraud.com/forum/][img]http://www.joachimgarraud.com/forum/templates/subBlack/images/logo_phpBB.gif[/url][/img]
```
n'est pas correct : Attention à l'ordre des fermeture de balises !
Affichage d'images dans les messages

Ajouter une image à un message

Le BBCode de phpBB inclut une balise pour incorporer des images à vos messages. Deux points importants à retenir lors de l'utilisation de cette balise sont que premièrement, beaucoup d'utilisateurs n'apprécient guères un trop plein d'images dans un message et que secondement, l'image que vous voulez afficher doit déjà être disponible sur internet (elle ne peut pas seulement exister sur votre ordinateur par exemple, à moins que votre ordinateur soit lui-même un serveur internet !). Il n'y a actuellement aucun moyen de stocker localement des images avec phpBB (ce problème sera traité dans la prochaine version de phpBB). Pour afficher une image, vous devez encadrer l'URL qui pointe vers l'image avec les balises . Par exemple :
Code : Tout sélectionner
```
[img]http://www.joachimgarraud.com/forum/templates/subBlack/images/logo_phpBB.gif[/img]
```
donnera :

Comme noté ci-dessus dans la section Création de Liens, vous pouvez placer une image dans les balises si vous le souhaitez. Exemple :
Code : Tout sélectionner
```
[url=http://www.joachimgarraud.com/forum/][img]http://www.joachimgarraud.com/forum/templates/subBlack/images/logo_phpBB.gif[/img][/url]
```
donnera l'image cliquable (ouverture du lien lors du click) suivante :

Avec ça je compte sur vous pour rendre le forum encore plus beau

Yann.

D'après les écrits de phpbb-fr.com

Message par **YannLP** » 26 août 2006, 14:49

Les commentaires peuvent se faire ICI

Et des commentaires avec du style hein

Yann.