Modèle:BUtilisateur/Documentation : Différence entre versions

De Wikonsult
Sauter à la navigation Sauter à la recherche
m (1 révision importée)
 
m (1 révision importée)
 
(Aucune différence)

Version actuelle datée du 24 février 2019 à 15:46

Boîtes utilisateur : Tutoriel de création | Liste et utilisation | Modèle | Documentation | Projet | Charte graphique


Ce Méta-modèle permet de générer facilement des boîtes utilisateur standardisées.

Constantes

  • La largeur de la boîte est de 238px,
  • Les images et les textes sont centrés dans leurs cellules,
  • Le titre est en gras.

Description générale du modèle

Le modèle est séparé en deux zones principales : le cadre d'image à gauche et la zone de texte à droite.

Le cadre d'image permet d'afficher entre une et quatre images et/ou du texte. La zone de texte contient en général un titre, un texte et un lien vers les utilisateurs de la boîte. Un second texte peut être ajouté, séparé du premier.

Zone de texte

La zone de texte est la partie principale du modèle. Elles est destinée à afficher un texte et un titre, ainsi qu'un lien vers la liste des utilisateurs de la boîte. Le titre et le texte sont centrés, le premier étant affiché en gras au-dessus du second. Le lien vers la liste des utilisateurs est situé en haut à droite, représenté par le caractère « ∇ ». Un second texte peut être précisé, qui sera séparé du premier et affiché en dessous.

