09/05/2019
08:04:21
Index du forum Zone HRP Discussions générales

Aide | Tutoriel sur les balises

0
Aide
Tutoriel sur les balises

Ce post sert à expliquer le fonctionnement de toutes les balises de Geokratos, dans l'ordre dans lequel elles s'affichent sur l'outil de création de post, de gauche à droite et de haut en bas.

Les problèmes de balise que l'on peut rencontrer sur le forum sont toujours dû à l'humain : croiser des balises ou les imbriquer les unes dans les autres (en mettant des spoilers dans des spoilers par exemple) ne plaît pas au forum, qui va renvoyer un post illisible. Veillez à bien relire votre post pour vérifier que vous n'avez rien croisé avant de demander aux autres, et à vous coucher pour y réfléchir de nouveau avec un cerveau reposé le lendemain s'il est 3 heures du mat' et que vous n'arrivez plus à comprendre quoi que ce soit.

B La balise grasCette balise se place autour d'un mot, d'une phrase ou d'un paragraphe pour le mettre en gras :

Cette partie est normale, [b]cette partie est en gras[/b].

I La balise italiqueCette balise se place autour d'un mot, d'une phrase ou d'un paragraphe pour le mettre en italique :

Cette partie est normale, [i]cette partie est en italique[/i].

U La balise soulignéCette balise se place autour d'un mot, d'une phrase ou d'un paragraphe pour le souligner :

Cette partie est normale, [u]cette partie est soulignée[/u].

S La balise barréCette balise se place autour d'un mot, d'une phrase ou d'un paragraphe pour le barrer :

Cette partie est normale, [s]cette partie est barrée[/s].

id La balise indiceCette balise se place autour d'un mot, d'une phrase ou d'un paragraphe pour le mettre en indice :

Cette partie est normale, [sub]cette partie est en indice[/sub].

ex La balise exposantCette balise se place autour d'un mot, d'une phrase ou d'un paragraphe pour le mettre en exposant :

Cette partie est normale, [sup]cette partie est en exposant[/sup].

