Mettre en forme un message quand on poste

1 message   •   Page 1 sur 1
Mammouth du PHP | 19672 Messages

12 févr. 2006, 20:56

Poster un message sur le forum peut être fait de façon à ce qu'il soit visuellement bien structuré et clair. Si vous regardez le formulaire lorsque vous postez un message, vous pourrez noter la présence d'une rangée de boutons. Voici la liste et la manière de les utiliser:
La méthode est la même pour chaque bouton : Vous pouvez cliquer une première fois sur le bouton, saisir le texte à mettre en forme, puis cliquer une seconde fois pour fermer la balise, ou bien, saisir votre texte, le sélectionner et cliquer une fois sur le bouton de façon à ce que les balises, ouvrante + fermante, soient ajoutées.
  • [B] : Mise en gras. Raccourci clavier : [Alt] + [B].
    Vous verrez dans la zone de texte la partie affectée sous cette forme:
    [b]votre texte en gras[/b] suivi d'un texte normal
    L'affichage donnera donc
    votre texte en gras suivi d'un texte normal
  • [i] : Mise en italique. Raccourci clavier : [Alt] + [I].
    Vous verrez dans la zone de texte la partie affectée sous cette forme:
    [i]votre texte en italique[/i] suivi d'un texte normal
    L'affichage donnera donc
    votre texte en italique suivi d'un texte normal
  • [u] : Souligner. Raccourci clavier : [Alt] + [U].
    Vous verrez dans la zone de texte la partie affectée sous cette forme:
    [u]votre texte souligné[/u] suivi d'un texte normal
    L'affichage donnera donc
    votre texte souligné suivi d'un texte normal
  • [Quote] : Bloc de citation. Raccourci clavier : [Alt] + [Q].
    Vous verrez dans la zone de texte la partie affectée sous cette forme:
    [quote]votre texte normal suivi d'un [quote]texte en citation[/quote]
    L'affichage donnera donc
    votre texte normal suivi d'un
    texte en citation
    Lorsque vous citez quelqu'un en particulier, ajoutez-le dans la balise d'ouverture comme ceci: [quote="Untel"] ce qui affichera au dessus du bloc Untel a écrit au lieu de Citation
    votre texte normal suivi d'un
    texte en citation
  • [PHP] : Bloc de code PHP. Raccourci clavier : [Alt] + [X].
    Il serait souhaitable que ce bouton soit beaucoup plus souvent utilisé. Lorsque vous ajoutez des extraits de code, en particulier du PHP, ce bouton va permettre de l'afficher en conservant l'indentation originale et y ajoutera en outre une coloration syntaxique.
    Vous verrez dans la zone de texte la partie affectée sous cette forme:
    votre texte normal suivi de votre code
    [php]<?php
    $variable = "valeur";
    // Un commentaire
    function ma_fonction($param)
    {
    ____$retour = $param * 2;
    ____/* Autre commentaire */
    ____return $retour;
    }
    ?>[/php]
    L'affichage donnera donc
    votre texte normal suivi de votre code
    <?php
    $variable = "valeur";
    // Un commentaire
    function ma_fonction($param)
    {
        $retour = $param * 2;
        /* Autre commentaire */
        return $retour;
    }
    ?>
  • [Code] : Bloc de code. Raccourci clavier : [Alt] + [C].
    Moins appropriée pour du code PHP, ce bouton devrait néanmoins être également utilisé. L'affichage est de couleur uniforme et l'indentation est conservée. Utilisez-le pour le SQL, le HTML, les CSS, enfin tout ce qui n'est pas du PHP.
    Vous verrez dans la zone de texte la partie affectée sous cette forme:
    votre texte normal suivi de votre code
    [code]#valid_inscr input {
    ____border: 1px solid #060;
    ____color: #000;
    ____background-color: #ffc;
    ____width: 12em;
    ____padding: 0.15em;
    }[/code]
    L'affichage donnera donc
    votre texte normal suivi de votre code

    Code : Tout sélectionner

    #valid_inscr input { border: 1px solid #060; color: #000; background-color: #ffc; width: 12em; padding: 0.15em; }
  • [List] : Liste à puces non ordonnée. Raccourci clavier : [Alt] + [L].
    L'utilisation des listes est particulière et mérite quelques précisions. Ce que vous lisez en ce moment même est une liste à puce non ordonnée. Le bouton [List] ajoute les balises ouvrante et fermante correspondant en html aux balises <ul> et </ul>.
    Pour ajouter ce qui correspond aux balises <li></li>, ajoutez au début de chaque item [*] sans le fermer.
    votre texte normal suivi de votre liste
    [list]
    [*]Premier item;
    [*]Second item;
    [*]Troisième item;
    [/list]
    L'affichage donnera donc
    votre texte normal suivi de votre liste
    • Premier item;
    • Second item;
    • Troisième item;
  • [List=] : Liste à puces ordonnée. Raccourci clavier : [Alt] + [O].
    Pour avoir des listes ordonnées, vous devez compléter la balise ouvrante soit avec "1" soit avec "A", ce qui donne [list=1] ou [list=A]. La numérotation sera donc numérique ou alphabétique.
    Vous verrez dans la zone de texte la partie affectée sous cette forme:
    votre texte normal suivi de votre liste ordonnée numériquement
    [list=1]
    [*]Premier item;
    [*]Second item;
    [*]Troisième item;
    [/list]
    Ou bien :
    votre texte normal suivi de votre liste ordonnée alphabétiquement
    [list=A]
    [*]Premier item;
    [*]Second item;
    [*]Troisième item;
    [/list]
    L'affichage donnera donc
    votre texte normal suivi de votre liste ordonnée numériquement
    1. Premier item;
    2. Second item;
    3. Troisième item;
    Ou bien :
    votre texte normal suivi de votre liste ordonnée alphabétiquement
    1. Premier item;
    2. Second item;
    3. Troisième item;
    Notez enfin que vous pouvez avoir des listes imbriquées éventuellement de différent type :
    votre texte normal suivi de votre liste
    [list=1]
    [*]Premier item;
    [list]
    [*]Premier sous-item;
    [*]Second sous-item;
    [*]Troisième sous-item;
    [/list]
    [*]Second item;
    [*]Troisième item;
    [/list]
    L'affichage donnera donc
    votre texte normal suivi de votre liste
    1. Premier item;
      • Premier sous-item;
      • Second sous-item;
      • Troisième sous-item;
    2. Second item;
    3. Troisième item;
  • [Img] : Image. Raccourci clavier : [Alt] + [P].
    L'insertion d'image peut occasionnellement aider à la compréhension de votre question. Néanmoins, faites-en un usage modéré, et évitez en particulier les images de grande taille. Vous ne pouvez pas insérer directement l'image, mais le bouton permet de pointer sur une image que vous aurez préalablement mise en ligne.
    L'image sera donc récupérée directement via Internet.
    Vous verrez dans la zone de texte la partie affectée sous cette forme:
    Votre texte normal suivi de votre image
    [img]http://images.amazon.com/images/P/22121 ... UMBZZZ.jpg[/img]
    L'affichage donnera donc
    Votre texte normal suivi de votre image
    Image
  • [URL] : Lien hypertexte. Raccourci clavier : [Alt] + [W].
    Lorsque vous écrivez une url normale, elle est automatiquement prise en compte sans balise particulière. Néanmoins, vous pouvez encadrer un mot en particulier pour le transformer en lien hypertexte.
    Ainsi, pour citer un autre message du forum en référence, récupérer l'url et faites ceci:
    J'ai visité [url=http://www.phpfrance.com/tutoriaux/inde ... ssions-php]ce tutorial[/url]
    L'affichage donnera donc
    J'ai visité ce tutorial
    Vous pouvez faire des combinaisons avec des images :
    L'affichage donnera donc
    J'ai lu ce livre
    Image
    Et là, l'image devient clicable.
  • ! Attention !
    Dans un bloc PHP ou code, n'utilisez pas les autres boutons de mise en forme, ils ne seront pas pris en compte : donc pas de mise en gras ou dans une autre couleur, les bbCodes seraient affichés directement au milieu du code, ce qui n'aurait aucun sens.
    Notez également que l'ordre des balises combinées est important : comme en HTML, on ne peut pas faire chevaucher des balises hétérogènes, donc on fera par exemple [b][u]texte[/u][/b] mais jamais [b][u]texte[/b][/u]
[/quote]

[Édition du 26 octobre 2006)
Attention
Depuis l'arrivée de Firefox 2.0, les raccourcis claviers ne fonctionnent plus normalement : la combinaison de touches fonctionnelles doit désormais comporter en plus la touche [Maj] (Majuscule), donc pour faire un [php], il faut faire [Maj] + [Alt] + [X].
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

1 message   •   Page 1 sur 1