Les paramètres concernant la zone de texte sont les suivants :

  • Paramètres de couleur :
    • couleur : facultatif (défaut=#DDDDDD, gris clair) la couleur de fond de la boîte, par exemple : "#906090" ou "#ccc". Voir la charte graphique des boîtes si la boîte que vous créez est destinée à être placée dans l'espace Modèle:.
    • texte-couleur : facultatif (défaut=#000000, noir) la couleur des textes et du titre dans la boîte, par exemple : "yellow" ou "#0CCCC".
      Normalement la couleur de boîte est claire (pastel), et les textes restent en noir (inutile de préciser texte-couleur sauf si le paramètre couleur précise une teinte foncée).
  • Le titre est automatiquement en gras et sur une ligne séparée en haut du texte. Ses paramètres sont :
    • titre : facultatif (défaut=pas de titre) le titre de la boîte ; sera affiché en gras suivi d'un saut de ligne ; s'il est défini, il sert aussi de titre par défaut pour la première image (cas d'utilisation le plus courant)
    • titre-taille : facultatif (défaut=valeur du paramètre texte-taille si défini, sinon 11px) ; augmenter à 13px pour l'arabe ou le chinois.
    • titre-couleur : facultatif (défaut=valeur du paramètre texte-couleur si défini, sinon #000000, noir) ; permet de choisir une couleur pour le titre indépendament de la couleur générale définie pour le texte.
  • Le texte principal est affiché directement dans un paragraphe sous le titre. Les paramètres liés sont :
    • texte : obligatoire, mais sa valeur peut être vide ; il s'agit du texte de la boîte, à la suite du titre. Essayer de ne pas dépasser deux lignes pour éviter que la boîte ne s'élargisse verticalement.
    • texte-taille : facultatif (défaut=11px) ; augmenter à 13px pour l'arabe ou le chinois.
  • Enfin, le second texte, optionnel, est séparé du titre et du premier texte par un mince filet horizontal de la couleur de la bordure. Ses paramètres sont :
    • texte2 : facultatif (défaut=pas de texte) un second paragraphe, par exemple pour le texte dans une seconde langue.
    • texte2-taille : facultatif (défaut=valeur du paramètre texte-taille si défini, sinon 11px) ; augmenter à 13px pour l'arabe ou le chinois.

Note : le titre et le texte doivent être adaptés selon si il s'agit d'un utilisateur ou d'une utilisatrice en utilisant le modèle {{Genre utilisateur}}. Par exemple :

 {{genre utilisateur|masculin=utilisateur|féminin=utilisatrice}}

donnera le texte "utilisateur" si le genre renseigné de l'utilisateur est masculin (ou qu'aucun genre n'est renseigné) et le texte "utilisatrice" si le genre renseigné est féminin.

Lien ∇

Pour ce qui concerne l'affichage du lien vers les utilisateurs de la boîte, il est possible d'utiliser un lien simple ou une catégorie. On préfèrera le lien simple pour les boîtes rassemblant moins d'une dizaine d'utilisateurs (cf. recommandations concernant les catégories). L'usage de l'un ou de l'autre est obligatoire pour les boîtes situées dans l'espace de nom Modèle:, mais facultatif pour les boîtes personnelles crées dans l'espace Utilisateur:

  • Le paramètre lien s'utilise en passant comme paramètre le nom simple de la boîte utilisateur, c'est-à-dire les caractères suivant Modèle:Utilisateur. Par exemple, pour la boîte utilisateur Modèle:Utilisateur Wikipédia, le nom de la boîte est Wikipédia.
  • Le paramètre catégorie en revanche s'utilise en fournissant le nom complet de la catégorie. Ainsi, pour une catégorie nommée Catégorie:Utilisateur Wikipédia, la valeur du paramètre catégorie devra être Utilisateur Wikipédia.
    Renseigner ce paramètre a pour effet de catégoriser toutes les pages utilisateurs utilisant la boîte dans cette catégorie.
    Pour cette raison, le paramètre catégorie doit toujours être accompagné du paramètre nocat = {{{nocat|}}} pour permettre aux utilisateurs d'ignorer la catégorie.
  • Exceptionnellement, une seconde catégorie peut être affectée aux utilisateurs via le paramètre catégorie2. Usage réservé aux boîtes de projets.

Notes à propos de l'usage d'une catégorie :

  • Si la boîte est correctement construite (présence du paramètre nocat = {{{nocat|}}}), l'utilisateur de la boîte peut utiliser le paramètre nocat en lui fournissant une valeur quelconque pour éviter d'apparaître dans la catégorie. Il reste néanmoins possible de le retrouver à partir de la liste des utilisateurs de la boîte (lien "Pages liées").
  • Seules les pages de l'espace Utilisateur: y seront catégorisées. On peut utiliser la même boîte ailleurs dans des discussions ou dans Wikipédia: sans que ces discussions soient catégorisées parmi les utilisateurs de la boîte.
  • Le paramètre catégorie est prioritaire sur le paramètre lien, qui est ignoré en sa présence.

Cadre d'image

Le cadre d'image est le carré à gauche du modèle. Pour la plupart des modèles, le cadre d'image est utilisé pour afficher une image simple ou un texte mis en forme. Utilisé au maximum de ses capacités, ce cadre permet d'afficher jusqu'à quatre images et un texte. Pour les boîtes de l'espace Modèle:, il n'est pas recommandé d'utiliser plus de 45x45 pixels pour cette zone car au-delà, cela affecte la hauteur du modèle, et donc ne permet pas d'aligner correctement les boîtes utilisateur sur une page utilisateur.

Pour une image simple et/ou un texte, les paramètres utilisables sont les suivants :

  • img-couleur : facultatif (défaut=#FFFFFF, blanc) la couleur de fond de l'image ou des images, exemple : "#906090" ou "#ccc" ; Il est possible d'utiliser la même couleur que le reste de la boîte en spécifiant comme valeur de paramètre transparent. Cela permet par exemple d'obtenir un fond homogène dans le cas où l'image permet la transparence (images au format .png et .svg) ; Pour les drapeaux à bandes blanches le long d'un bord, il peut être utile de spécifier la couleur du cadre d'image en #EEEEEE qui permet de remarquer la bande blanche du drapeau et mesurer ses proportions (par exemple, avec le drapeau de Monaco ou de l'Algérie).
  • première image (optionnelle) :
    • img : facultatif (défaut=pas d'image) le nom de l'image, par exemple "Flag of France.svg".
    • img-taille : facultatif (défaut=45x45px) la taille de l'image exprimée en pixels, par exemple : "25x30px" ; Si les proportions spécifiées ne correspondent pas à celles de l'image, celle-ci sera contrainte de manière à rentrer dans l'espace défini par le paramètre.
      Pour les images au format paysage (drapeaux, la plupart des photos), il n'est pas nécessaire de spécifier le paramètre qui sert surtout à contraindre la taille pour que la hauteur ne dépasse pas 45px (ce qui conserve la taille des boîtes et permet de les aligner).
      Néanmoins, il peut parfois être intéressant d'avoir un cadre d'image large si l'image est de même et le texte court. Dans ce cas, on peut spécifier une valeur de paramètre de x45px, ce qui permet de spécifier la hauteur dans contraindre la largeur.
    • img-titre : facultatif (défaut=valeur du paramètre titre si défini, sinon nom de l'image) ; Il s'agit du texte qui s'affiche lorsque la souris survole l'image.
  • seconde image, à droite de la première image (optionnelle) :
    • imgd : facultatif (défaut=pas d'image).
    • imgd-taille : facultatif (défaut=45x45px).
    • imgd-titre : facultatif (défaut=nom de l'image).
  • première image, en deuxième ligne, donc sous la première image (optionnelle) :
    • img2 : facultatif (défaut=pas d'image).
    • img2-taille : facultatif (défaut=45x45px).
    • img2-titre : facultatif (défaut=nom de l'image).
  • seconde image, en deuxième ligne, à droite de la première image en deuxième ligne (optionnelle) :
    • imgd2 : facultatif (défaut=pas d'image).
    • imgd2-taille : facultatif (défaut=45x45px).
    • imgd2-titre : facultatif (défaut=nom de l'image).
  • ou alors un texte (optionnel) :
    • img-texte : facultatif (défaut=pas de texte) le texte remplaçant l'image, par exemple "E=mc2".
    • img-texte-couleur : facultatif (défaut=#000) la couleur du texte du cadre d'image, par exemple "red".
    • img-texte-taille : facultatif (défaut=14px) la taille du texte du cadre d'image, par exemple "10px".
  • img-bordure : facultatif (défaut=sans valeur) si une valeur quelconque est fournie pour ce paramètre, par exemple "oui", une bordure sera ajoutée aux images.

Paramètres généraux

La couleur de la bordure et son arrondi peuvent être personnalisés en utilisant les paramètres bordure et arrondi :

  • bordure : facultatif (défaut=#999999, gris foncé) ; La couleur de la bordure de la boîte, par exemple : "black" ou "#0000FF".
  • bordure-taille : facultatif (défaut=1px) ; L'épaisseur de la bordure de la boîte, par exemple "2px".
  • arrondi : facultatif (défaut=0) ; Arrondi des angles. Valeur suggérée : 0.6em. S'exprime en px ou em.

Pour finir, le paramètre align existe, qui permet l'alignement de la boîte sur la page, mais son usage est fortement déconseillé sur les boîtes appartenant à l'espace de nom commun Modèle:Utilisateur en raison des problèmes qu'il peut causer dans les listes de boîtes utilisateur telles que couramment utilisées par les Wikipédien·ne·s :

  • align : facultatif (défaut=left) ; Alignement de flottaison de la boîte. Les valeurs possibles sont left, center, right, ou none (boîte non flottante).

Syntaxe générale

L'appel au modèle aura le plus communément la syntaxe suivante :

{{BUtilisateur
 | bordure     = #999999               <!-- facultatif - par défaut, #999999 (gris) -->
 | couleur     = #EEEEEE               <!-- facultatif - par défaut, #EEEEEE (gris clair) -->
 | img         = icone.svg             <!-- facultatif mais fortement conseillé - si absent, pas d'image -->
 | img-couleur = #FFFFFF               <!-- facultatif - par défaut, #FFFFFF (blanc) -->
 | img-titre   = Titre icône           <!-- facultatif mais conseillé - par défaut, {{{titre}}} ou en son absence {{{img}}} -->
 | titre       = Poker                 <!-- facultatif - la boîte peut ne pas comporter de titre en gras  -->
 | texte       = Je joue au [[poker]]. <!-- facultatif mais fortement conseillé - si absent, pas de texte -->
 | lien        = Poker                 <!-- facultatif mais fortement conseillé - nom simplifié de la boîte -->
}}

À l'exception des boîtes personnelles (situées dans l'espace de nom Utilisateur: ou Utilisatrice:), il faut ajouter la documentation du modèle, ainsi qu'une catégorie dans laquelle la boîte sera placée (différente de la catégorie utilisateur définie par le paramètre). La boîte doit être placée dans au moins une catégorie fille de Catégorie:Boîte utilisateur. La syntaxe est la suivante :

{{BUtilisateur
 | ...
}}<noinclude>
{{Documentation boîte utilisateur}}
[[Catégorie:<--catégorie-->|<--nom boîte-->]]
</noinclude>

Exemple :

{{BUtilisateur
 | ...
}}<noinclude>
{{Documentation boîte utilisateur}}
[[Catégorie:Boîte utilisateur signe du zodiaque|Verseau]]
</noinclude>

Note : ne pas aller à la ligne entre le « }} » et le <noinclude> (conformément à Aide:Créer un modèle#Les balises d’inclusion sélective).

Détails sur les fonctionnalités particulières

Deux images

Si la boîte doit contenir deux images, l'une à côté de l'autre, il faut renseigner trois autres paramètres pour l'image de droite :

 | imgd        = icone2.svg    <!-- facultatif - si absent, pas d'image -->
 | imgd-taille = 21x21px       <!-- facultatif mais conseillé - par défaut, 45x45px -->
 | imgd-titre  = Titre Icône 2 <!-- facultatif mais conseillé - par défaut, {{{imgd}}} -->

Si la boîte doit contenir deux images, l'une au-dessus de l'autre, il faut renseigner trois autres paramètres pour la seconde ligne :

 | img2        = logo.svg   <!-- facultatif - si absent, pas d'image -->
 | img2-taille = 21x21px    <!-- facultatif mais conseillé - par défaut, 45x45px -->
 | img2-titre  = Titre Logo <!-- facultatif mais conseillé - par défaut, {{{img2}}} -->

Quatre images

La boîte peut contenir jusqu'à quatre images, img et imgd en première ligne, img2 et imgd2 en seconde ligne :

 | imgd2        = logo2.svg    <!-- facultatif - si absent, pas d'image -->
 | imgd2-taille = 21x21px      <!-- facultatif mais conseillé - par défaut, 45x45px -->
 | imgd2-titre  = Titre Logo 2 <!-- facultatif mais conseillé - par défaut, {{{imgd2}}} -->

Sans image : texte dans le cadre de gauche

À la place des 1 à 4 images, on peut mettre un texte :

 | img-texte         = Abbrev  <!-- facultatif - si absent, pas de texte dans la partie gauche -->
 | img-texte-couleur = #000000 <!-- facultatif - par défaut, #000000 (noir) -->
 | img-texte-taille  = 14px    <!-- facultatif - par défaut, 14px -->

Modèles courants à recopier

Modèle de base
avec image, titre
et lien
Modèle simple
sans titre en haut
ni lien
Modèle avec double image Modèle avec texte dans la partie gauche Modèle avec double texte
{{BUtilisateur
 | couleur = 
 | img     = 
 | titre   = 
 | texte   = 
 | lien    = 
}}
{{BUtilisateur
 | couleur   = 
 | img       = 
 | img-titre = 
 | texte     = 
}}
{{BUtilisateur
 | couleur     = 
 | img-couleur = 
 | img         = 
 | img-taille  = 
 | img-titre   = 
 | img2        = 
 | img2-taille = 
 | img2-titre  = 
 | titre       = 
 | texte       = 
}}
{{BUtilisateur
 | couleur           = 
 | img-couleur       = 
 | img-texte         = 
 | img-texte-couleur = 
 | img-texte-taille  = 
 | titre             = 
 | texte             = 
}}
{{BUtilisateur
 | couleur = 
 | img     = 
 | titre   = 
 | texte   = 
 | texte2  = 
}}

Exemples

Code Résultat
{{BUtilisateur
 | img       = Wikipedia-logo-v2-fr.svg
 | img-titre = Wikipédia
 | couleur   = #d0ffe0
 | titre     = [[Wikipédia]]
 | texte     = Mon encyclopédie libre et gratuite est [[Wikipédia]].
 | catégorie = Utilisateur Wikipédia
 | nocat     = {{{nocat|}}}
}}
Wikipédia
{{BUtilisateur
 | img       = 
 | img-titre = Père Noël
 | couleur   = #FF8080
 | titre     = Père Noël
 | texte     = Je crois au [[Père Noël]].
 | catégorie = Utilisateur Père Noël
 | nocat     = {{{nocat|}}}
}}
Père Noël
{{BUtilisateur
 | img          = Blason Languedoc.svg
 | img-titre    = Armoiries Languedoc
 | img-taille   = 21px
 | imgd         = Coat of Arms of Switzerland.svg
 | imgd-titre   = Blason Suisse
 | imgd-taille  = 21px
 | img2         = Blason Nord-Pas-De-Calais.svg
 | img2-titre   = Blason Nord-pas-de-calais
 | img2-taille  = 21px
 | imgd2        = Blason région fr Champagne-Ardenne.svg
 | imgd2-titre  = Blason Champagne Ardennes
 | imgd2-taille = 21px
 | couleur      = #FFF0F5
 | titre        = Quatre images
 | texte        = On peut placer jusqu’à quatre images dans la partie gauche.
}}
Armoiries LanguedocBlason Suisse
Blason Nord-pas-de-calaisBlason Champagne Ardennes
Quatre images
{{BUtilisateur
 | texte = {{Genre utilisateur|masculin=Cet utilisateur|féminin=Cette utilisatrice}} ne s’intéresse à rien.
}}
{{BUtilisateur
 | img-couleur       = red
 | img-texte-couleur = yellow
 | img-texte-taille  = 12px
 | img-texte         = '''e=<br />mc²'''
 | couleur           = darkblue
 | texte-couleur     = white
 | texte             = {{Genre utilisateur|masculin=Cet utilisateur|féminin=Cette utilisatrice}} est '''<big><big>génial{{Genre utilisateur|féminin=e}}</big></big>'''.
}}
e=
mc²
{{BUtilisateur
 | img-couleur      = #FFBBBB
 | img-texte-taille = 13px
 | img-texte        = '''en-0'''
 | couleur          = #FFEEEE
 | bordure          = #FFBBBB
 | texte            = {{Genre utilisateur|masculin=Cet utilisateur|féminin=Cette utilisatrice}} '''[[:Catégorie:Utilisateur en|ne comprend rien]]''' à l’'''[[:Catégorie:Utilisateur en|anglais]]''', ou ne veut pas parler cette langue.
 | texte2           = This user '''[[:Catégorie:Utilisateur en|does not]]''' speak '''[[:Catégorie:Utilisateur en|English]]''', or does not want to speak English.
 | catégorie        = Utilisateur en-0
 | nocat            = {{{nocat|}}}
}}
en-0

Table des couleurs

Modèle:Principales couleurs

TemplateData

<templatedata> { "params": { "align": {}, "bordure": {}, "arrondi": {}, "couleur": { "suggested": true }, "texte-couleur": {}, "img-couleur": {}, "img-texte-couleur": {}, "img": { "label": "image", "example": "Flag of France.svg", "suggested": true }, "img-taille": {}, "img-titre": {}, "titre": { "suggested": true }, "imgd": {}, "imgd-taille": {}, "imgd-titre": {}, "img2": {}, "img2-taille": {}, "img2-titre": {}, "imgd2": {}, "imgd2-taille": {}, "imgd2-titre": {}, "img-texte": {}, "img-texte-taille": {}, "catégorie": {}, "lien": {}, "titre-taille": {}, "texte-taille": {}, "texte": { "required": true, "suggested": true }, "texte2": {}, "texte2-taille": {}, "nocat": {}, "catégorie2": {} }, "description": "Ce Méta-modèle permet de générer facilement des boîtes utilisateur standardisées." } </templatedata>