Show Menu
SUJETS×

Eléments statiques dans un formulaire web

Vous pouvez inclure dans une page de formulaire des éléments avec lesquels l'utilisateur n'a pas d'interaction : il s'agit d'éléments statiques tels qu'une image, un contenu HTML, une barre horizontale ou lien hypertexte. Ces éléments sont créés à partir du premier bouton de la barre d'outils, depuis le menu Ajouter un élément statique .
Les types de champs disponibles sont les suivants :
  • Valeur issue des réponses fournies antérieurement (dans le contexte du formulaire) ou de la base de données.
  • Lien hypertexte, HTML, barre horizontale. Voir Insérer du contenu HTML .
  • Image enregistrée dans la bibliothèque de ressources ou sur un serveur accessible par les utilisateurs. Voir Insérer des images .
  • Script exécuté côté client et/ou côté serveur. Il doit être rédigé en Javascript et compatible avec la plupart des navigateurs afin d'assurer une bonne exécution côté client.
    Côté serveur, le script peut utiliser les fonctions définies dans la documentation JSAPI Campaign .

Insérer du contenu HTML

Vous pouvez inclure des contenus HTML dans une page de formulaire : liens hypertextes, images, paragraphes formatés, objets vidéo, Flash, etc.
L'éditeur HTML vous permet de saisir directement le contenu à insérer dans la page du formulaire. Pour accéder à cet éditeur, choisissez le menu Eléments statiques > HTML .
Vous pouvez saisir et mettre en forme directement votre contenu ou afficher la fenêtre du code source pour y coller un contenu externe. Pour basculer en mode "code source", cliquez sur la première icône de la barre d'outils :
Pour insérer un champ de la base, utilisez le bouton de personnalisation.
Les chaînes saisies dans l'éditeur HTML ne font l'objet d'une traduction que si elles sont définies dans le sous-onglet Textes . Dans le cas contraire, elles ne sont pas collectées. Voir à ce sujet la section Traduire un formulaire web .

Personnaliser le contenu HTML

Vous pouvez personnaliser le contenu HTML d'une page de formulaire avec des données enregistrées dans une page précédente. Par exemple, vous pouvez créer un formulaire Web d'assurance automobile dont la première page permet d'indiquer les coordonnées et la marque du véhicule.
Vous pouvez réinjecter dans la page suivante le nom de l'utilisateur et la marque sélectionnée en utilisant des champs de personnalisation. La syntaxe à utiliser dépend du mode de stockage des informations. Voir à ce propos la section Utiliser les informations collectées .
Pour des raisons de sécurité, la valeur saisie dans la formule <%= est remplacée par des caractères d'échappement. Pour éviter cela, et seulement en cas de besoin, utilisez la syntaxe suivante : <%=
Dans notre exemple, le nom et le prénom du destinataire sont stockés dans un champ de la base, tandis que la marque de son véhicule est stockée dans une variable. La syntaxe du message personnalisé en page 2 sera la suivante :
<P>Welcome <%= ctx.recipient.@firstName %> <%= ctx.recipient.@lastName %>,</P>
<P>To start your customized study, please select your car <%=ctx.vars.marque%> and its year of purchase.</P>

Le résultat sera le suivant :

Utilisation de variables texte

L'onglet Texte permet de créer des champs variables qui peuvent être utilisés dans le HTML entre les caractères <%= et %>, avec la syntaxe suivante : $(IDENTIFIER) .
Utilisez cette méthode pour localiser facilement vos chaînes. Voir Traduire un formulaire web
Par exemple, vous pouvez créer un champ Contact qui permettra d’afficher la chaîne « Dernier contact le » dans le contenu HTML. Pour ce faire, procédez comme suit :
  1. Cliquez sur l'onglet Textes du texte HTML.
  2. Cliquez sur l'icône Ajouter .
  3. Dans la colonne Identifiant , indiquez le nom de la variable.
  4. Dans la colonne Texte , saisissez la valeur par défaut.
  5. Dans le contenu HTML, insérez cette variable texte via la syntaxe <%= $(Contact) %> .
    Si vous saisissez ces caractères dans l'éditeur HTML, les champs < et > sont remplacés par leurs caractères d'échappement. Dans ce cas, vous devez corriger le code source en cliquant sur l'icône Afficher le code source de l'éditeur de texte HTML.
  6. Ouvrez l'onglet Prévisualisation du formulaire pour visualiser la valeur renseignée dans le HTML :
Ce mode de fonctionnement permet de factoriser les textes des formulaires Web et d'en gérer les traductions au travers de l'outil intégré de traduction. Voir à ce sujet la section Traduire un formulaire web .

Insérer des images

Pour inclure des images dans les formulaires, elles doivent être enregistrées sur un serveur accessible depuis l'extérieur.
Sélectionnez le menu Eléments statiques > Image .
Sélectionner la source de l'image à insérer : elle peut être issue de la bibliothèque de ressources publiques ou stockée sur un serveur externe accessible de l'extérieur.
S'il s'agit d'une image de la bibliothèque, sélectionnez-la dans la liste déroulante du champ; S'il s'agit d'une image externe, saisissez le chemin d'accès à l'image à insérer. Le libellé sera affiché lorsque l'utilisateur passe la souris sur l'image (correspond à un champ ALT en HTML), ou lorsque l'image n'est pas affichée.
La section centrale de l'éditeur permet de visualiser l'image.