Template:User:Wyz/Infobox/doc

Ce modèle permet de définir des infoboxes. C'est un méta-modèle : il n'est pas destiné à être dupliqué ou modifié directement mais à être utilisé par d'autres modèles et non pas directement dans un article. Il a été conçu et est maintenu par Wyz.

Pour un modèle plus simple, voir w:c:communaute:Modèle:InfoboxSimple.

Utilisation
Ce modèle permet de décrire les différentes lignes souhaitées pour une infobox donnée, sachant que celle-ci se décompose de la façon suivante (chaque partie étant optionnelle) :
 * 3 lignes au-dessus
 * 1 bloc
 * 1 ligne d'image
 * 1 bloc en-tête
 * 16 lignes de détail
 * 3 lignes en dessous

Le bloc en-tête est constitué de 2 colonnes et 2 lignes

Une ligne de détail peut être :
 * Un en-tête seul
 * Un détail seul
 * Les deux

Paramètres

 * titre : le nom qui apparaît en haut de l'infobox (obligatoire)
 * icone : le nom du fichier image à utiliser comme icône
 * couleur_fond : couleur à utiliser pour le fond de l'infobox — par défaut #F2F2F2 (gris)
 * couleur_texte : couleur du texte dans l'infobox — par défaut #000 (noir)
 * couleur_entete : couleur du fond des en-têtes — par défaut #3366CC (bleu foncé)
 * couleur_texte_entete : couleur du texte des en-tête et du titre - par défaut #000 (noir)
 * largeur_entete : largeur des en-têtes (en %), quand l'en-tête et le détail sont sur la même ligne — par défaut 40
 * ligne_dessus1, ligne_dessus2, ligne_dessus3 : les lignes au-dessus
 * image : le nom du fichier image à afficher
 * taille_image : largeur de l'image en pixels — par défaut 210 (ATTENTION : il est recommandé de ne pas dépasser 250 sinon l'apparence de l'infobox pourrait être affectée)
 * entete1, entete_2 : les colonnes de la première ligne du bloc en-tête
 * detail_entete1, detail_entete2 : les colonnes de la deuxième ligne du bloc en-tête
 * chapeau_lignem : une ligne d'en-tête
 * entete_lignem : l'en-tête à gauche de la ligne
 * lignem : le détail de la ligne
 * ligne_dessous1, ligne_dessous2 : les lignes au-dessous

Note : m est compris entre 1 et 16

Champs optionnels
Une ligne sans détail renseigné n'est pas affichée. Cela facilite la création de lignes d'infobox optionnelles. Pour marquer une ligne comme étant optionnelle, utilisez un paramètre qui a par défaut une chaîne vide, de la façon suivante :
 * entete_ligne2=Trouvé
 * ligne2=

Ainsi, si un article ne définit pas le paramètre trouvé dans son infobox, la ligne ne sera pas affichée.

Pour des champs plus complexes avec du contenu pré-formaté qui doit être toujours visible, même si le paramètre n'est pas défini, vous pouvez tout englober dans une déclaration #if pour que le tout ne soit pas visible quand le paramètre n'est pas utilisé. Dans l'exemple suivant, la déclaration #if se lit de la façon suivante : « #if:le paramètre poids a été renseigné | alors l'afficher suivi de "kg" » :


 * entete_ligne4=Poids
 * ligne4=

Pour plus d'information sur #if, voir ici (en anglais).

CSS

 * Chaque conteneur d'infobox a la classe infobox
 * La barre de titre a la classe barre_haut
 * Le bloc d'en-tête a la classe bloc
 * Chaque ligne de détail (hors lignes du dessus, lignes d'image, lignes du bloc en-tête et lignes du dessous) a la classe deux ou un, en fonction du nombre d'éléments qu'elle contient

Le maximum de styles ont été intégrés au CSS du wiki afin de ne pas trop alourdir le code inséré dans la page.

.infobox { float: right; border-top-left-radius: 8px; border-top-right-radius: 8px; border:1px solid #D9D9D9; margin: 1em 0 1em 1em; width: 245px; z-index: 150;

.infobox .contenu { padding: 2px; text-align: center; } .infobox table { border-collapse: collapse; font-size: 75%; width: 100%; background-color: transparent; table-layout: fixed; } .infobox table a, .infobox table a:visited { text-decoration: underline; color: inherit; } .infobox td, .infobox th { vertical-align: top; padding: 0; } .infobox th { text-align: left; font-weight: bold; } .infobox td { text-align: right; } .infobox table.bloc { font-size: 100%; } .infobox table.bloc th, .infobox table.bloc td { text-align: center; width: 50%; } .infobox tr.un th, .infobox tr.un td { text-align: center; } .infobox tr.deux { border-top: 1px solid #B5B7CF; border-bottom: 1px solid #B5B7CF; } .infobox tr.deux th { padding-left: 2px; }

Les couleurs par défaut (fond de l'infobox, texte de l'en-tête, fond de l'en-tête, couleur du texte) sont à modifier directement dans le code de l'infobox.

Wikis où ce modèle est utilisé

 * Once Upon A Time
 * Hunter x Hunter
 * Narnia
 * Assassin's Creed
 * Le Voleur de magie
 * Sorcellerie-Info
 * Desperate Housewives
 * Call of Duty
 * Uncharted
 * Golden Sun
 * Pottermore
 * Dragons of Atlantis
 * Professeur Layton
 * The Last of Us
 * Le 10ème Royaume
 * LEGO
 * One Direction