Les deux révisions précédentes
Révision précédente
Prochaine révision
|
Révision précédente
|
wiki-plugins [2012/01/18 14:56] emache [Couleur] |
wiki-plugins [2013/09/24 01:21] (Version actuelle) |
| ====== Quelques explications sur les plugins installés ====== |
| |
| //par M. Hugot//\\ |
| |
| <color #992299>// Quelques fonctions utilisées sur ce site requéraient l'installation de plusieurs plugins. Le but de cette page est d'en expliquer la syntaxe et l'utilisation.//</color>\\ |
| ===== Box ===== |
| Ce plugin aide à attirer l'attention sur une partie du texte. |
| <box>Voici un exemple: |
| Ceci est la boîte la plus simple que vous puissiez créer.</box> |
| |
| ... et voici le code utilisé pour la créer : |
| <box>Voici un exemple: |
| Ceci est la boîte la plus simple que vous puissiez créer. |
| </box> |
| |
| ==== Taille ==== |
| Vous pouvez changer la largeur de la boîte en utilisant un pourcentage (80%, 35%, etc...) |
| <box 30%> cette boîte utilise 30% de la partie utilisable de la page</box> |
| <code><box 30%> cette boîte utilise 30% de la partie utilisable de la page</box></code> |
| ==== Titre ==== |
| Ajouter un titre est très simple: |
| <box 100%|Voici un titre> Cette boîte utilise un titre </box> |
| <code><box 100%|Voici un titre> Cette boîte utilise un titre </box></code> |
| <color red> NB: le titre est ajouté à la fin du tag, et précédé d'un "|"</color>\\ |
| ==== Couleur ==== |
| Il est possible de choisir une couleur pour la boîte, parmi "red", "blue", "green" et "orange". |
| Voici la syntaxe: |
| <code><box red|Red Box> Voici une boîte colorée en rouge</box></code> |
| Et la boîte elle-même : |
| <box red|Red Box> Voici une boîte colorée en rouge</box> |
| Des "couleurs" spéciales ont été créées pour ce site: white, deuil, grey... |
| <code><box deuil|boite "couleur deuil">Voici une boîte colorée "Deuil"</box></code> |
| <box deuil|boite "couleur deuil">Voici une boîte colorée "Deuil"</box> |
| ==== Alignement ==== |
| La boîte peut être alignée à gauche ou à droite: |
| <box right 80%> alignée à droite</box>\\ \\ |
| |
| Code: |
| <code><box right 80%> alignée à droite</box></code> |
| Même chose pour la gauche, bien entendu. |
| ==== Coins ==== |
| La dernière chose possible est de choisir des coins arrondis. Voici le code pour ça : |
| <code><box round|round> Voici des coins arrondis</box></code> |
| et le résultat : |
| <box round|round> Voici des coins arrondis</box> |
| |
| <color red>Bien sûr, ces différents styles peuvent être combinés</color> |
| ===== Color ===== |
| Pour ajouter de la couleur à un paragraphe ou un simple mot, tapez: |
| |
| <code><color fuchsia>Ces mots sont couleur fushia</color></code> |
| Vous obtiendrez: |
| <color fuchsia>Ces mots sont couleur fushia</color> |
| |
| Les couleurs standard disponibles sont :\\ |
| <color black>"black"</color>, <color navy>"navy"</color>, <color blue>"blue"</color>, <color green>"green"</color>, <color teal>"teal"</color>, <color lime>"lime"</color>, <color aqua>"aqua"</color>, <color maroon>"maroon"</color>, <color purple>"purple"</color>, <color olive>"olive"</color>, <color grey>"grey"</color>, <color silver>"silver"</color>, <color red>"red"</color>, <color fuchsia>"fuchsia"</color>, <color yellow>yellow"</color>, <color white>"white"</color>, and <color orange>"orange"</color> |
| Il est possible également de donner un code hexadécimal de la couleur :\\ |
| <code><color #f47> Cette couleur a pour valeur hexa #f47</color></code> |
| <color #f47> Cette couleur a pour valeur hexa #f47</color> |
| ===== Folded ===== |
| Ce plugin est très pratique pour cacher une partie ++ d'un document| , et le montrer à la demande. Il peut être utilisé pour ++ montrer ou cacher une explication, ou développer un article. |
| |
| Voici le code correspondant : |
| <code>++ Le texte à cliquer| le texte à cacher, aussi long que vous le voulez... ++</code> |
| resultat : ++ Le texte à cliquer| le texte à cacher, aussi long que vous le voulez... ++ |
| |
| <color red>Remarquez à nouveau le "|" pour séparer l'"acteur" et le texte à cacher/montrer.</color> |
| |
| On peut également l'utiliser sur un paragraphe entier. dans ce cas, la partie cachée sera automatiquement présentée sur une nouvelle ligne. |
| |
| Le code utilisé est <code>++++ Le texte à cliquer| choses à cacher (il peut s'agir de n'importe quoi, y compris tableaux, images...)++++ </code> |
| Voici un ++++ exemple| Si vous ne savez pas où vous allez, n'importe quelle route vous y mènera.\\ |
| ^ premier titre ^ second titre ^ |
| | un | deux | |
| | trois | quatre | |
| | cinq | six | |
| |
| etc... |
| ++++ |
| |
| ===== Gallery ===== |
| |
| Pour créer une nouvelle gallerie de photos, créez une page contenant ce code : |
| |
| <code>===== Titre de votre gallerie ===== |
| |
| Les commentaires qui vous semblent nécessaires |
| |
| {{gallery>ici, l'adresse interne complète de la gallerie elle-même (l'endroit où vous hargez les photos)}}</code> |
| |
| Ensuite, en utilisant la fonction "ajouter des images ou d'autres fichiers" (bouton en forme de mini-cadre dans l'éditeur), ajouter les photos qui font partie de cette gallerie (l'adresse interne complète de la gallerie décrite ci-dessus) |
| |
| Et c'est tout! Quand vous avez fini et sauvegardé votre page, vous verrez les miniatures de vos photos. |
| |
| Exemple : Vous décidez de conserver toutes vos photos dans une zone appelée "albums". Mais vous voulez les classer par catégories, disons "vacances", "famille", "amis" |
| |
| Vous écrirez :<code>{{gallery>albums:famille}}</code> |
| |
| Maintenant, chargeons une photo.\\ |
| Si le dossier "famille" n'existe pas, nous le créerons au vol. Commençons comme ça.\\ |
| ouvrez votre page, et cliquez sur l'icône "ajouter des images ou d'autres fichiers". La fenêtre habituelle apparaît.\\ |
| |
| * Cliquez sur "Parcourir". |
| * Sélectionnez le fichier que vous voulez charger. |
| * Cliquez devant le nom de cette image dans la petite fenêtre de texte. |
| * Tapez "albums:famille:" devant le nom de la photo. |
| * Cliquez sur "Envoyer". |
| * Ne cliquez pas sur l'image. |
| * Enregistrez votre page. Votre image devrait être visible. |
| |
| Si vous voulez simplement ajouter une photo dans un dossier existant, faites ce qui suit: |
| |
| * Ouvrez votre page. |
| * Cliquez sur l'icône "ajouter des images ou d'autres fichiers". |
| * Choisissez le dossier où vous voulez ajouter une photo. |
| * Cliquez sur "Parcourir". |
| * Sélectionnez le fichier que vous voulez charger. |
| * Cliquez sur "Envoyer". |
| * Ne cliquez pas sur l'image. |
| * Enregistrez votre page. Votre image devrait être visible. |
| |
| ===== Notes ===== |
| |
| Il peut être utile d'afficher une note sur une page particulière, bien visible, pour attirer l'attention des visiteurs. C'est le but de ce plugin.\\ |
| Ajouter simplement à l'endroit choisi : |
| <code><note>Ceci est la note elle-même. Elle peut être aussi longue que possible</note></code> |
| Vous verres sur la page : |
| <note>Ceci est la note elle-même. Elle peut être aussi longue que possible</note> |
| Vous pouvez utiliser trois autres types de note : |
| <code><note important>, <note tip> ou <note warning> </code> |
| Voici les exemples: |
| <note important> N'oublie pas de payer tes factures !</note> |
| <note tip> Ceci est une indication</note> |
| <note warning> Danger, danger !!! </note> |
| ===== Poll ===== |
| Ce plugin est vraiment facile à utiliser. |
| Il faut simplement suivre cette structure : |
| |
| <code><poll [Titre du sondage]> |
| [Question(peut comprendre plusieurs lignes)] |
| |
| * [Premier choix] |
| * [Second choix] |
| * [troisième choix] |
| * [etc...] |
| |
| </poll> |
| </code> |
| |
| <color red>Les crochets sont juste ici pour dire ce qu'il y a à remplacer avec votre propre texte</color> |
| |
| exemple : |
| <poll Choisir votre menu> |
| Que préfèreriez-vous pour votre dîner ? |
| * Moules frites |
| * Côte de porc mommes au four |
| * Steack hâché haricots verts |
| * Pot au feu |
| </poll> |
| Lorsque vous avez voté, vous pouvez voir les résultats, et vous n'avez plus le droit de voter. (essayez sur ce sondage). |
| ===== Comment ===== |
| |
| Quand on travaille sur un site collaboratif, il peut être très partique d'avoir un moyen de laisser des commentaires à propos de votre intervention sur une page, mais visible uniquemment par les personnes qui éditent la page. Cela peut être également utile pour mémoriser ce qui a été fait et pourquoi. |
| Comment est la solution. |
| |
| Pour laisser un commentaire, utiliser simplement ce qui suit : |
| |
| <code>/* Voici le texte de votre commentaire */</code> |
| Le texte limité par les étoile sera invisible, sauf si vous éditez la page. |
| Si vous avez besoin d'un commentaire plus long, utilisant plusieurs lignes, voici comment faire : |
| |
| <code>/* première ligne |
| * seconde ligne |
| * troisième ligne |
| * etc... |
| * et voici la fin */</code> |
| |
| comme auparavant : le texte compris entre la première et la dernière étoile ne sera visiblz qu'en mode "édition". |
| ===== Divalign ===== |
| Normalement, le texte est toujours aligné à gauche dans Dokuwiki. Ce plugin vous donne la possibilité d'aligner le texte comme vous le désirez.\\ |
| Voici comment faire.\\ |
| |
| Utilisez ça <code> |
| ;;# |
| Ce texte est aligné à droite. |
| ;;# |
| </code> |
| Vous obtenez ça : |
| ;;# |
| Ce texte est aligné à droite. |
| ;;# |
| |
| Pour centrer le texte, tapez ce qui suit: |
| <code> |
| ;#; |
| Ce texte est centré. |
| ;#; |
| </code> |
| |
| ;#; |
| Ce texte est centré. |
| ;#; |
| |
| De la même manière, vous pouvez aligner sur la gauche : |
| <code> |
| #;; |
| Ce texte est aligné à gauche. |
| #;; |
| </code> |
| |
| #;; |
| Ce texte est aligné à gauche. |
| #;; |
| |
| ===== Tab ===== |
| <tab>Un petit plugin pratique pour ajouter une indentation en début de paragraphe. |
| La syntaxe est simplissime: taper <code><tab></code> en début de ligne, |
| et une indentation est créée, en utilisant le tag html " " 5 fois de suite. |
| |
| ===== Doodle ===== |
| |
| Ce plugin peut aideer votre équipe à programmer une réunion, ou prendre une décision quelconque. La syntaxe ressemble à ça : |
| |
| <code><doodle [id]> |
| ^ [Choix] ^ [Choix] ^ etc... ^ |
| </doodle> |
| </code> |
| |
| Comme vous pouvez le remarquer, il suffit d'ajouter des tags "%%doodle%%" autour d'un en-tête de table |
| pour obtenir des cases à cocher pour les différents choix. |
| |
| ^ [id] | L'ID de doodle; Doit être unique((sinon, les metadata des différents doodles avec la même id seront mélangés.)); Apparaît comme titre | Nécessaire | |
| ^ [Choix] | Une option pour laquelle les utilisateurs peuvent cocher une case si ce choix est OK pour eux | Nécessaire | |
| |
| On peut ajouter d'autres paramètres optionnels... |
| |
| <doodle [disable] [single] [login]| [id]> |
| ^ [choice] ^ [choice] ^ ... ^ |
| </doodle> |
| |
| ^ [disable]| Le résultat est visible, (vote impossible) | |
| ^ [single] | Un seul choix peut être coché | |
| ^ [login] | Le votant doit être connecté et doit utiliser son nom complet comme nom de votant | |
| |
| __**Exemple :**__ |
| |
| <code> |
| <doodle Quand voulez-vous aller faire vos achats ?> |
| ^ Lundi après-midi ^ Mardi après-midi ^ Samedi matin ^ |
| </doodle> |
| </code> |
| |
| creates this : |
| |
| <doodle Quand voulez-vous aller faire vos achats ?> |
| ^ Lundi après-midi ^ Mardi après-midi ^ Samedi matin ^ |
| </doodle> |
| |
| Il y a une case à cocher pour chaque option, un bouton "Envoyer", et une petite boîte texte pour taper le nom du votant. Cette boîte contient normalement le nom de la personne connectée.\\ |
| Le nombre total de votes est également affiché. |
| |