[Forum] Un peu de HTML...

LéLé00352 (FR1)LéLé00352 (FR1) Messages: 1,973
17.06.2016 modifié dans FAQs, astuces et stratégies
Bonjour à tous,

Avec le nouveau forum est apparu un nouveau code pour écrire les messages. En effet, l'ancien forum utilisait le BBcode, et ce nouveau le HTML. Je ne vais pas vous décrire tout le code HTML, ça prendrait trèèèès longtemps et ça ne servirait à rien, mais je vais vous expliquer quelques bases afin que vous puissiez vous retrouvez sur ce nouveau forum :)

Tout d'abord, le code HTML n'est utilisé que si on le rentre dans le mode HTML ( pour ça, vous avez un petit bouton </> en haut à droite de votre zone de texte. Le fait d'écrire du HTML dans la zone de texte habituelle ne servira à rien.

Le code HTML ( Hypertext Markup Language ) est est le format de données conçu pour représenter les pages web. Il se compose de balises, et la plupart de ces balises fonctionnent par paire : un balise ouvrante et une balise fermante. Ces balises se composent de la sorte :

balise ouvrante : <nom de la balise>                        balise fermante : </nom de la balise>

Le texte situé entre ces deux balises sera alors modifié suivant le nom de la balise.

Voici maintenant un liste non exhaustive de différentes balises et les effets qu'elles produisent.


Balise B : Cette balise permet de mettre du texte en gras.
Ecriture : <b>Ce texte est en gras</b>
Résultat : Ce texte est en gras

Balise I : Cette balise permet de mettre du texte en italique.
Ecriture : <i>Ce texte est en italique</i>
Résultat : Ce texte est en italique

Balise U : Cette balise permet de souligner du texte.
Ecriture : <u>Ce texte est souligné</u>
Résultat : Ce texte est souligné

Balise STRIKE : Cette balise permet de barrer du texte.
Ecriture : <strike>Ce texte est barré</strike>
Résultat : Ce texte est barré

Balise H1 : Cette balise permet de mettre un texte en titre important.
Ecriture : <h1>Ce texte est un titre important</h1>
Résultat :

Ce texte est un titre important


Note : cette balise peut ne pas fonctionner correctement sans explication...

Balise H2 : Cette balise permet de mettre un texte en titre moins important que la balise h1.
Ecriture : <h2>Ce texte est un titre moins important</h2>
Résultat :

Ce texte est un titre moins important


Note : cette balise peut ne pas fonctionner correctement sans explication...

Balise BLOCKQUOTE : Cette balise permet de mettre un texte en retrait afin de le citer.
Ecriture : <blockquote>Ce texte est cité</blockquote>
Résultat :
Ce texte est cité

Note : Le bouton "Citer" du forum utilise un attribut afin d'augmenter la lisibilité de la citation. l'écriture est alors <blockquote class="Quote">Ce texte est cité</blockquote> et le résultat est
Ce texte est cité


Balise A : Cette balise permet de créer un lien.
Ecriture : <a>http://empire.goodgamestudios.com/?country=FR</a&gt;
<a href="http://empire.goodgamestudios.com/?country=FR">Lien du jeu Goodgame empire</a>
Résultat : http://empire.goodgamestudios.com/?country=FR
Lien du jeu Goodgame empire

Balise IMG : Cette balise permet de poster une image.
Ecriture : <img src="http://zupimages.net/up/15/40/89fs.png" />
Résultat :

Balise OL et LI : La balise OL permet de créer une liste ordonnée, la balise LI doit être utilisée lors de chaque retour à la ligne afin de créer les puces.
Ecriture : <ol> <li>bonjour <li>au revoir </ol>
Résultat :
  1. bonjour
  2. au revoir


Balise UL et LI : La balise UL permet de créer une liste non ordonnée, la balise LI doit être utilisée lors de chaque retour à la ligne afin de créer les puces.
Ecriture : <ul> <li>bonjour <li>au revoir </ul>
Résultat :
  • bonjour
  • au revoir


Balise BR : Cette balise permet de revenir à la ligne.
Ecriture : bonjour<br><br>au revoir
Résultat : bonjour

au revoir

Balise HR : Cette balise permet de créer une ligne horizontale afin de séparer plusiqurs parties d'un texte.
Ecriture : bonjour<hr>au revoir
Résultat : bonjour
au revoir

Balise FONT : Cette balise permet de modifier la couleur d'un texte, sa taille ou sa police.
Ecriture : <font color="#FF0000">Ce texte est en rouge</font>
<font size="5">Ce texte est plus grand</font>
<font face="impact">Ce texte est dans une autre police</font>
<font color="#FF0000", size="5", face="impact">Ce texte est en rouge, plus gros et dans une autre police</font>
Résultat : Ce texte est en rouge
Ce texte est plus grand
Ce texte est dans une autre police
Ce texte est en rouge, plus gros et dans une autre police

Note : Les couleurs se choisissent en fonction de leur nom en hexadécimal. La liste des couleurs en hexadécimal est disponible ici
Note : Les tailles de police peuvent varier entre 1 et 7, 1 étant la police la plus petite et 7 la plus grande. La taille d'écriture habituelle sur le forum correspond a une taille de police située entre 2 et 3.


Note finale : Sur le forum, certaines balises peuvent ne pas fonctionner normalement, être supprimées à chaque édition de message ou être remplacées par d'autres balises équivalentes.

Je termine ici cette liste qui devrait vous permettre de pouvoir écrire beaucoup de choses. Si cependant vous souhaitez qu'une balise non mentionnée apparaisse, ne vous genez surtout pas et postez le ! :) Idem si vous avez des questions ou si je me suis trompé quelque part !

Bonne utilisation du nouveau forum !


LéLé00352

TUTO Les soldats                          TUTO Les engins
FORUM Un peu de HTML                TUTO Les équipements

Atra esterni ono thelduin
Post edited by - Raisin - on
«1

Réponses

  • Très très bien !! Féliciations
    EDIT de la modération : signature beaucoup trop grande, merci d'en adopter une plus petite.
  • LéLé00352 (FR1)LéLé00352 (FR1) Messages: 1,973
    Merci beaucoup super étendard !

    TUTO Les soldats                          TUTO Les engins
    FORUM Un peu de HTML                TUTO Les équipements

    Atra esterni ono thelduin
  • gagla (FR1)gagla (FR1) Messages: 4,168
    Merci beaucoup Lélé pour ce tuto :)

    Je rajouterai, conséquence directe de ce système, que pour "réparer" des balises ne fonctionnant plus (comme notamment des tableaux) il suffit donc de sélectionner le contenu du message, de le copier, puis de modifier le message, de supprimer tout son contenu, de basculer en html puis de coller, et d'enregistrer.
  • LéLé00352 (FR1)LéLé00352 (FR1) Messages: 1,973

    Merci gagla

    par contre ce que tu mets après ne marche pas, parce que ce n'est pas les mêmes balises... Ou alors j'ai mal compris ?


    TUTO Les soldats                          TUTO Les engins
    FORUM Un peu de HTML                TUTO Les équipements

    Atra esterni ono thelduin
  • gagla (FR1)gagla (FR1) Messages: 4,168

    Merci gagla

    par contre ce que tu mets après ne marche pas, parce que ce n'est pas les mêmes balises... Ou alors j'ai mal compris ?

    Regarde par exemple les anciens tableaux de ce listing
    En tout cas ça marche pour les tableaux :)
  • LéLé00352 (FR1)LéLé00352 (FR1) Messages: 1,973

    ça marche pour ces tableaux-là parce que leur texte est déjà en html... Mais par exemple les tableaux de mon tuto sur les soldats n'étaient plus des tableaux, ils étaient fait de retour à la ligne et de truc comme ça...

    Donc j'ai du tout refaire :(


    TUTO Les soldats                          TUTO Les engins
    FORUM Un peu de HTML                TUTO Les équipements

    Atra esterni ono thelduin
  • Hacstone (INT1)Hacstone (INT1) Messages: 1,230INT1
    09.11.2015 modifié
    cool tuto pas bcp de up... big up
    httpiimgurcomfb5phmJpng
  • LéLé00352 (FR1)LéLé00352 (FR1) Messages: 1,973
    cool tuto
    Merci !

    TUTO Les soldats                          TUTO Les engins
    FORUM Un peu de HTML                TUTO Les équipements

    Atra esterni ono thelduin
  • Acuité (FR1)Acuité (FR1) Messages: 583FR1
    merci beaucoup pour ce superbe tuto
    bisous :)

    merci Heu4 pour cette magnifique signature
  • DarkJicé (FR1)DarkJicé (FR1) Messages: 729
    Coooooool !!!!!!!! si ça marche, c'est top moumoute !!!!
    Hebergeur dimage
  • Hacstone (INT1)Hacstone (INT1) Messages: 1,230INT1
    04.12.2015 modifié
    un p'tit up, c'est bien, ca :)
    allé je vais faire p'tit essai:

    final edit: bon ca marche mais ca s'efface quand on modifie le post...
    re edit c'était pour poster une image
    httpiimgurcomfb5phmJpng
  • LéLé00352 (FR1)LéLé00352 (FR1) Messages: 1,973

    Oui, des fois je sais pas pourquoi, ça s'efface quand on modifie, par exemple pour les tableaux ou les couleurs...

    La seule solution que j'ai trouvée est de copier le texte en html sur un document texte et de le coller chaque fois qu'on modifie le message...

    Coooooool !!!!!!!! si ça marche, c'est top moumoute !!!!
    c'est bien, ca :)

    Merci beaucoup sinon !


    TUTO Les soldats                          TUTO Les engins
    FORUM Un peu de HTML                TUTO Les équipements

    Atra esterni ono thelduin
  • xgafx (FR1)xgafx (FR1) Messages: 1,018FR1
    tuto tres interressant et tres bien fait , bravo

    mais quel interet puisqu'on a les "boutons" en haut de la fenetre qui permettent de faire la meme chose?

    desolé si vous trouvez la question idiote mais elle est serieuse , meme si ca n'enleve rien a la qualité su tuto
    xgafx @ fr 1
  • LéLé00352 (FR1)LéLé00352 (FR1) Messages: 1,973

    Pour certaines fonctions, par exemple mettre en gras, le fait de ne pas savoir écrire en html ne pénalise pas, puisqu'il y a les boutons en haut. Mais ! ça ne veut pas dire que ça ne sert à rien !! En effet, si tu veux modifier quelque chose que tu ne peux pas faire avec les boutons ( par exemple souligner, mettre en couleur, etc ), et que tu passes en html, le fait d'avoir lu ce tuto te permet de savoir ce que signifie les trucs avec des b autour de ton texte ! Donc, quand il y a les boutons, ça ne sert pas à grand chose, mais un peu quand même ;)


    TUTO Les soldats                          TUTO Les engins
    FORUM Un peu de HTML                TUTO Les équipements

    Atra esterni ono thelduin
  • jeremi06 (FR1)jeremi06 (FR1) Messages: 283
    30.12.2015 modifié
    Comment activer les balises ?

    Post edited by jeremi06 (FR1) on
  • jeremi06 (FR1)jeremi06 (FR1) Messages: 283
    30.12.2015 modifié
    je sais maintenant.
    merci
  • freya one (FR1)freya one (FR1) Messages: 490
    Félicitations pour ce beau travail
    Cordialement Freya
  • darkrose (FR1)darkrose (FR1) Messages: 1,316FR1
    12.06.2016 modifié
    xgafx (FR1) a dit :
    tuto tres interressant et tres bien fait , bravo

    mais quel interet puisqu'on a les "boutons" en haut de la fenetre qui permettent de faire la meme chose?

    desolé si vous trouvez la question idiote mais elle est serieuse , meme si ca n'enleve rien a la qualité su tuto
    briseur de rèves....c moche, ;-D
    click la ici fais toi plaisir tu verras c bo
  • LéLé00352 (FR1)LéLé00352 (FR1) Messages: 1,973

    Merci freya !

    ( et mdrr dark ^^ )


    TUTO Les soldats                          TUTO Les engins
    FORUM Un peu de HTML                TUTO Les équipements

    Atra esterni ono thelduin
  • Thibaut400 (ASIA1)Thibaut400 (ASIA1) Messages: 4,095
    18.07.2016 modifié
    Génial, j'avais besoin de quelques-unes de ces méthodes pour mon prochain projet sur le forum, merci beaucoup^^
Sign In to comment.