Sujet: LE BB CODE POUR LES NULS Ven 31 Juil 2015, 06:39
LE BBCODE
POUR LES NULS.
Par Araignée du Matin | dite Théa
Hellow mes petits chous en sucre !
(Je tiens à préciser que je ne sais pas si ceci est posté au bon endroit, si ce n'est pas le cas je laisse le soin à ma cookie-staffienne de le déplacer. )
J'ai remarqué que plusieurs nouveaux arrivants ici n'avaient jamais eu affaire au fonctionnement "technique" d'un forum. Par exemple, ne pas savoir comment mettre son texte en italique ou en couleur, comment insérer une image ou encore mettre un spoiler... Je cherchais une façon d'offrir quelque chose à tous les minets peuplant ce forum, alors j'ai décidé de créer ce topic. Ici je vous dévoile les joies du codage très très de base, à savoir le BBcode. En le créant, j'ai moi-même appris des petits trucs intéressants, alors même si vous croyez tout savoir, je vous conseille de lire, juste pour votre culture générale de bon geek
Si une info est mauvaise ou manquante ou que tu crois que je devrais plus approfondir un tel sujet, n'hésite surtout pas à le signaler ! Pour les intéressés, je ferai éventuellement un autre topic pour le codage HTML mais ici je ne parlerai que de BBcode ^^
J'espère que ça vous sera utile, j'y ai mis plusieurs heures
Bonne lecture !
La base de la base
Bon, alors d'abord le BBcode c'est kwa ? Maman thea va te l'expliquer mon chou.
Le BBcode est généralement utilisé sur les forums et sert à donner une forme plus claire et agréable à lire (gras, couleur, alignement), mais de façon simple et accessible à tous. Dans tous les cas, il te faudra utiliser des "balises'. Un exemple ?
[lenomdelabalise]blablabla[/lenomdelabalise]
Il te faudra remplacer " lenomdelabalise" par un code précis (voir plus bas pour ces codes). La 2e balise contient un "/", cela signifie que la balise s'arrête là. Donc si j'écris :
Appelle-moi Théa !
Le code utilisé sera le suivant :
Code:
Appelle-moi [Color=red]Théa[/color] !
Tu comprends ? Super ! T'es pas sur de tout avoir pigé ? Tout va sûrement s'éclaircir lorsque tu liras le reste. Sinon n'hésite pas à m'envoyer un mp ou à poster un commentaire pour que je t'aide !
Le texte
Pour commencer, les effets sur le texte. Lors des RP, peut-être aimerais-tu utiliser un texte en gras , des polices d'écriture différentes ou des Tailles qui varient ? Tu es au bon endroit !
Les formes de texte:
Pour écrire en italique, en gras, pour souligner ton texte ou le rayer d'un trait, tu peux soit cliquer sur les icônes dans la 'tool bar" au-dessus de là où tu écris. Il y a les option i(pour italique), b(pour bold, gras en français), u (pour underlined, sous ligné) ou encore s (pour strike, soit rayé). Lorsque tu ckiqueras sur une de ces options, les balises apparaîtront. Il te faudra alors ecrire entre les balises, comme ceci :
En gras :
Code:
[b] tu écris ici [/b]
En italique :
Code:
[i] tu écris ici [/i]
Sous ligné :
Code:
[u]tu écris ici[/u]
Rayé d'un trait :
Code:
[strike] tu écris ici [/strike]
Il y a aussi quelques codes de ce genre qui ne sont pas proposés dans la tool bar mais qui fonctionnent comme l'effet blur :
Code:
[blur]ton texte ici[/blur]
Pour écrire avec une taille, une couleur ou une police différente, c'est légèrement plus complexe parce qu'il faut preciser.
taille et police du texte:
La taille se définit avec la balise [size], qui signifie taille (ça tombe bien !) mais il faut indiquer de quelle taille on veut le texte. Par exemple si je veux un texte de taille 16, je dois écrire avec le code suivant :
Code:
[size=16]tu écris ici[/size]
Les polices du texte se déterminent avec la balise [font]. Pour écrire avec la police courier new je devrai utiliser le code suivant :
Code:
[font=Courier New]courier new[/font]
Voici les polices pouvant être utilisées sur ce forum : arial black impact arial comic sans ms georgia serif sans-serif times new roman trebuchet ms courier new verdana
Si vous voulez faire un titre ou un sous titre sans vous casser la tête avec les polices à utiliser, vous pouvez utiliser les balises
de titres !
Code:
[h2]très gros titre ici[/h2] [h3]moyen titre ici[/h3] [h4]sous-titre ou petit titre ici[/h4]
Le texte en couleur:
La couleur se détermine avec la balise [color]. Encore une fois ilk te faudra préciser. Il y a deux manières de le faire. D'abord avec le nom (en anglais bien sur) de la couleur, par exemple :
Code:
[color=White]le texte ici sera blanc ![/color]
Malheureusement, cette méthode est restreinte. On ne peut y utiliser que les couleurs suivantes : cyan blue White brown pink yellow orange red olive black purple White indigo grey(il n'y en a pas fifty shades... ROOH ÇA VA, ME TAPEZ PAAAS! )
Cependant, si comme moi tu es quelqu'un de créatif qui aimerait avoir à sa disposition plusieurs teintes de BLEUS ou de VERTS, c'est possible !
Pour ça il faudra encore utiliser la balise [color], mais ce ne sera pas un nom de couleur, mais plutôt une suite de chiffres et de lettres. Je m'explique. Pour écrire en rose comme ceci ou en rose comme cela, j'ai utilisé les codes suivants :
Code:
[color=#ff6699]en rose comme ceci[/color] ou [color=#ff99cc]en rose comme cela[/color]
Il vous faudra donc toujours une série de 6 lettres/chiffres précédés du symbole #. Mais que représentent ces chiffres et lettres ? Eh bien je vous explique :
Chaque couleur crée contient du rouge, du vert et du bleu. Les deux premiers caractères représentent l'intensité du rouge, les 3e et 4e sont l'intensité du vert et les deux derniers du bleu. FF est le plus intense, au contraire de 00 qui signifie qu'il n'y a pas présence de la couleur. Par exemple, #FF0000 donnerait le rouge le plus intense car il y a que du rouge, ni vert ni bleu. Au contraire, #00FF00 serait un vert intense et #0000FF un bleu intense. Pour faire un violet, on pourrait faire #DD00DD qui donnerait une quantité égale de rouge et de bleu, ou alors #BB00EE qui contiendrait plus de bleu que de rouge. Pour avoir une palette de couleurs, cliquez sur le petit carré plein de carrés colorés dans la tool bar.
alignement et listes de texte:
Pour centrer ton texte où le mettre à droite, à gauche, etc.
Code:
[left]à gauche[/left] [center]au centre[/center] [right]à droite, ça c'est bizarre [/right] [justify]équilibré[/justify]
Et finalement tu peux mettre l'accent sur un texte, par exemple un dialogue, avec la balise [list]. Voici ce que ça donne :
"La jeune fille me regardait, de son regard bleu glacé, avant de prononcer ces quelques mots amers :
- "Je ne veux pas te voir ici."
Je ne pouvais partir ainsi. C'était injuste ! Après tout ce que j'avais fait pour eux... "
Voilà le code :
Code:
[list]ton blabla ici[/list]
Clic clic...
Ça va ? Ton cerveau est pas en train de déborder ? Super, parce que j'ai encore pleiiin de choses à mettre dedans.
les liens:
Bon, il est maintenant temps de parler des liens. Vous avez certainement déjà vu sur le forum quelque chose qui ressemble à ça : "Kliiik". Si tu cliques dessus, tu arriveras sur une nouvelle page. Pour faire ça, tu as besoin d'une url. Url veut dire Uruguay Regardant Louisa, mais veux également dire Uniforme Located Ressource, ce qui pourrait se traduire par localisateur uniforme de ressource. Je sais, ça ne te dis pas grand chose. En gros, une URL c'est l'adresse d'une page, du fichier, d'une image sur internet. Par exemple, l'URL de la pâge sur laquelle tu te trouves actuellement est
jouer à cache-cache:
Tu viens de cliquer sur "jouer à cache-cache". Mais derrière ces 4 mots se cache une balise : il s'agit du spoiler. Il permet de faire apparaître un texte caché lorsqu'on clique sur lui !
Code:
[spoiler]tu m'as trouvé ![/spoiler]
On peut modifier la balise spoiler pour que ce ne soit pas "spoiler" qui s'affiche mais bien " clique ici".
Code:
[spoiler=clique ici]tu m'as trouvé ![/spoiler]
Le plus fou, c'est que tu peux mettre un spoiler dans un autre, comme des poupées russes !...
clique!:
clique encore !:
et encoooore !:
je te promets qu'il y a une jolie surprise au bout !:
mais le bout c'est pas ici!:
ni ici !:
tu y es presque !:
encore un clic!:
ou deux...:
OU TROIIIIS MOUAHAHA:
bon,ça va Thea, on a compris le principe là, c'est bientôt fini oui?:
ROOOH du caaaalmeuuuh ! La voilà, la surprise !:
MHHH UN BON BISCUIIIIT !
les images:
Pour aller sur un forum, les images doivent impérativement être en ligne sur les zzzinternets avant, parce que la balise nécessite leur URL. Oui c'est chiant,, mais c'est comme ça...
La balise est la suivante :
Code:
[img]URL DE LIMAGE ICI
Pour obtenir l'URL de ton image, rends toi sur un site "hébergeur d'image", moi j'utilise Hosting pic, sélectionne ton image puis une fois qu'elle est prête, copie colle le " lien forum (2)". Tu obtiendras un code comme ça :
Le reste, ce qui est dans la balise URL, on l'a vu précédemment, c'est un lien. C'est l'hébergeur quii le met par défaut. Tu peux le retirer et ça fonctionne quand même.
Dans les deux cas, j'obtiens cette fabuleuse image :
intéragir avec les autres membres:
Faire apparaître le nom de l'utilisateur .. À venir ! Pour faire une citation, rien de plus simple :
Code:
[quote= citation de telle personne]Texte cité ici[/quote]
(c) Codage By Thea.
Nuit Miraculeuse Guerrier(e) sans Apprenti
Messages ; : 30 Humeur ; : Ben, normale.
Feuille de Personnage Sexe: Femelle Relations :
Sujet: Re: LE BB CODE POUR LES NULS Mer 15 Fév 2017, 14:30
Hey, bonne idée que tu as eu, ça va aider les débutant. mais tu sais faire ça ?
Spoiler:
tadaa ! non, je me la pète pas !
Cœur de Diamant #Retraité(e)
Messages ; : 55 Humeur ; : happy, happy, haaappy!
Feuille de Personnage Sexe: Femelle Relations :
Sujet: Re: LE BB CODE POUR LES NULS Mer 15 Fév 2017, 14:48
Moi je sais pas par coeur le faire, il me faut un tuto pour faire du codage ;)
Forum optimisé pour Mozilla Firefox et pour une resolution de 1280*800 px.
Accueil
)
ROOH ÇA VA, ME TAPEZ PAAAS! )
