Partagez
Aller en bas
avatar
Fiu
Agent d'entretien
  Agent d'entretien
Masculin
Nombre de messages : 434
Age : 935
Nom de la BF : BFA
Ville (Dép, n°) : RN (80)
Instru(s) / Activité BF : Tuba / Jedi
Date d'inscription : 06/05/2014
http://www.batteriefanfare.com

TUTO Tuto : Créer un tableau

le Mar 12 Juin 2018 - 0:05
Nous avons préformaté le rendu des tableaux pour qu'ils puissent enfin être utilisés sur ce forum. Nous allons voir ensemble comment créer votre tableau dans un post, que ce soit à la création d'un sujet ou lors d'une réponse.

Créer un tableau

Préparatifs

Le mieux est de préparer au brouillon votre tableau, grosso modo "à la volée", pour gagner du temps : connaître le nombre de colonnes et lignes, surtout de colonnes, est idéal avant la réalisation.

On est prêt

Vous connaissez ce que vous voulez faire, ici présenter aux copains un tableau récapitulatif des tonalités.
Il vous faut 15 lignes, une colonne pour les majeures, une pour l'armure, une colonne pour les relatives mineures. Donc 15 lignes sur 3 colonnes. Mais n'oublions pas l'entête des colonnes qui se trouvera sur la 1ère ligne : donc ça fait +1 ligne, soit créer un tableau de 16 lignes sur 3 colonnes.
Astuce : à chaque tableau créé, il faudra toujours compter 1 ligne en + pour l'entête

On ouvre son sujet (ou une "réponse normale")

Et, après avoir renseigné votre titre de post et éventuellement sa description et/ou quelques mots/lignes d'intro, vous arrivez à l'endroit du post où vous souhaitez faire apparaître votre beau tableau.

a. Vérifiez d'être en mode WYSIWYG et non en mode bbcode

C'est-à-dire que le bouton correspondant tout à la fin à droite de l'éditeur ("basculer le mode d'édition") ne soit pas activé :

[Vous devez être inscrit et connecté pour voir cette image]

Si vous êtes dans le bon mode, vous pouvez insérer votre tableau. Vous trouverez le bouton d'insertion de tableau dans la zone d'édition juste avant celui d'hébergement d'image :

[Vous devez être inscrit et connecté pour voir cette image]

Une petite fenêtre s'ouvre, et vous y renseigner la bordure (mettre à 0), le nombre de lignes et colonnes. Dans notre exemple, ce sera donc 0, 16, 3 :

[Vous devez être inscrit et connecté pour voir cette image]

Et on se retrouve avec un drôle d'engin qui ressemble à une "tour"! C'est le tableau qui est compressé, en fait, son squelette. Dans chaque case vous devrez inscrire votre contenu :

[Vous devez être inscrit et connecté pour voir cette image]

Allez, c'est parti pour taper votre contenu (ou le "coller" si vous l'avez préparé dans un fichier txt...)
Astuce : vous pouvez passer d'une case à l'autre avec les flèches du clavier

[Vous devez être inscrit et connecté pour voir cette image]

Insertion du titre

(Re)baculez en mode bbcode

Une fois fini, vous rebasculerez en mode d'édition bbcode (en activant le bouton tout en bas à droite, cf plus haut),

[Vous devez être inscrit et connecté pour voir cette image]

et là vous verrez le corps de votre message avec les balises bbcode du type [bal][/bal], etc.

Vous allez jusqu'à l'endroit du tableau, qui en bbcode s’écrit avec des balises [ table ], [ tr ] , [ td ].
(qui correspondent à : table : tableau / tr : ligne / td : cellule (ou "case") )
Le début du tableau sera précisément cette séquence :

Code:
[table]
[tr][td]Gamme Majeure[/td]
[td]Armure[/td]
[td]Gamme mineure relative[/td]
[/tr]
etc ...

Ce premier groupe compris entre les balises [ tr ] [ /tr ], juste après [ table ], c'est la première ligne, l'entête. Etc.
C'est juste au dessus de [ table ] que nous allons écrire notre grand titre de tableau. Mettez une ou deux lignes d'espace entre votre éventuel texte précédant le tableau et le début de celui-ci, qui commencera à cet endroit précis du grand titre.
Écrivez votre titre, dans notre exemple "Les tonalités", surlignez-le avec votre curseur de souris, et cliquez sur le bouton d'éditeur "H" pour choisir "H2" :

[Vous devez être inscrit et connecté pour voir cette image]