🖼️ La balise imageCette balise sert à placer une image dans un texte, en hébergeant le fichier sur un autre site comme Imgur, Goopics, Postimages, Imgbb... Une fois le fichier uploadé sur l'hébergeur, il faut récupérer le lien direct de l'image (ou, à défaut, faire un clic droit sur l'image et "Copier l'adresse de l'image") et le mettre dans la balise. On peut aussi simplement récupérer des adresses d'images sur Internet, sur Wikipédia par exemple avec cette méthode (le problème est qu'elles peuvent disparaître d'un jour sur l'autre en fonction du site). Les gifs marchent aussi. Il faut aussi ajouter une légende à la balise, ou ça ne s'affichera pas.

Teylembourg
Il y a des différences nettes en fonction des hébergeurs, mais en principe, le lien que vous copiez doit ressembler à peu près à ça : https://i.imgur.com/C1OZc7F.png. Il ne doit pas y avoir de [] ou de <> dedans.

[img=LienDeLhébergeur.com]Légende de l'image qui peut contenir des espaces si on veut.[/img]

▶️ La balise YoutubeCette balise sert à intégrer une vidéo Youtube à votre post, pour un hymne par exemple. Pour ce faire, il faut prendre un lien qui commence de préférence par youtube.com plutôt que par youtu.be (les 2 fonctionnent si on sait correctement s'en servir) et ressemble à ça : https://www.youtube.com/watch?v=dQw4w9WgXcQ ou https://youtu.be/dQw4w9WgXcQ. S'il y a un & ou un ?, il faut le retirer du lien ainsi que tout ce qu'il y a après ou la vidéo ne marchera pas.
si si ça compte comme rickroll 😈

[youtube]https://www.youtube.com/watch?v=dQw4w9WgXcQ[/youtube]

🔗 La balise hyperlienCette balise sert à intégrer un lien sur un post, vers un autre post du forum ou vers un autre site (y compris vers un certain clip de Rick Astley si on veut) ou vers une partie d'un post grâce à la balise ancre. Par défaut, il faut prendre le lien complet, comme https://fr.wikipedia.org/wiki/Rickroll, mais dans le cas d'un lien Geokratos, la fin de l'adresse suffit : https://geokratos.com/?action=viewTopic&t=13598&p=0#m106953 et ?action=viewTopic&t=13598&p=0#m106953 marchent tout aussi bien.
Cette partie est normale, [url=https://geokratos.com/?action=viewTopic&t=13598&p=0#m106953]cette partie de texte pointe vers un post sur GK[/url].

” La balise citationCette balise sert à mettre un texte sous forme de citation :

Cet incroyable bg de Kami a écrit :Je suis modeste, je sais.
Ce que vous mettrez à la place du mot "auteur" dans la balise apparaîtra en gras, suivi de la mention "a écrit :". On peut s'en passer en retirant le "=auteur" pour avoir une citation comme ceci :

Kami est toujours bg et rien ne vous prouve que cette citation vient de lui.
[quote=L'auteur de la citation est mentionné là]Ce texte est dans la citation.[/quote]

[quote]On ne mentionne pas l'auteur de cette citation, RIP la reconnaissance et la célébrité qu'il ne connaîtra jamais.[/quote]

👁️ La balise spoilerC'est la balise que j'utilise depuis le début et qu'on déroule en appuyant sur le [+] et refermez avec le [-]. Tout peut être placé dedans (images, vidéos, mise en forme, liens, diagrammes…). Pas besoin de démonstration supplémentaire, voilà comment on la forme :
[spoiler=Le texte que les gens voient]Le texte que les gens découvrent en cliquant.[/spoiler]

</> La balise codeC'est la balise dont je me sers depuis le début pour montrer comment les balises marchent dans l'éditeur de posts. Pas besoin d'expliquer plus, si ce n'est que toutes les balises mises dedans seront visibles et que la mise en forme placée entre les balises code ne sera pas prise en compte par le forum, qui fera juste apparaître tout ça comme du texte. Le forum a simplement du mal quand on met des balises code dans des balises code, donc je ne peux pas le montrer, mais il suffit comme toujours de surligner le texte à mettre dans ces balises et de cliquer sur le bouton correspondant.
⁝≡ La balise listeCette balise sert à faire des listes comme ceci :
  • avec plusieurs
  • points
  • si on veut

Pour sauter une ligne à sa suite, il faut en sauter 2 ou le texte y sera collé. Le bouton la fait apparaître avec un seul point par défaut, et on peut utiliser la balise puce de liste pour en avoir d'autres.

[list][*]ceci est le premier point de la liste
[*]ceci est le second
[*]et ainsi de suite[/list]

|*| La balise puce de listeCette balise complète la balise liste mentionnée juste au-dessus, et sert à y ajouter des points. Tout est expliqué avec la balise liste.
hr La balise ligne horizontaleCette balise sert à faire apparaître une ligne horizontale, par défaut grise, comme ceci :


On peut les cumuler pour la rendre plus épaisse :


Et surtout les colorer :


Il suffit pour ce faire d'y rentrer le code de la couleur correspondante. Voici les 3 démonstrations sous forme de code :

[hr]

[hr][hr][hr][hr][hr][hr][hr][hr][hr][hr][hr][hr][hr]

[hr=#FF0000]

_a La balise indentation à gaucheCette balise sert à décaler un texte à gauche, comme ceci :
Texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte.
Elle indique par défaut 3 % de décalage à gauche, mais ce chiffre peut être modifié à volonté (100 % ne marche évidemment pas, 0 ne sert à rien et un chiffre à virgule ne marche pas non plus). L'indentation fonctionne aussi pour les lignes horizontales évoquées juste au-dessus :


Ainsi que pour les images, mais si vous utilisez les 2 indentations à la fois pour rétrécir une image sur un post, les %ages seront déséquilibrés pour qu'elle reste centrée. Une indentation de 18 % à gauche et 18 % à droite la décalera vers la droite, il faut pour rester centré à cette valeur faire 18 et 22 %.

[indent=3%]Ce texte est décalé de 3 % à gauche.[/indent]

a_ La balise indentation à droiteCette balise fonctionne exactement comme la précédente, sauf qu'elle décale dans le sens opposé :
Texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte.
[indent-right=3%]Ce texte est décalé de 3 % à droite.[/indent]

💬 La balise infobulleCette balise sert à faire apparaître un texte quand vous passez votre souris sur un mot ou un paragraphe. Essayez en passant la vôtre sur celui-ci : mot. Le texte de l'infobulle ne rapporte pas de point, et rien ne signale l'infobulle au lecteur si l'on ne le prévient pas.

[infobox=Ce texte apparaîtra quand on survolera le texte normal avec la souris.]Ce texte aura l'air normal.[/infobox]

🔒 La balise message secretCette balise permet de rendre invisible un texte à tous ceux qui n'y sont pas autorisés, comme ici :

Message secretInformation secrète réservée aux personnes autorisées
Dommage pour vous, j'y ai écrit une oeuvre capable de concurrencer Molière, Victor Hugo et Jules Verne réunis. Vous ne la lirez jamais.

Pour qu'un joueur puisse la lire, il faut y mettre son ID de joueur, que l'on trouve à la fin du lien de la page de son profil, 5434 pour moi par exemple : https://geokratos.com/?action=viewProfile&m=5434. Attention ! Si vous ne mettez pas votre ID, vous ne pourrez pas lire le contenu de votre propre message secret sur le forum. Pour mettre plusieurs ID, il faut les séparer par des virgules et pas d'espace.

[secret=5434,1,626]Texte secret visible uniquement par moi, Gwen et Mood.[/secret]

🪌 Balise ignoréCette balise permet d'annuler le gain de points de développement sur une partie du texte, comme ici : ce texte ne rapportera rien. Cela sert quand on veut dupliquer un post, copier le texte d'un autre ou les paroles d'une musique... En bref, quand vous voulez insérer un texte qui ne vient pas de vous ou dont vous avez déjà gagné les points ailleurs.

Cette partie rapportera des points en la postant, [ignore]cette partie non[/ignore].

⚫ La balise diagramme FlourishCette balise sert à faire apparaître n'importe quel diagramme Flourish dans vos posts, comme ceci :



Pour ça, il suffit de mettre le numéro du diagramme entre les balises : https://app.flourish.studio/visualisation/28424099/edit :

[flourish]28424099[/flourish]

⚓ La balise ancreCette balise sert à créer un lien qui dirige vers une partie précise d'un post, ce qui est utile s'il fait 10k ou plus pour qu'un index pointe vers des paragraphes au milieu.

Le "Titre1" visible ci-dessous remplacera la dernière partie d'un lien : au lieu de https://geokratos.com/?action=viewTopic&t=13731&p=0#m107880, il sera https://geokratos.com/?action=viewTopic&t=13731&p=0#Titre1 et redirigera ainsi directement vers le titre de paragraphe. Le "Titre1" peut contenir des chiffres, lettres majuscules ou minuscules mais pas d'accent.

[anchor=Titre1]Titre d'un paragraphe[/anchor]

La balise texte aligné à gaucheCette balise sert à aligner un texte, une image ou une vidéo à gauche sur un post, comme ceci :

texte aligné à gauche (oui ça change strictement rien vu que c'est déjà le cas de base)
[left]texte aligné à gauche[/left]

La balise texte centréCette balise sert à centrer un texte, une image ou une vidéo sur un post, comme ceci :

texte centré

[center]texte centré[/center]

La balise texte aligné à droiteCette balise sert à aligner un texte, une image ou une vidéo vers la droite sur un post, comme ceci :

texte aligné à droite
[right]texte aligné à droite[/right]

La balise texte justifiéCette balise sert à justifier un texte sur un post, comme ceci :

Ce texte est justifié, ce qui veut dire qu'il remplit tout l'espace du post en faisant parfois varier la taille des espaces entre les mots, c'est quand même plus agréable à lire que quand c'est pas justifié hein ? Bon je sais pas quoi ajouter pour meubler plusieurs lignes. Hésitez pas à me filer des points pour me remercier de cet incroyable tutoriel 🐀, je serai très heureux de recevoir ce type de remerciements (10k ou plus par exemple).
[justify]texte justifié[/justify]

◼️ La balise grilleCette balise sert à placer des textes, images, vidéos côte à côte dans un post, comme ceci :

Teylembourg---Teylembourg---Teylembourg---Teylembourg

Pour avoir un petit espace entre les cases, comme sur mon exemple, il faut ajouter une petite case avec des caractères colorés en blanc. Je vous mets la mise en forme complète de mon exemple :

[grid][row][cell][img=https://i.imgur.com/BGxIbnY.png]Teylembourg[/img][/cell][cell][color=#FFFFFF]---[/color][/cell][cell][img=https://i.imgur.com/BGxIbnY.png]Teylembourg[/img][/cell][cell][color=#FFFFFF]---[/color][/cell][cell][img=https://i.imgur.com/BGxIbnY.png]Teylembourg[/img][/cell][cell][color=#FFFFFF]---[/color][/cell][cell][img=https://i.imgur.com/BGxIbnY.png]Teylembourg[/img][/cell][/row][/grid]

TailleCette balise permet de faire varier la taille des mots dans un post. La taille par défaut est 1, et les balises vont de 0.5 à 2, mais elles peuvent monter plus haut ou plus bas (la lisibilité risque d'être impactée par contre).

[size=0.5]Cette partie du texte sera très petite[/size], cette partie du texte sera normale, et [size=2]cette partie du texte sera très grande[/size].

CouleurCette balise permet de faire varier la couleur du texte. Il suffit de sélectionner la couleur que l'on souhaite dans l'outil et de l'appliquer grâce à la balise suivante :

[color=#FF0000]Ce texte sera rouge.[/color]
Haut de page