Dialogue réactif

À propos de Dialogue Créatif Réactif

Le dialogue réactif est un type d'interception guidée disponible pour les projets Informations sur le site web et l'application. Les dialogues réactifs vous aident à créer des superpositions conformes à l'accessibilité pour votre site web, qui s'adaptent aux différentes tailles d'appareils.

Une fois que vous avez accès à cette fonction, le dialogue réactif s'affiche aux côtés des autres créations.

Création d'un dialogue réactif

Créer un intercept guidé.

La plate-forme doit être réglée sur Site web.
 

---

×

close

Sélectionnez Superposition.

Cliquez sur Create Intercept.

Dans la page Configuration, sélectionnez Apparence.
 

---

×

close

Pour utiliser l'éditeur d'interception classique, faites défiler vers le bas et sélectionnez « Dialogue réactif ». Suivez ensuite les étapes 7 et 8 pour personnaliser l'apparence de votre interception.

---

×

close

Astuce: Nous avons lancé le nouvel Appearance Studio, qui permet de créer des mises en page d'interception. Cet éditeur offre les mêmes options de personnalisation que celles présentées sur cette page, mais avec des fonctionnalités plus avancées et une interface plus flexible. Utilisez le modèle « Popover central » ou « Notification dans le coin » pour commencer.

Terminez les étapes décrites ci-dessous sur cette page d'assistance :

• Taille &amp ; Style
• Message
• Boutons
• Logos &amp ; Images
• Animation

Ajouter les traductions, si nécessaire.

Cliquez sur Ajouter une connexion pour ajouter un lien vers une enquête personnalisée à la boîte de dialogue.
 

---

×

close

Sélectionnez l'un des éléments suivants :
 

---

×

close

• Choisissez une enquête existante : Lien vers une enquête à laquelle vous avez accès. Assurez-vous que le projet que vous souhaitez utiliser est ouvert et qu'il dispose d'un lien anonyme.
• Ajouter un lien externe : Coller une URL complète.

Cliquez sur Enregistrer la connexion.

Ajouter une logique de cible.
 

---

×

close

Ajouter des données intégrées.

Régler les paramètres d'intercept, tels que le moment où l'intercept s'affiche et la connexion au Répertoire XM.

Testez votre intercept.

Publiez vos modifications.

Déployer les changements.

Astuce : Pour les dernières étapes de configuration et les détails sur le lancement, vous pouvez également consulter la rubrique Création d'interceptions guidées.

Taille &amp ; Style

Dans la section « Taille et style », vous pouvez personnaliser l'apparence générale de la création comme suit :

Taille standard &amp ; Options de style

Voici les options qui s'affichent si vous n'utilisez pas de cible intégrée et que l'option « Afficher directement l’enquête » n'est pas cochée dans la boîte de dialogue.

---

×

close

• Espacement du contenu: Configurez la densité du texte sur votre créatif. Vous pouvez choisir entre « Compact », « Moyen » ou « Spacieux ».
• Couleur : Configurez la couleur d'arrière-plan du créatif en choisissant dans la palette de sélection des couleurs.
• Forme de la bordure : Configurez le rayon de la bordure de votre créatif. Ce paramètre détermine le degré d'arrondi des angles. Vous avez le choix entre Aucun, Légèrement arrondi, Modérément arrondi, Très arrondi.
• Ombre portée : Configurez l'ombre portée entourant votre créatif. Vous avez le choix entre Aucun, Léger, Moyen et Lourd.

Afficher l'enquête directement dans la boîte de dialogue

Lorsque vous sélectionnez « Afficher l'enquête directement dans la boîte de dialogue », l'enquête sera intégrée à la création, au lieu d'y être associée via un bouton. Pour tester l'expérience complète et précise de l'Enquête dans le Créatif, utilisez le signapplet. Pour en savoir plus, consultez la rubrique Intercepts de tests.

Astuce : Ce paramètre remplace les options d'affichage définies sur les ensembles d'actions connectés à ce créatif. Pour plus d'informations sur les options d'affichage de l'ensemble d'actions, voir Options d'affichage.

