Paramétrage du template “Champ de texte”

Avec le tem­plate Champ de texte (text_input), vous allez pou­voir définir un ou plusieurs mots que l’utilisateur devra saisir dans le champ de texte afin de pou­voir pass­er à la scène suivante.

Vous pou­vez choisir où le diriger en cas de mau­vaise réponse.

Vous avez égale­ment la pos­si­bil­ité d’afficher un bou­ton de nav­i­ga­tion dans le coin supérieur gauche  et dans le coin supérieur droit, et de définir vers quelles scènes ils ren­voient, le menu ou la page précé­dente par exemple.

Lorsque vous cliquez sur l’op­tion “gér­er le con­tenu” de votre scène de type “choic­es”, vous pou­vez paramétr­er ses dif­férents contenus.

Onglet “Général”

Le champ “Back­ground” vous per­met de choisir une image de fond pour votre scène, par­mi les médias upload­és dans la Galerie de médias.
Si vous ne définis­sez pas d’im­age, le fond sera blanc.
Astuce : Une couleur de fond peut égale­ment être définie dans le CSS per­son­nal­isé du projet.

Le champ “CONTENT” vous per­met de rédi­ger un texte qui s’af­fichera au cen­tre de l’écran. C’est là où vous pou­vez pos­er une ques­tion à l’utilisateur.

Le champ “BUTTON_LABEL” vous per­met de définir le mot que vous voulez inscrire sur le bou­ton de val­i­da­tion qui appa­rait en dessous du champ de texte.
Par exem­ple “valid­er” ou “envoy­er”.

Onglet “INPUT”

C’est ici que vous allez définir les répons­es atten­dues, et vers quelles scènes vous souhaitez qu’elles renvoient.
Plusieurs répons­es valides sont pos­si­bles, qui peu­vent cha­cune diriger l’u­til­isa­teur vers une scène différente.

Si vous posez la ques­tion “quelle est votre couleur préférée ?”, vous pou­vez diriger l’u­til­isa­teur vers une scène dif­férente pour chaque couleur qu’il choisira, si vous l’avez préal­able­ment définie dans le champ “PATTERN”

Le champ “PATTERN” vous per­met donc de définir des choix valides. Dans l’ex­epm­le que nous don­nons, inscrivez par exem­ple “bleu”, puis cliquez sur “Ajouter un élé­ment “text”” pour définir une autre couleur comme “rouge”, et ain­si de suite. Vous allez pou­voir définir vers quelles scènes ces choix ren­ver­ront dans le champ “SUCCES_LINK”

Le champ “SUCCESS_LINK” vous per­met de définir les scènes vers lesquelles vous souhaitez diriger l’u­til­isa­teur en fonc­tion des répons­es qu’il aura don­né. Définis­sez les scènes les unes après les autres, en respec­tant l’or­dre des mots que vous avez inscrit dans le champ “PATTERN”. Le deux­ième mot de votre liste dirig­era l’u­til­isa­teur vers la deux­ième con­nec­tion de votre liste “SUCCESS-LINK”

Onglet “FAILURE”

Vous allez ici définir ce qu’il se passe en cas de mau­vaise réponse de l’u­til­isa­teur. Deux pos­si­bil­ités s’of­frent à vous : Affich­er un indice sur la même scène pour aider l’u­til­isa­teur à répon­dre grâce au champ “FAILURE_CONTENT”, ou envoy­er l’u­til­isa­teur vers une nou­velle scène avec le champ “FAILURE_LINK”

Le champ “FAILURE_CONTENT” vous per­met de définir un mes­sage qui s’af­fichera sur la même scène. Dans le cas de notre exem­ple, vous pour­riez ain­si affich­er “cette couleur n’est pas prise en compte, mer­ci d’en choisir une autre.”

Le champ “FAILURE_LINK” vous per­met de définir une scène vers laque­lle sera ren­voyé l’u­til­isa­teur en cas de mau­vaise réponse. Si vous définis­sez une scène ici, le champ “FAILURE_CONTENT” ne sera pas pris en compte. Vous pou­vez ain­si diriger l’u­til­isa­teur vers une nou­velle branche de votre scénario.

Onglet “NAVIGATION”

L’on­glet “Nav­i­ga­tion” vous per­met de paramétr­er les bou­tons que vous pou­vez affich­er dans les angles supérieurs de votre scène.
MAIN_NAV indique le bou­ton de nav­i­ga­tion prin­ci­pal, c’est à dire celui qui s’af­fiche en haut à gauche de l’écran.

SECONDARY_NAV indique le bou­ton de nav­i­ga­tion sec­ondaire, c’est à dire celui qui s’af­fiche en haut à droite de l’écran.

Si vous ne ren­seignez aucune infor­ma­tion dans ces champs, les bou­tons n’ap­pa­raitront pas.

Le champ “MAIN_NAV_ICON” vous per­met de définir l’im­age de votre bou­ton de nav­i­ga­tion prin­ci­pal, que vous avez au préal­able inté­gré dans votre galerie de médias.
Le champ “MAIN_NAV_LINK” vous per­met de définir vers quelle scène ce bou­ton enver­ra l’u­til­isa­teur. Vous avez 3 pos­si­bil­ités pour définir cette connexion :
1- Vous pou­vez ain­si choisir par­mi les con­nex­ions exis­tantes, c’est à dire qui ont déjà été attribuées à cette scène.
2- Vous pou­vez créer une nou­velle con­nex­ion, en choi­sis­sant une scène par­mi toutes celles que vous avez créée dans votre projet.
3- Vous pou­vez créer une con­nex­ion de nav­i­ga­tion, c’est à dire ren­voy­er automa­tique­ment vers la pre­mière scène du pro­jet, ou vers la scène qui a été vis­itée précédem­ment par l’utilisateur.

Vous pou­vez répéter les mêmes réglages pour les champs “SECONDARY_NAV_ICON” et “SECONDARY_NAV_LINK”

Onglet “SPECIAL”

Vous pou­vez ici attribuer des datas per­son­nal­isées (CUSTOM_DATA)  à votre scène.
pour en savoir plus sur les CUSTOM_DATA lisez l’ar­ti­cle per­son­nalis­er mon pro­jet grâce au CSS

Quelques exemples de code pour personnaliser son template “Champ de texte”