Formation Wiki

02 Décembre 2021 - Mélanie Michel(melanie@pratic-coop.fr)
Présents : Elsa Vacheron - Antonnin Delabouglise

Créer une page

La page de EslA
La page de AntoniN
Dès qu'un ChatMot (un mot qui contient 2 majuscules) est repéré dans une page wiki - une icone crayon apparait pour proposer de créer une nouvelle page.
Pour ne pas que le mot soit interpreté (ex un nom de structure qui contient 2 majuscules mais qu'on veut juste citer dans la page sans pour autant créer une page) - ajouter des double guillemets autour du mot 
""AutourDuMot""


Insérer un bouton

Utiliser le menu "Composants"
Associer une couleur à un type de fonction
  • couleur primaire et info : bleu
  • couleur secondaire 1 : rose > pour les informations à mettre en valeur
  • couleur secondaire 2 : vert > pour appel à participer au projet (exemple ajouter une association)

Dans paramètres avancés :
Option Position "Afficher sur toute la largeur" - permet d'aligner les boutons comme dans les pages "Nouvel arrivant"
Option Ouvrir dans une nouvelle fenêtre

Quand on modifie un paramètre du bouton (la couleur par exemple), il faut ensuite cliquer sur "mettre à jour le code". Le bouton "Close" ferme les options sans enregistrer .

Les composants de mise en forme


Etiquette

L'étiquette sert à mettre un petit mot en valeur pour donner une info repère dans un texte, exemple : Nouveau ou à relire
La couleur de l'étiquette donne du sens :
  • Info La couleur "primaire" ou "info" se fondent dans le texte - elles permettent d'annoter sans alourdir
  • Prochaine étape du projet secondary-1 ou secondary-2 sont plus tape à l'oeil
  • Validé la couleur "success" se prête à un élément qui a été validé
  • Urgent la couleur "danger" se prête à un besoin urgent ou une alerte sur un point sensible

Onglets

Les onglets permettent de naviguer d'une page à une autre
image Capture_onglet.png (24.4kB)
 Utilisé par exemple dans CartoGenerale
Il est d'usage d'inclure la page en cours (par exemple CartoGenerale) dans la liste des onglets, cela permet d'afficher l'onglet actif en couleur et donc d'apporter un repère supplémentaire à l'utilisateur

Encadré


Titre de mon encadré

Texte de votre encadré à modifier par la suite
Un encadré permet de mettre en avant une information - avec une barre de titre bien identifiée et un contenu mis en valeur par le cadre.
Cette mise en forme comprend une option "type" :
  • encadré simple (ci-contre)
  • accordeon ouvert
  • accordeon fermé


Sections

Le composant de mise en forme "Section" permet de définir une couleur ou une image de fond en arrière plan d'un texte.
C'est le composant utilisé par exemple dans la page Nouvel arrivant pour créer les sections de couleurs.
Après avoir mis en place votre section (et mis à jour le code),il est possible de remplacer le code couleur : paramètre bgcolor=#b51e23 par une couleur prédéfinie du thème, par exemple la variable correspondant à la couleur secondaire 1 (rose) est var(--secondary-color-1) et s'utilise comme cela bgcolor="var(--secondary-color-1) .

Colonnes

Le composant de mise en forme de type colonne permet d'insérer le code wiki correspondant à un affichage sur 4 colonnes.
Il est composé d'éléments indispensables:
  • {{grid}}

  • {{end elem="grid"}}

  • {{col size="3"}}

  • {{end elem="col"}}

{{grid }}
{{col size="3"}}
Texte de la colonne 1 à changer par la suite
{{end elem="col"}}
{{col size="3"}}
Texte de la colonne 2 à changer par la suite
{{end elem="col"}}
{{col size="3"}}
Texte de la colonne 3 à changer par la suite
{{end elem="col"}}
{{col size="3"}}
Texte de la colonne 4 à changer par la suite
{{end elem="col"}}
{{end elem="grid"}}

Vous pouvez modifier le nombre et la taille des colonnes en jouant avec le paramètre size="x".
La règle est que la somme des tailles doit être = 12
  • soit : 6+6
  • soit : 8+4
  • soit : 4+4+4
  • soit : 6+2+2+2
  • ...
Texte de la colonne 4 à changer par la suite
Remplacez les textes en respectant la structure grid / col / end col /col/end col/ end grid