Si vous sélectionnez cette option, les onglets « Message » et « Boutons » disparaîtront, car le Dialogue réactif ne comportera plus ni message ni boutons, à l'exception de ceux déjà définis dans votre enquête cible. La sélection de cette option signifie également que vous disposez de différents paramètres de taille et de style :

---

×

close

• Redimensionnement automatique de la boîte de dialogue pour l'adapter à votre enquête : Redimensionner automatiquement le dialogue réactif pour l'adapter à l'enquête que vous affichez dans la boîte de dialogue. La fenêtre se redimensionne automatiquement en fonction de la longueur de la première page de votre enquête.

  

  Astuce : le redimensionnement automatique est limité par la hauteur de la fenêtre de votre navigateur. Si la première page de votre enquête comporte de nombreuses questions, vous pouvez la raccourcir, par exemple en déplaçant certaines questions ou en insérant un nouveau saut de page. La meilleure solution pour éviter que votre enquête ne soit interrompue consiste toutefois à activer la nouvelle expérience de participation aux enquêtes.

• Couleur : Configurez la couleur d'arrière-plan du créatif en choisissant dans la palette de sélection des couleurs.
• Forme de la bordure : Configurez le rayon de la bordure de votre créatif. Ce paramètre détermine le degré d'arrondi des angles. Vous avez le choix entre Aucun, Légèrement arrondi, Modérément arrondi, Très arrondi.
• Ombre portée : Configurez l'ombre portée entourant votre créatif. Vous avez le choix entre Aucun, Léger, Moyen et Lourd.
• Accessibilité

  • Titre de l'Iframe : Ce texte sera lu par un lecteur d'écran lorsque le visiteur naviguera vers la fenêtre intégrée.

    

    Astuce : en ajoutant des titres aux iframes lors de la création de votre boîte de dialogue, vous garantissez l’accessibilité de celle-ci pour tous les utilisateurs.

Astuce : cliquez sur la flèche en bas à gauche pour afficher les libellés des sections. Pour n'afficher que les icônes de section, cliquez sur Masquer les étiquettes.

UTILISER UN MODÈLE

Si vous souhaitez importer un thème d’enquête dans les paramètres de style de la création, cliquez sur « Utiliser un modèle ».

---

×

close

Les thèmes sont créés par l'administrateur de l'organisation à l'intention des utilisateurs de son organisation. Sélectionnez une organisation dans le menu déroulant, puis cliquez sur Importer. Si vous souhaitez ajouter un thème à cette Liste, contactez votre Administrateur de l'Organisation pour plus d'informations.

---

×

close

L'importation d'un modèle de thème permet d'ajuster les paramètres suivants pour le créatif :

• Couleur primaire
• Couleur secondaire
• Couleur d’arrière-plan
• Taille du texte de la question
• Taille du texte de la réponse
• Espacement des questions
• Contraste du premier plan
• Logo

Astuce : les paramètres de la création ne sont pas liés au thème utilisé comme modèle. Les paramètres du Créatif ne sont pas mis à jour si le thème du modèle change, et la modification des paramètres du Créatif ne changera pas le thème du modèle.

CSS personnalisé

Vous pouvez personnaliser le CSS du dialogue réactif comme vous le souhaitez en cliquant sur le bouton « Personnaliser le CSS ». Vous pouvez ajouter des classes et des propriétés personnalisées en plus des classes et propriétés par défaut. Les modifications apportées ici peuvent ne pas être reflétées dans l'aperçu ; n'oubliez pas de tester votre intercept avant de le déployer en effectuant la configuration guidée.

Attention : Le code suivant est fourni tel quel et sa mise en œuvre nécessite des connaissances en programmation. Le support de Qualtrics ne propose pas d'assistance ou de consultation sur le codage personnalisé. Vous pouvez plutôt tenter de vous adresser à notre communauté d'utilisateurs dédiés.

Message

