FANDOM


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.

UtilisationEdit

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

en-tête en-tête
detail detail

Une ligne de détail peut être :

  • Un en-tête seul
en-tête
  • Un détail seul
détail
  • Les deux
en-tête détail

ParamètresEdit

titre 
le nom qui apparaît en haut de l'infobox (obligatoire)
icone 
le nom du fichier image à utiliser comme icône
couleur_texte 
couleur du texte dans l'infobox — par défaut currentColor (noir pour thème clair / blanc pour thème foncé)
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 currentColor (noir pour thème clair / blanc pour thème foncé)
ligne_dessus1, ligne_dessus2, ligne_dessus3 
les lignes au-dessus
image 
le nom du fichier image à afficher
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 optionnelsEdit

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={{{trouvé|}}}

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={{#if:{{{poids|}}}|{{{poids}}} kg}}

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

CSSEdit

  • 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 style a été intégré au CSS du wiki.

.portable-infobox .pi-item-spacing {
  padding:0;
}
.portable-infobox h3 {
  border-bottom-style: none;
}
.portable-infobox .pi-data-value > *,
.portable-infobox .pi-data-value li,
.portable-infobox nav a {
  text-decoration:underline;
  color: currentColor;
}
.pi-border-color {
    border-color: #d9d9d9;
}
.portable-infobox {
  width: 250px;
  background: #F2F2F2;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  border: 1px solid #D9D9D9;
  margin: 1em 0 1em 1em;
  z-index: 150;
  padding:0;
}
.portable-infobox .pi-title {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  text-align: center;
  font-weight: bold;
  background: #3366CC; /* Couleur par défaut à modifier */
}
.portable-infobox .pi-title, .portable-infobox .pi-header {
  font-size: 85%;
  color:currentColor;
}
.portable-infobox .pi-image-thumbnail {
  width:250px;
  height:auto;
  padding-bottom: 5px;
}
.portable-infobox .pi-horizontal-group .pi-data-label {
  font-size: 12px;
  border-left:none;
}
.portable-infobox .pi-horizontal-group .pi-data-value {
  border-left:none;
  text-align:center !important;
}
.portable-infobox .pi-header {
  text-align:center;
  background: #3366CC; /* Couleur par défaut à modifier */
  border-bottom: 1px solid #D9D9D9;
}
.portable-infobox .pi-data {
  justify-content: space-between;
  border-bottom:1px solid #D9D9D9;
}
.portable-infobox .pi-data:not(.pi-smart-data):first-of-type {
  border-bottom: 1px solid #D9D9D9;
}
.portable-infobox .pi-smart-data-value {
  border:none;
  padding-bottom: 0;
}
.portable-infobox .pi-group .pi-data-value {
  text-align:right;
}
.portable-infobox .pi-data-label {
  font-size: 11px;
  background: #3366CC; /* Couleur par défaut à modifier */
  padding: 2px;
  hyphens:none;
  -ms-flex-preferred-size: 120px;
  -webkit-flex-basis: 120px;
  -moz-flex-basis: 120px;
  flex-basis: 120px;
}
.portable-infobox .pi-data-value {
  text-align:right;
  font-size: 11px;
  padding: 2px;
  hyphens:none;
}
.portable-infobox .pi-navigation {
  background: #F2F2F2;
  text-align:center;
  font-weight:normal;
  font-size:11px;
}
.pi-smart-group .pi-smart-data-label,.pi-smart-group .pi-smart-data-value {
  text-align: center !important;
}

Les couleurs par défaut (fond de l'infobox, texte de l'en-tête, fond de l'en-tête, couleur du texte) peuvent être modifiée directement dans le code de l'infobox.

== Wikis où ce modèle est utilisé ==
* [[w:c:fr.onceuponatime:Modèle:Infobox|Once Upon A Time]]
* [[w:c:fr.hunterxhunter:Modèle:Infobox|Hunter x Hunter]]
* [[w:c:fr.narnia:Modèle:Infobox|Narnia]]
* [[w:c:fr.assassinscreed:Modèle:Infobox|Assassin's Creed]]
* [[w:c:fr.levoleurdemagie:Modèle:Infobox|Le Voleur de magie]]
* [[w:c:fr.sorcellerieinfo:Modèle:Infobox|Sorcellerie-Info]]
* [[w:c:fr.desperatehousewives:Modèle:Infobox|Desperate Housewives]]
* [[w:c:fr.callofduty:Modèle:Infobox|Call of Duty]]
* [[w:c:fr.uncharted:Modèle:Infobox|Uncharted]]
* [[w:c:fr.golden-sun:Modèle:Infobox|Golden Sun]]
* [[w:c:fr.pottermore:Modèle:Infobox|Pottermore]]
* [[w:c:fr.dragonsofatlantis:Modèle:Infobox|Dragons of Atlantis]]
* [[w:c:fr.professeur-layton:Modèle:Infobox|Professeur Layton]]
* [[w:c:fr.thelastofus:Modèle:Infobox|The Last of Us]]
* [[w:c:fr.le10emeroyaume:Modèle:Infobox|Le 10ème Royaume]]
* [[w:c:fr.lego:Modèle:Infobox|LEGO]]

== Exemple ==
<noinclude>[[Category:Templates|{{PAGENAME}}]]</noinclude>


{{Infobox
|titre=Titre
|icone=Movie reel.png 
|ligne_dessus1=ligne dessus
|ligne_dessus2=ligne dessus
|ligne_dessus3=ligne dessus
|image=Example.jpg
|entete1=en-tête
|detail_entete1=détail
|entete2=en-tête
|detail_entete2=détail
|chapeau_ligne1=en-tête
|ligne2=détail
|ligne3=détail
|entete_ligne4=en-tête
|ligne4=détail
|ligne_dessous1=ligne dessous
|ligne_dessous2=ligne dessous
}}
* DIVULGATION : Certains des liens ci-dessus sont des liens d'affiliation, ce qui signifie que, sans frais supplémentaires pour vous, Fandom percevra une commission si vous cliquez et effectuez un achat.Sauf mention contraire, le contenu de la communauté est disponible sous licence CC-BY-SA .