Accueil
Parcours de formation
Les bases pour constuire son wiki
Construire une plateforme pédagogique / LMS
Une plateforme ressource qui génère des PDF
Une ferme pour dupliquer sa plateforme
La totale !
Webinaires de démo
L'équipe
Inscription
Rechercher
×
Se connecter
×
Se connecter
Email ou NomWiki
Mot de passe
Mot de passe perdu ?
Se souvenir de moi
Se connecter
S'inscrire
Aide
Espace formateurices
Session 2021
Parcours 1 Découvrir
Parcours 2 Approfondir
Parcours 3 Se perfectionner
TOUS LES CONTENUS
Agnès
Bernard
Christine DH
Claude
Equipe Concertina
Fabrice
Jeanne
Laure
Magalie
Marie D.
Marie S.
Mélanie
Sarah
Stéphanie
Gestion du site
Tableau de bord
Base de données
Construire la plateforme d'un projet collectif
avec YesWiki
Formation professionnelle à distance
Retour à Tous les contenus
Sauver
Format
Titre 1
Titre 2
Titre 3
Titre 4
Centré
Texte agrandi
Texte mis en valeur
Code source en mode bloc
Code source en mode ligne
Rend visible la partie sélectionnée uniquement en mode édition
Activer JavaScript pour joindre des fichiers.
Fichier
Annuler
Échoué
Composants
Éditer le composant sélectionné
Boutons
Mise en forme
Syndication / Flux RSS
Réactions / Votes
Vidéo intégrée
Actions d'envoi d'e-mail/listes
Gestion des tags
Afficher les données d'un formulaire
Afficher un formulaire de création de fiche
Actions avancées
=====Personnaliser les couleurs===== ===Choisir une palette de couleurs ?=== Si ce n'est pas encore le cas, voici un outil en ligne pour vous permettre de trouver facilement des couleurs assorties : {{button class="btn-primary new-window" link="https://coolors.co/palettes" nobtn="1" text="https://coolors.co/palettes"}} Plusieurs manières de générer une palette : - explorer les couleurs à la mode avec l'option "Explore" - générer votre palette au hasard en appuyant sur la barre d'espace jusqu'à tomber sur une couleur qui vous parle, vous pourrez alors la bloquer grace au cadenas puis continuer à explorer - générer la palette à partir d'une image (votre logo ou une photo dont les tons vous plaisent){{attach file="coolors.png" desc="palette" size="medium"class="right" }} - générer la palette à partir de votre couleur principale (pour indiquer votre couleur, il faut cliquer sur le code hexa cela vous permet de passer en édition et coller votre code couleur) N'utilisez la couleur dominante de votre palette que sur les éléments essentiel de votre site ( appel à l'action, bouton, liens ...) Cette couleur dominante peut-être la même que celle de votre logo. Pour en savoir plus sur la signification des couleurs : {{button class="btn-primary new-window" link="https://www.code-couleur.com/signification/" nobtn="1" text="lecture complémentaire sur les codes couleurs"}} La couleur prune choisie par Louise est "classique, invitant à l’harmonie, au calme, sans être morose". ===Intégrez ces couleurs dans votre wiki=== **étape 1 : tester mes couleurs dans la page LookWiki** couleurs gérées par des paramètres on choisit 3 couleurs. de préference bien assorties par exemple avec https://coolors.co/palettes - menu de l'installation par défaut > Exemple > Mise en page avancée : https://quincaillere.org/test/?LookWiki - bouton à droite "créer sa configuration graphique" - pour choisir les couleurs je peux cliquer sur le pannel ou je peux saisir le code couleur quand je le connais - un jour, il y aura un bouton sauvegarder sur cette page, mais là on est en mode appercu et on va copier du code pour enregistrer ces choix de couleurs - couleur primaire prédominante : menu, titre, liens ... - couleurs secondaires plutot quand on choisit de les appeler, par exemple dans une section ou un encadré - couleur secondaire 2 dans la class well qu'on trouve dans Format > texte mis en valeur **étape 2 : sauvegarder ces couleurs** - créer une page PageCss - y coller le code (et rien que le code) (voir la doc sur la création d'une page) %%:root { --primary-color: #71334f; /* **couleur de la barre de menu, des titres et des liens** */ --secondary-color-1: #a0294d; /* **couleur utilisée pour les cadres des facettes** */ --secondary-color-2:#cf4a67; /* **couleur utilisée pour l'encadre du texte mis en valeur** */ --neutral-color:#a499ab; /* **couleur des textes** */ --neutral-soft-color:#a499ab; /* **couleur du menu de la barre d'edition** */ --neutral-light-color:#fff; /* **couleur de fond de votre wiki** */ --success-color: #f8e156; /* ** couleur utilisée pour les messages positifs par defaut vert ** */ --danger-color: #e46d36; /* ** couleur utilisée pour les messages d'erreur par defaut rouge ** */ --warning-color: #f8e156; /* ** couleur utilisée pour les messages d'alerte par defaut orange ** */ --main-text-color:#2b3441; /* **couleur des textes** */ --main-text-fontsize: 17px; /* **taille du texte** */ --main-text-fontfamily:'Noto Sans Regular', sans-serif; /* **police** */ --main-bg-color:var(--neutral-light-color); /* couleur de fond de votre wiki */ --main-container-bg-color:transparent; /* couleur de fond de la partie centrale (sous le texte) */ --link-color: var(--primary-color); /* couleur des liens */ --link-hover-color: var(--primary-color); /* couleur des liens au survol */ --navbar-bg-color: var(--primary-color); /* couleur de fond de la barre de menu */ --navbar-text-color: var(--neutral-light-color); /* couleur du titre de la barre de menu */ --navbar-link-color: var(--neutral-light-color); /* couleur des liens dans le menu */ --navbar-link-bg-color: transparent; /* couleur de fond des liens dans le menu */ --navbar-link-hover-color: rgba(255,255,255,0.85); /* couleur des liens du menu au survol */ --navbar-link-bg-hover-color: transparent; --navbar-border: none; --navbar-border-radius: 0; --navbar-shadow: none; --header-bg-color: var(--neutral-light-color); --header-text-color: var(--neutral-color); --header-title-color: var(--primary-color); --footer-bg-color: transparent; /* **couleur de fond du pied de page ** */ --footer-text-color: var(--main-text-color); --footer-title-color: var(--main-text-color); --footer-border-top: 3px solid var(--neutral-soft-color); --btn-border: none; --btn-border-radius: .5em; --checkbox-color: var(--primary-color); }%% **Cet extrait de code permet de définir des variables css.** Elles seront utilisées non seulement dans le thème mais sont aussi utilisables dans l'ensemble de votre wiki. Les trois 1ères variables(**primary, secondary-color-1, secondary-color-2**) notamment sont de la plus grande utilité car vous pourrez les utiliser pour définir la couleur de fond d'une section par exemple : %%{{section bgcolor="var(--primary-color)" }}%% ""<iframe width="560" height="315" sandbox="allow-same-origin allow-scripts allow-popups" src="https://video.coop.tools/videos/embed/f6d929c7-123f-4f24-a2c5-8ce2a80a59d8" frameborder="0" allowfullscreen></iframe>"" ""<div class="well">""Autrice : Mélanie Michel. Licence [[https://creativecommons.org/licenses/by-sa/2.0/fr/ CC-by-SA]]""</div>""
Mots clés
Vérification pour sauver la page
Sauver
Annuler
Thème
×
Choisissez un formulaire
Nb. : Il est possible d'afficher plusieurs bases de données d'un coup en entrant leur id séparé par une virgule [
accéder à la documentation
].
Code à inclure dans la page
×
Ajouter un lien au texte selectionné
Modifier le lien
Créer une page
Nom de la page ou URL externe
Nom de la page à créer
Le nom de la page ne doit pas contenir de caractères spéciaux autre que - ou _ . Les URL doivent commencer par https://
Si la page n'existe pas, elle sera créée.
Cette page existe déjà !
Texte affiché
Texte du lien vers cette page
Texte au survol
Le lien s'ouvre dans l'onglet courant
Le lien s'ouvre dans un nouvel onglet
Le lien s'ouvre dans une fenêtre modale
×
Télécharger le fichier
Texte du lien de téléchargement
Afficher le pdf dans la page :
sous forme de lien
directement inclus dans la page
Alignement de l'image
Texte en dessous
Gauche
Centre
Droite
Taille de l'image
Miniature (140x97)
Moyenne (300x209)
Large (780x544)
Taille originale
Texte affiché au survol
Paramètres avancés
Lien web associé au clic
Effets graphiques
Bord blanc
Ombre portée
Agrandissement au survol
Permettre de cliquer sur l'image pour l'afficher en grand
Oui
Non
Texte de remplacement
Protection anti-spam active
×
Apparence de la page PersonnaliserCouleurs
Thème
margot
Squelette
1col
1col.vertical-menu
2cols-left
2cols-right
full-page
Style
margot-fun
margot
Preset
Preset par défaut
default
fun
red
yellow
Image de fond
‹
›
Paramètres avancés
Langue de la page
Català
English
Español, castellano
Français
Nederlands, vlaams
Português
Choisir une page pour:
le menu horizontal
les raccourcis en haut à droite
l'entête (bandeau)
le pied de page
le menu vertical