Dans la section « Message », vous pouvez configurer le titre et la description qui s'afficheront sur votre création. Le titre doit généralement être une courte phrase qui capte l'attention du visiteur, tandis que la description donne plus de détails sur la raison pour laquelle le créatif lui est apparu.

La police de caractères sera adoptée à partir du site web qui affiche le créatif. Pour le titre et la description, vous pouvez personnaliser le texte, la taille et la pondération des caractères.

---

×

close

Boutons

Dans la section « Boutons », vous pouvez configurer les options spécifiques au nombre, à l'apparence et à la cible de chaque bouton.

---

×

close

Astuce : Les polices des boutons doivent être définies explicitement dans le CSS de votre site. Si aucune police n'est définie, les boutons utiliseront les paramètres par défaut définis par le navigateur de l'utilisateur.

Logos &amp ; Images

Dans la section « Logos et images », vous pouvez sélectionner une ou plusieurs images ou logos à inclure dans votre création créative.

---

×

close

Vous pouvez choisir de mettre en ligne une image distincte pour les appareils mobiles et pour les ordinateurs de bureau, afin que des images différentes s'affichent selon que la publicité est consultée sur un navigateur mobile ou sur un navigateur de bureau. Vous pouvez également télécharger la même image mais avec des résolutions différentes afin d'optimiser l'affichage sur l'un ou l'autre type de navigateurs d'appareils.

Astuce : Si vous ne téléchargez une image que pour les mobiles, cette image sera utilisée pour les navigateurs mobiles ainsi que pour les navigateurs de bureau. Toutefois, si vous ne téléchargez une image que pour l'ordinateur de bureau, cette image ne sera utilisée que pour les navigateurs de bureau.

Pour rendre l'image conforme aux normes d'accessibilité, vous avez également la possibilité de définir un texte alternatif associé à ces images. (Le texte Alt est une fonction qui permet aux lecteurs d'écran de décrire une image aux utilisateurs souffrant de déficiences visuelles)

Animation

Dans la section « Animation », vous pouvez choisir le type d'animation (fondu ou glissement)  que vous souhaitez pour votre création lorsqu'elle s'affiche à l'écran.

---

×

close

• Afficher la boîte de dialogue après : nombre de secondes après que l'utilisateur a rempli les conditions d'interception (par exemple, lorsqu'il clique dans l'application) avant que cette boîte de dialogue n'apparaisse.
• Définir un délai pour la fermeture de la boîte de dialogue : Déterminez la durée pendant laquelle la boîte de dialogue doit se fermer d'elle-même après son apparition. Désélectionnez cette option pour obliger l'utilisateur à fermer la boîte de dialogue afin de la supprimer de l'écran.

• Type de transition : Choisissez si le créatif s'efface ou glisse sur l'écran lorsqu'il apparaît. Si vous choisissez l'animation Slide In, vous pouvez également sélectionner la position finale du créatif sur l'écran (en haut à gauche, en haut à droite, en bas à gauche, en bas à droite).

  

  Astuce : l'utilisation du type de transition Slide In permet à ce créatif de se comporter comme un Curseur Créatif.

  

  Astuce : la commande « Fade » affiche une fenêtre en plein écran et verrouille le focus du clavier dans la boîte de dialogue. Sur ordinateur, la fonctionnalité « Slide In » ne recouvre pas la page et ne retient pas le focus ; les utilisateurs du clavier peuvent donc continuer à naviguer dans la page à l'aide de la touche Tab. Sur mobile, « Slide In » utilise une superposition et retient le focus, tout comme « Fade ».

• Fond en fondu : couleur de l'écran de l'appareil derrière le créatif (Aucun, Clair, Moyen ou Foncé).
• Affichage de l'enquête: L'endroit où l'enquête sera affichée (Nouvelle fenêtre, Fenêtre intégrée, Fenêtre actuelle, Fenêtre contextuelle ou Nouvel onglet).

Si nécessaire, vous pouvez également prévisualiser vos paramètres d'animation sur cet écran en cliquant sur « Prévisualiser l'animation ».