Vous obtenez alors :
Code:
[h2]Les tonalités[/h2]
[table]
[tr][td]Gamme Majeure[/td]
[td]Armure[/td]
[td]Gamme mineure relative[/td]
[/tr]
etc ...

Presque fini, derniers petits ajustements si besoin

Peaufinez maintenant le contenu, par exemple les cellules dont vous souhaitez centrer le texte, etc. Les balises standard fonctionnent sans problème, ex : [ b ] [ /b ] pour mettre en gras, [ center ] [ /center ], etc., surligner les textes et utiliser vos boutons d'édition pour ne pas avoir à taper à la main ces balises...

Vous pouvez sous le tableau ( sous la dernière balise tableau qui est pour rappel [ /table ] ), ajouter du texte... etc. Finir votre post si besoin.

[avert]Avant de prévisualiser, copiez tout le contenu de votre message.
Ctrl+A pour tout sélectionner ; Ctrl+C pour copier (ou clic droit "copier")
Et ouvrez votre bloc note par exemple sur windows pour temporairement sauvegarder tout ce travail en cas de pépin. Car si vous avez oublié une balise ou tronqué ou rajouté une, à la prévisualisation ou à l'envoi, le "logiciel" du forum risque par calcul d'appliquer un traitement pour "sauver les meubles" et foutre le bazar dans votre labeur !
A ce moment-là, en cas de pépin, justement, n'hésitez pas à demander de l'aide en postant dans la rubrique d'aide (et enregistrez dans votre pc le fichier .txt qui vous a servi a déposer par sécurité votre code global (on en aura besoin).[/avert]

Le résultat de votre travail !

Le code du tableau :

Code:
[h2]Les tonalités[/h2]
[table][tr][td]Gamme Majeure [/td]
[td]Armure[/td]
[td]Gamme mineure relative[/td]
[/tr]

[tr][td]Do Majeur[/td]
[td]/[/td]
[td]La mineur[/td]
[/tr]

[tr][td]Sol Majeur[/td]
[td]1 dièse[/td]
[td]Mi mineur[/td]
[/tr]

[tr][td]Ré Majeur[/td]
[td]2 dièses[/td]
[td]Si mineur[/td]
[/tr]

[tr][td]La Majeur[/td]
[td]3 dièses[/td]
[td]Fa# mineur[/td]
[/tr]

[tr style=][td]Mi Majeur[/td]
[td]4 dièses[/td]
[td]Do# mineur[/td]
[/tr]

[tr ][td]Si Majeur[/td]
[td]5 dièses[/td]
[td]Sol# mineur[/td]
[/tr]

[tr][td]Fa# Majeur[/td]
[td]6 dièses[/td]
[td]Ré# mineur[/td]
[/tr]

[tr][td]Do# Majeur[/td]
[td]7 dièses[/td]
[td]La# mineur[/td]
[/tr]

[tr][td]Fa Majeur[/td]
[td]1 bémol[/td]
[td]Ré mineur[/td]
[/tr]

[tr][td]Sib Majeur[/td]
[td]2 bémols[/td]
[td]Sol mineur[/td]
[/tr]

[tr][td]Mib Majeur[/td]
[td]3 bémols[/td]
[td]Do mineur[/td]
[/tr]

[tr][td]Lab Majeur[/td]
[td]4 bémols[/td]
[td]Fa mineur[/td]
[/tr]

[tr][td]Reb Majeur[/td]
[td]5 bémols[/td]
[td]Sib mineur[/td]
[/tr]

[tr][td]Solb Majeur[/td]
[td]6 bémols[/td]
[td]Mib mineur[/td]
[/tr]

[tr][td]Dob Majeur[/td]
[td]7 bémols[/td]
[td]Lab mineur[/td]
[/tr]
[/table]

Le rendu final


Les tonalités

Gamme Majeure ArmureGamme mineure relative
Do Majeur/La mineur
Sol Majeur1 dièseMi mineur
Ré Majeur2 dièsesSi mineur
La Majeur3 dièsesFa# mineur
Mi Majeur4 dièsesDo# mineur
Si Majeur5 dièsesSol# mineur
Fa# Majeur6 dièsesRé# mineur
Do# Majeur7 dièsesLa# mineur
Fa Majeur1 bémolRé mineur
Sib Majeur2 bémolsSol mineur
Mib Majeur3 bémolsDo mineur
Lab Majeur4 bémolsFa mineur
Reb Majeur5 bémolsSib mineur
Solb Majeur6 bémolsMib mineur
Dob Majeur7 bémolsLab mineur
Revenir en haut
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum