Sur cette page vous trouverez l'ensemble des outils existants classés par typologie.
Dans cette section vous trouverez les différents templates de type Infobox. La page de Tzaly donne un bon exemple d'un Infobox.
Dans chacun de ces templates vont trouverez le code à insérer en début de page afin de générer cet Infobox.
A noter que toutes les informations de l'Infobox sont optionnelles à l'exception du nom de l'objet en question. Par exemple, si votre personnage est toujours bien vivant, ne rien mettre dans le champ DateMort aura pour effet de ne pas afficher la ligne Date de la mort dans l'Infobox.
De plus, l'utilisation d'un Infobox classera automatiquement la page dans la catégorie correspondante. Une page utilisant le template Dieu sera classé dans la catégorie "Dieu". Et ainsi plus facile à retrouver dans la page dédié à cette catégorie (voir Catégorie:PJ).
La liste des templates Infobox existants ainsi que leur fonctionnement est décrit dans les pages suivantes :
Ensuite il y a la mère de toutes les infobox :
Dans chaque modèle, vous trouverez une proposition de structure de page lié à son type.
Voici un texte intégré dans un encart de type vieux papier du plus bel effet. Pour faire des citations c'est assez pratique. La police (font) de ce texte est par défaut Géranium mais si vous le souhaitez il est possible de choisir n'importe quelle police classique.
Ce template permet d'intégrer un parchemin très facilement. Comme dans l'exemple ci-dessous. Pour en apprendre plus sur son utilisation, tout est expliqué dans la page dédiée : Modèle:Papier
Ce template permet d'intégrer un post-it sur la page. Comme dans l'exemple ci-dessous. Pour en apprendre plus sur son utilisation, tout est expliqué dans la page dédiée : Modèle:Post-it
Le système natif de MediaWiki permet de choisir la taille des images en px pour choisir la taille de son image. Néanmoins, il est préférable d'utiliser un sizing dynamique en %age. Car une taille définit en pixels pourra donner des résultats très différents en fonction de la définition d'écran de chaque utilisateur.
Par exemple avec le code suivant:
[[File:Grand_Continent.jpg|class=image-30w|center]] <br clear=all>
L'image fera 60% de la largeur de la page du content du Wiki.
NE FONCTIONNE PAS BIEN avec l'alignement RIGHT. LEFT et CENTER fonctionne bien par contre.
Ce modèle permet permet de faire des cartes zoomables simplement avec la souris.
Quand cela est nécessaire, on peut avoir besoin d'afficher un texte en plus petit, ou plus grand. On pourra utiliser les classes fontsize_[taille], comme dans l'exemple ci-dessous:
Pour cela on utilisera le code suivant:
* <div class="fontsize_XXS">Ceci est la fontsize_XXS, la plus petite</div> * <div class="fontsize_XS">Ceci est la fontsize_XS</div> * <div class="fontsize_S">Ceci est la fontsize_S, légèrement plus petite que la taille normale</div> * <div class="fontsize_M">Ceci est la fontsize_M, il s'agit de la taille normale de texte. Elle n'est pas forcément utile car dans ce cas, il suffit de ne rien définir.</div> * <div class="fontsize_L">Ceci est la fontsize_L, légèrement plus grande que la taille normale</div> * <div class="fontsize_XL">Ceci est la fontsize_XL</div> * <div class="fontsize_XXL">Ceci est la fontsize_XXL, la plus grande</div>
Pour passer une partie du texte en rouge, on utilisera ces balises, et si ce n'est pas assez visible, on peut utiliser du bold.
Rouge <span style="color:#661810">rouge</span> Bold '''<span style="color:#661810">bold</span>'''
Il est possible de mettre facilement en italique un texte dans le wiki est utilisant les 2 apostrophes. Mais cela devient fastidieux lorsqu'il s'agit d'un grand texte. Dans ce cas, il répéter à chaque saut de lignes ce double apostrophes. Pour éviter cela, on pourra utiliser la classe italique sur toute sa section en une fois.
Comme ceci:
<div class="italique"> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Il peut être nécessaire parfois d'ajouter des textes plus gros pour séparer des textes, mais sans vouloir les intégrer dans le sommaire et sans avoir la ligne en-dessous. Pour ce faire on pourra utiliser les styles nhx (x étant à remplacer par 2, 3, 4, 5 ou 6), comme ceci:
Pour cela on utilisera le code suivant:
<div class="nh2">Ceci est un titre nh2 similaire à un titre ==</div> <div class="nh3">Ceci est un titre nh3 similaire à un titre ===</div> <div class="nh4">Ceci est un titre nh4 similaire à un titre ====</div> <div class="nh5">Ceci est un titre nh5 similaire à un titre =====</div> <div class="nh6">Ceci est un titre nh6 similaire à un titre ======</div>
Ce template permet d'afficher un fil d'Ariane. Il est en général placé en haut de la page et permet d'aider l'utilisateur à se situer sur le site. Le fil d'Ariane accepte un maximum de 4 variables en plus de l'Accueil qui est géré automatiquement.
Le code à inclure:
{{FilAriane | [[Accueil#Panthéon|Accueil - Panthéon]] | [[Accueil#Les_12_Divinités_majeures]] | [[Nikadema]]|[[Nikadema#Grand_Prêtre]] }}
Une autre manière de présenter des listes de valeur comme:
Est d'utiliser la liste horizontale, comme ceci:
Pour cela il faut utiliser le code suivant:
<div class="hlist fontsize_S"> * Elément 1 * [[Rungda]] * Elément 3 </div>
Ces templates permettent d'insérer des séparateurs. Cela permet d'aérer un long texte. Pour se faire il existe deux niveaux de séparateurs
Pour l'utiliser, on insérera le code suivant:
{{hr1}}
Cela donnera la chose suivante:
Pour l'utiliser, on insérera le code suivant:
{{hr2}}
Cela donnera la chose suivante:
Parfois il est nécessaire de faire des colonnes de texte pour améliorer la lisibilité du texte. Le plus classique étant deux colonnes (Note : il est conseillé d'utiliser un "br" de type clear=all à la fin pour remettre le setup normal du wiki ensuite).
Dans ce cas on pourra utiliser le code suivant:
<div class="section-50"> Partie du texte prenant 50% de l'espace horizontale. </div> <div class="section-50"> Partie du texte prenant 50% de l'espace horizontale. </div><br clear=all>
Alors que le soleil se couchait sur le village de Valdrien, une agitation inhabituelle régnait parmi les habitants. Des rumeurs circulaient selon lesquelles une créature mystérieuse rôdait dans les bois voisins, semant la terreur parmi les villageois.
Valdrien, toujours prêt à venir en aide à son village, se porta volontaire pour enquêter sur cette menace. Équipé de son bâton de sorcier et de son courage, il s'aventura dans la forêt sombre.
Au cœur de la nuit, il tomba nez à nez avec une bête étrange, mi-homme mi-bête, aux yeux brillants de malice. Sans hésitation, Valdrien fit appel à ses pouvoirs magiques, invoquant des éclairs et des rafales de vent pour repousser la créature.
Mais alors qu'il se préparait à l'affronter, il remarqua dans les yeux de la bête une lueur de tristesse. Il comprit alors que cette créature n'était pas maléfique, mais simplement effrayée et désorientée.
Avec compassion, Valdrien s'approcha lentement de la créature et lui parla d'une voix douce et apaisante. Il découvrit que la bête était en réalité un homme transformé par un sortilège maléfique, et qu'elle cherchait désespérément un moyen de retrouver son apparence humaine.
Déterminé à aider cet homme, Valdrien promit de trouver un antidote au sortilège. Ensemble, ils retournèrent au village où Valdrien consulta les anciens grimoires et concocta un puissant contre-sort.
Avec un éclat de lumière et un frisson dans l'air, l'homme retrouva enfin sa forme humaine, remerciant chaleureusement Valdrien pour son aide.
De retour au village, les habitants acclamèrent Valdrien comme un héros, reconnaissants pour sa bravoure et sa compassion. Et tandis que la nuit cédait la place à un nouveau jour, Valdrien savait que peu importe les défis à venir, il serait toujours là pour protéger ceux qui en avaient besoin.
Il est aussi possible en fonction de la page éditer de faire des blocs de 10%, 40% ou 70%. dans ce cas il suffit de faire varier la valeur de la div de cette manière.
<div class="section-30"> Partie du texte prenant 30% de l'espace horizontale. </div> <div class="section-70"> Partie du texte prenant 30% de l'espace horizontale. </div><br clear=all>
Alors que le soleil se couchait sur le village de Valdrien, une agitation inhabituelle régnait parmi les habitants. Des rumeurs circulaient selon lesquelles une créature mystérieuse rôdait dans les bois voisins, semant la terreur parmi les villageois.
Valdrien, toujours prêt à venir en aide à son village, se porta volontaire pour enquêter sur cette menace. Équipé de son bâton de sorcier et de son courage, il s'aventura dans la forêt sombre.
Au cœur de la nuit, il tomba nez à nez avec une bête étrange, mi-homme mi-bête, aux yeux brillants de malice. Sans hésitation, Valdrien fit appel à ses pouvoirs magiques, invoquant des éclairs et des rafales de vent pour repousser la créature.
Mais alors qu'il se préparait à l'affronter, il remarqua dans les yeux de la bête une lueur de tristesse. Il comprit alors que cette créature n'était pas maléfique, mais simplement effrayée et désorientée.
Avec compassion, Valdrien s'approcha lentement de la créature et lui parla d'une voix douce et apaisante. Il découvrit que la bête était en réalité un homme transformé par un sortilège maléfique, et qu'elle cherchait désespérément un moyen de retrouver son apparence humaine.
Déterminé à aider cet homme, Valdrien promit de trouver un antidote au sortilège. Ensemble, ils retournèrent au village où Valdrien consulta les anciens grimoires et concocta un puissant contre-sort.
Avec un éclat de lumière et un frisson dans l'air, l'homme retrouva enfin sa forme humaine, remerciant chaleureusement Valdrien pour son aide.
De retour au village, les habitants acclamèrent Valdrien comme un héros, reconnaissants pour sa bravoure et sa compassion. Et tandis que la nuit cédait la place à un nouveau jour, Valdrien savait que peu importe les défis à venir, il serait toujours là pour protéger ceux qui en avaient besoin.
Ceci permet de masquer un texte à n'importe quel endroit du wiki. Cela peut être utile par exemple pour rendre une page plus facile à naviguer ou masquer un spoil par exemple.
Voici un exemple de ce que cela donne (de nouveau il est préférable de mettre un "br" clear=all pour éviter que le texte en-dessous apparaisse décaler).
{{TexteMasquer
| Texte =
Ce texte est caché en-dessous du lien précédent. Pour l'afficher il suffit de cliquer dessus. Et pour le faire réapparaitre de cliquer une autre fois.
Cela peut-être utile pour cacher un texte moins important qui pourrait nuire à la lecture.
}}
Ce texte est caché en-dessous du lien précédent. Pour l'afficher il suffit de cliquer dessus. Et pour le faire réapparaitre de cliquer une autre fois.
Cela peut-être utile pour cacher un texte moins important qui pourrait nuire à la lecture.
Déclinaison des couleurs utilisées Sur le Wiki en Teintes et Ombres.
Liste des fonctionnalités ayant existés mais n'ayant plus d'utilité ou ayant été remplacé. Cela sert de sauvegarde au cas où.
Modèle:Détail Ce template permet d'afficher un texte après un titre de section pour aller vers le détail de celui-ci. Cela permet de conserver le look des titres tout en permettant d'aller plus loin dans les détails d'un sujet. Ce template est notamment largement utilisé dans la page d'accueil. Comme celui qui est utilisé dans cette même section.
Pour cela on pourra utiliser le code suivant:
{{Détail | [[Modèle:Détail]] }}
Le template existe toujours mais le CSS a été enlevé pour éviter de surcharger la page CSS. Voici ce que c'était :
/*====================*/
/* DETAIL */
/*====================*/
.détail-container {
display: flex;
justify-content: flex-end;
}
.détail {
display: inline-block;
position: relative;
border-radius: 15px 15px 15px 15px;
background-color: var(--color_main_grey1);
padding-left: 0.4em; padding-right: 0.4em;
border: solid 1px var(--color_main2);
box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
margin-right: 0.5em;
margin-left: 1em;
margin-bottom: 0.5em;
margin-top: -1.5em;
}
Ce bloc permet d'afficher simplement une boîte avec un titre puis un contenu en-dessous, comme ci-dessous.
Ceci permet de faire la description de la section en question. Elle agit exactement comme du texte de wiki normal.
On peut y mettre des liens vers d'autres pages de façon classique comme ceci : Taverne ou toutes les autres fonctionnalités disponibles dans le wiki.
Notez que LienDetail pointe vers une page qui n'existe pas. Donc ce lien apparaît en rouge, comme de coutume.
Afin de l'utiliser il suffit d'insérer le code suivant:
{{Bloc
| Titre = Ceci est le titre
| LienDetail = Nom réel du lien vers la page de redirection
| Description =
Ceci permet de faire la description de la section en question. Elle agit exactement comme du texte de wiki normal.
On peut y mettre des liens vers d'autres pages de façon classique comme ceci : [[Taverne]] ou toutes les autres ''fonctionnalités'' '''disponibles''' dans le <s>wiki</s>.
Notez que LienDetail pointe vers une page qui n'existe pas. Donc ce lien apparaît en rouge, comme de coutume.
}}
Pour faire 2 colonnes, on va ici utiliser la classe section-50 vu auparavant ainsi que le template de bloc.
Par exemple, pour mettre en place la disposition qui s'affiche plus bas, on utilisera le code suivant (Note : il est conseillé d'utiliser un "br" de type clear=all à la fin pour remettre le setup normal du wiki ensuite).
<div class="section-50">
{{Bloc
| Titre = Bloc 1
| LienDetail = Taverne
| Description =
Texte du bloc 1
La variable ''LienDetail'' étant égale à ''Taverne'', le lien en bas à droite pointe bien vers une page existante dont le nom est différent du titre du bloc.
}}
{{Bloc
| Titre = Bloc 2
| LienDetail = Taverne
| Description =
Texte du bloc 2, en dessous du bloc 1
}}
</div>
<div class="section-50 Justify">
{{Bloc
| Titre = Bloc 3
| LienDetail = Taverne
| Description =
Texte du bloc 3, dans l'autre colonne
}}
{{Bloc
| Titre = Bloc 4
| Description =
Dans la seconde colonne, en dessous du Bloc 3. Notez comme la non-utilisation de la variable ''LienDetail'' impacte l'affichage du lien vers une éventuelle page. Ici comme elle est absente, le lien ne s'affiche pas.
}}
</div><br clear=all>
Texte du bloc 1
La variable LienDetail étant égale à Taverne, le lien en bas à droite pointe bien vers une page existante dont le nom est différent du titre du bloc.
Texte du bloc 2, en dessous du bloc 1
Texte du bloc 3, dans l'autre colonne
Dans la seconde colonne, en dessous du Bloc 3. Notez comme la non-utilisation de la variable LienDetail impacte l'affichage du lien vers une éventuelle page. Ici comme elle est absente, le lien ne s'affiche pas.
