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
======Le code derrière le constructeur graphique====== Que se passe-t-il lorsque j'utilise le constructeur graphique de formulaire bazar ? Lorsqu’on crée ou modifie un formulaire bazar, deux méthodes nous sont offertes. La méthode par défaut dans doryphore est le constructeur graphique. {{attach file="dcfhabjikckbbnbi.png" desc="image dcfhabjikckbbnbi.png (9.7kB)" size="original" class="center"}} Celui-ci permet de construire son formulaire de manière relativement intuitive sans avoir recours à du code puisque son rôle est justement d’écrire le code pour vous. Il est cependant parfois utile de comprendre ce qui se passe derrière. Nous allons donc l’illustrer avec deux exemples, le cas d’un champ texte, et celui d’un groupe de cases à cocher. **Tout d’abord, quelques petites règles simples :** - à chaque champ placé dans le constructeur graphique, correspond une ligne dans l’onglet « code » ; - l’ordre est le même dans les deux onglets (les champs dans le constructeur graphique sont dans le même ordre que les lignes correspondantes dans l’onglet « code » ; - chaque ligne de code est composée de plusieurs paramètres et ces différents paramètres sont séparés par des groupes de trois astérisques (""***"") ; - le premier de ces paramètres indique toujours le type de champ. **Voyons maintenant ce qui se passe dans le cas d’un champ texte.** L’image ci-dessous montre la façon dont ce qui est rempli dans le constructeur graphique pour un champ texte se retrouve dans la ligne correspondante du code. {{attach file="alpdkgehbbnibiem.png" desc="image alpdkgehbbnibiem.png (0.3MB)" size="original" class="left"}} Si on regarde la ligne de code (on se rappelle que les différents paramètres sont délimités par ""***"") on constate, par exemple, que : - le 1""<sup>er</sup>"" paramètre contient bien le type de champ, - dans le 2""<sup>e</sup>"" on retrouve le nom du champ, - le libellé du champ est dans le 3""<sup>e</sup>"" paramètre, - les 4""<sup>e</sup>"" et 5""<sup>e</sup>"" paramètres contiennent les nombres de caractères affichés et maximum respectivement, - le 9""<sup>e</sup>"" paramètre indique que le champ est obligatoire (« 1 »), - le 11""<sup>e</sup>"" paramètre contient le texte d’aide, - le 12""<sup>e</sup>"" paramètre indique que le champ peut être lu par tout le monde (« * »). Tous ces détails et bien d’autres encore se trouvent sur la page https://yeswiki.net/?ChampsPossibles **Regardons à présent les différences dans le cas d’un champ de type groupe de cases à cocher.** L’image ci-dessous montre la façon dont ce qui est rempli dans le constructeur graphique pour un groupe de cases à cocher se retrouve dans la ligne correspondante du code. {{attach file="oeimcnmcfckahabb.png" desc="image oeimcnmcfckahabb.png (0.1MB)" size="original" class="left"}} Le comportement est identique à celui que l’on a vu pour un champ de type texte à la différence de : - le 1""<sup>er</sup>"" champ dans le constructeur graphique (intitulé «nom») est vide et n’a pas de correspondance dans la ligne de code ; - le 2""<sup>e</sup>"" paramètre de la ligne de code contient le nom de la liste utilisée pour ce groupe de cases à cocher ; La page de référence pour retrouver le rôle de chacun des paramètres des codes de champ bazar est : https://yeswiki.net/?ChampsPossibles {{end elem="panel"}} ""<div class="well">""Auteur : Sylvain Boyer. 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 CodeBazar
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