Sections-Form : Différence entre versions
(Page créée avec « # Sections-Form ## Section Id Cette colonne précise le nom de la section (soit un chapitre soit un slide). Il s’agit d’une chaîne alphanumérique sans accent et sa... ») |
|||
| Ligne 1 : | Ligne 1 : | ||
| − | + | <h1 id="sections-form">Sections-Form</h1> | |
| − | + | <h2 id="section-id">Section Id</h2> | |
| − | + | <p>Cette colonne précise le nom de la section (soit un chapitre soit un slide). Il s’agit d’une chaîne alphanumérique sans accent et sans espace. </p> | |
| − | + | <p>Elle sert de référence à l’intégralité du moteur pour identifier de manière unique les différents chapitres et slides qui apparaîtront dans le formulaire. </p> | |
| − | Cette colonne précise le nom de la section (soit un chapitre soit un slide). Il s’agit d’une chaîne alphanumérique sans accent et sans espace. | + | <p><strong>Comment identifier un chapitre ?</strong></p> |
| − | + | <p>Chaque chapitre est défini par un identifiant unique. </p> | |
| − | Elle sert de référence à l’intégralité du moteur pour identifier de manière unique les différents chapitres et slides qui apparaîtront dans le formulaire. | + | <p><strong>Comment identifier une slide ?</strong></p> |
| − | + | <p>Chaque slide est défini par un identifiant unique. Il est la concaténation de l’identifiant unique du chapitre auquel il appartient ET d’un identifiant unique à cette slide (le tout séparé par un point sans espace).</p> | |
| − | + | <p>Le format est donc chapter.slide.</p> | |
| − | + | <p><strong>Par exemple :</strong> | |
| − | Chaque chapitre est défini par un identifiant unique. | + | <img src="/capture_d’écran_2019-07-15_à_16.01.53.png =x65" alt="capture_d’écran_2019-07-15_à_16.01.53.png"></p> |
| − | + | <p>Dans cet exemple, la slide “pouvoir" est à l’intérieur du chapter “identification". Son nom reflète cette appartenance : identification.pouvoir</p> | |
| − | + | <h2 id="type-de-section">Type de section</h2> | |
| − | + | <p>Une section peut soit être un chapitre soit un slide. Le premier est ainsi défini par le mot chapter et le second par le mot slide dans ‘Type de section’. </p> | |
| − | Chaque slide est défini par un identifiant unique. Il est la concaténation de l’identifiant unique du chapitre auquel il appartient ET d’un identifiant unique à cette slide (le tout séparé par un point sans espace). | + | <p>Le chapitre est le niveau de catégorie le plus haut du formulaire. Il doit contenir un ou plusieurs slides.</p> |
| − | + | <p>Le slide est le second niveau de catégorie le plus haut du formulaire. Il doit contenir un ou plusieurs champs.</p> | |
| − | Le format est donc chapter.slide. | + | <p>Exemple de Chapitres : |
| − | + | <img src="/capture_d’écran_2019-07-15_à_16.05.12.png" alt="capture_d’écran_2019-07-15_à_16.05.12.png"></p> | |
| − | + | <p>Exemple d’une Slide, à l’intérieur du Chapter “Informations sur le produit” : | |
| − | + | <img src="/capture_d’écran_2019-07-15_à_16.08.05.png =x350" alt="capture_d’écran_2019-07-15_à_16.08.05.png"></p> | |
| − | + | <h2 id="titre">Titre</h2> | |
| − | Dans cet exemple, la slide “pouvoir | + | <p>Le “libellé” : c’est l’intitulé du chapitre ou de la slide.</p> |
| − | + | <p>Remplir cette colonne est obligatoire.</p> | |
| − | + | <h2 id="sous-titre">Sous-Titre</h2> | |
| − | Une section peut soit être un chapitre soit un slide. Le premier est ainsi défini par le mot chapter et le second par le mot slide dans ‘Type de section’. | + | <p>Permet de définir un sous-titre, qui apparaîtra en dessous du titre.</p> |
| − | + | <p>Remplir cette colonne est facultatif.</p> | |
| − | Le chapitre est le niveau de catégorie le plus haut du formulaire. Il doit contenir un ou plusieurs slides. | + | <h2 id="icon">Icon</h2> |
| − | + | <p>Ce champ n’est utilisable que si la section est de type “Chapter”.</p> | |
| − | Le slide est le second niveau de catégorie le plus haut du formulaire. Il doit contenir un ou plusieurs champs. | + | <p>Il a pour but de personnaliser le questionnaire en associant une icône au chapter, pour aboutir à un rendu tel que dans l’exemple ci-dessous. |
| − | + | <img src="/capture_d’écran_2019-07-15_à_16.11.02.png" alt="capture_d’écran_2019-07-15_à_16.11.02.png"></p> | |
| − | Exemple de Chapitres : | + | <p>Les icônes à gauche de “Votre activité” et “Le Franchiseur” ont été paramétrées grâce au champ “Icon” du fichier de paramétrage.</p> |
| − | + | <p>Pour utiliser une icône, il suffit de remplir le champ “Icon” de la manière suivante : | |
| − | + | fa fa-NOMDEL’ICÔNE</p> | |
| − | Exemple d’une Slide, à l’intérieur du Chapter “Informations sur le produit” : | + | <p>L’icône en question doit être gratuite & disponible sur le site de FontAwesome : <a href="https://fontawesome.com/v4.7.0/icons/">https://fontawesome.com/v4.7.0/icons/</a></p> |
| − | + | <p>Le “NOMDEL’ICÔNE” est la chaîne de caractères utilisée par FontAwesome. | |
| − | + | <strong>Exemple : </strong> | |
| − | + | <img src="/capture_d’écran_2019-07-15_à_16.12.21.png" alt="capture_d’écran_2019-07-15_à_16.12.21.png"></p> | |
| − | + | <p>Guide pas-à-pas : </p> | |
| − | Le “libellé” : c’est l’intitulé du chapitre ou de la slide. | + | <ul> |
| − | + | <li>Aller sur Fontawesome</li> | |
| − | Remplir cette colonne est obligatoire. | + | </ul> |
| − | + | <p>Cliquer sur <a href="https://fontawesome.com/v4.7.0/icons/">https://fontawesome.com/v4.7.0/icons/</a></p> | |
| − | + | <ul> | |
| − | + | <li>Rechercher son icône</li> | |
| − | Permet de définir un sous-titre, qui apparaîtra en dessous du titre. | + | </ul> |
| − | + | <p><img src="/capture_d’écran_2019-07-15_à_16.19.04.png" alt="capture_d’écran_2019-07-15_à_16.19.04.png"></p> | |
| − | Remplir cette colonne est facultatif. | + | <ul> |
| − | + | <li>Copier l’identifiant de l’icône</li> | |
| − | + | </ul> | |
| − | + | <p>Par exemple : | |
| − | Ce champ n’est utilisable que si la section est de type “Chapter”. | + | <img src="/capture_d’écran_2019-07-15_à_16.12.21.png" alt="capture_d’écran_2019-07-15_à_16.12.21.png"> |
| − | + | Ici, l’identifiant de cette icône de drapeau est “flag”.</p> | |
| − | Il a pour but de personnaliser le questionnaire en associant une icône au chapter, pour aboutir à un rendu tel que dans l’exemple ci-dessous. | + | <ul> |
| − | + | <li>Remplir le champ dans le fichier de paramétrage</li> | |
| − | + | </ul> | |
| − | + | <p>Pour avoir cette icône de drapeau dans le questionnaire, on remplira donc le champ Icon de la manière suivante : | |
| − | Les icônes à gauche de “Votre activité” et “Le Franchiseur” ont été paramétrées grâce au champ “Icon” du fichier de paramétrage. | + | <strong>fa fa-flag</strong></p> |
| − | + | <h2 id="visible-if">Visible if</h2> | |
| − | Pour utiliser une icône, il suffit de remplir le champ “Icon” de la manière suivante : | + | <p>Cette colonne permet de définir les conditions d’apparition de la section en question.</p> |
| − | fa fa-NOMDEL’ICÔNE | + | <p>Son fonctionnement est similaire au reste du système : voir <a href="http://wiki.hercule.co/Conditions">ici</a>.</p> |
| − | + | <h2 id="html">HTML</h2> | |
| − | L’icône en question doit être gratuite & disponible sur le site de FontAwesome : https://fontawesome.com/v4.7.0/icons/ | + | <p>A quoi ça sert ? </p> |
| − | + | <h2 id="repeater">Repeater</h2> | |
| − | Le “NOMDEL’ICÔNE” est la chaîne de caractères utilisée par FontAwesome. | + | <p><strong>Pour les utilisateurs avancés</strong> |
| − | + | Le fonctionnement des repeaters est détaillé <a href="http://wiki.hercule.co/repeaters">ici</a>.</p> | |
| − | |||
| − | |||
| − | |||
| − | Guide pas-à-pas : | ||
| − | |||
| − | |||
| − | |||
| − | Cliquer sur https://fontawesome.com/v4.7.0/icons/ | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | Par exemple : | ||
| − | |||
| − | Ici, l’identifiant de cette icône de drapeau est “flag”. | ||
| − | |||
| − | |||
| − | |||
| − | Pour avoir cette icône de drapeau dans le questionnaire, on remplira donc le champ Icon de la manière suivante : | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | Cette colonne permet de définir les conditions d’apparition de la section en question. | ||
| − | |||
| − | Son fonctionnement est similaire au reste du système : voir | ||
| − | |||
| − | |||
| − | |||
| − | A quoi ça sert ? | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | Le fonctionnement des repeaters est détaillé | ||
Version du 24 juillet 2019 à 08:29
Sommaire
Sections-Form
Section Id
Cette colonne précise le nom de la section (soit un chapitre soit un slide). Il s’agit d’une chaîne alphanumérique sans accent et sans espace.
Elle sert de référence à l’intégralité du moteur pour identifier de manière unique les différents chapitres et slides qui apparaîtront dans le formulaire.
Comment identifier un chapitre ?
Chaque chapitre est défini par un identifiant unique.
Comment identifier une slide ?
Chaque slide est défini par un identifiant unique. Il est la concaténation de l’identifiant unique du chapitre auquel il appartient ET d’un identifiant unique à cette slide (le tout séparé par un point sans espace).
Le format est donc chapter.slide.
Par exemple : <img src="/capture_d’écran_2019-07-15_à_16.01.53.png =x65" alt="capture_d’écran_2019-07-15_à_16.01.53.png">
Dans cet exemple, la slide “pouvoir" est à l’intérieur du chapter “identification". Son nom reflète cette appartenance : identification.pouvoir
Type de section
Une section peut soit être un chapitre soit un slide. Le premier est ainsi défini par le mot chapter et le second par le mot slide dans ‘Type de section’.
Le chapitre est le niveau de catégorie le plus haut du formulaire. Il doit contenir un ou plusieurs slides.
Le slide est le second niveau de catégorie le plus haut du formulaire. Il doit contenir un ou plusieurs champs.
Exemple de Chapitres : <img src="/capture_d’écran_2019-07-15_à_16.05.12.png" alt="capture_d’écran_2019-07-15_à_16.05.12.png">
Exemple d’une Slide, à l’intérieur du Chapter “Informations sur le produit” : <img src="/capture_d’écran_2019-07-15_à_16.08.05.png =x350" alt="capture_d’écran_2019-07-15_à_16.08.05.png">
Titre
Le “libellé” : c’est l’intitulé du chapitre ou de la slide.
Remplir cette colonne est obligatoire.
Sous-Titre
Permet de définir un sous-titre, qui apparaîtra en dessous du titre.
Remplir cette colonne est facultatif.
Icon
Ce champ n’est utilisable que si la section est de type “Chapter”.
Il a pour but de personnaliser le questionnaire en associant une icône au chapter, pour aboutir à un rendu tel que dans l’exemple ci-dessous. <img src="/capture_d’écran_2019-07-15_à_16.11.02.png" alt="capture_d’écran_2019-07-15_à_16.11.02.png">
Les icônes à gauche de “Votre activité” et “Le Franchiseur” ont été paramétrées grâce au champ “Icon” du fichier de paramétrage.
Pour utiliser une icône, il suffit de remplir le champ “Icon” de la manière suivante : fa fa-NOMDEL’ICÔNE
L’icône en question doit être gratuite & disponible sur le site de FontAwesome : <a href="https://fontawesome.com/v4.7.0/icons/">https://fontawesome.com/v4.7.0/icons/</a>
Le “NOMDEL’ICÔNE” est la chaîne de caractères utilisée par FontAwesome. Exemple : <img src="/capture_d’écran_2019-07-15_à_16.12.21.png" alt="capture_d’écran_2019-07-15_à_16.12.21.png">
Guide pas-à-pas :
- Aller sur Fontawesome
Cliquer sur <a href="https://fontawesome.com/v4.7.0/icons/">https://fontawesome.com/v4.7.0/icons/</a>
- Rechercher son icône
<img src="/capture_d’écran_2019-07-15_à_16.19.04.png" alt="capture_d’écran_2019-07-15_à_16.19.04.png">
- Copier l’identifiant de l’icône
Par exemple : <img src="/capture_d’écran_2019-07-15_à_16.12.21.png" alt="capture_d’écran_2019-07-15_à_16.12.21.png"> Ici, l’identifiant de cette icône de drapeau est “flag”.
- Remplir le champ dans le fichier de paramétrage
Pour avoir cette icône de drapeau dans le questionnaire, on remplira donc le champ Icon de la manière suivante : fa fa-flag
Visible if
Cette colonne permet de définir les conditions d’apparition de la section en question.
Son fonctionnement est similaire au reste du système : voir <a href="http://wiki.hercule.co/Conditions">ici</a>.
HTML
A quoi ça sert ?
Repeater
Pour les utilisateurs avancés Le fonctionnement des repeaters est détaillé <a href="http://wiki.hercule.co/repeaters">ici</a>.
