Passer au contenu principal
Vous pouvez rendre votre widget adaptable aux appareils de vos visiteurs grâce au Widget Studio de Kameleoon. Votre widget est automatiquement responsive, mais vous pouvez apporter des modifications pour optimiser l’expérience utilisateur. Par défaut, les éléments utilisent des pourcentages au lieu de pixels (px) pour des mises en page plus flexibles. Les valeurs décimales sont prises en charge pour le dimensionnement en pourcentage, et les modèles par défaut appliquent automatiquement des pourcentages pour le dimensionnement des éléments. De plus, les éléments pop-up et bannière prennent en charge les unités viewport width (vw) et viewport height (vw) pour une véritable réactivité.

Basculer entre les appareils

En haut du Widget Studio, vous pouvez prévisualiser votre widget sur différents appareils (mobile, tablette, ordinateur) pour vous assurer qu’il s’affiche correctement.
Vous pouvez apporter des modifications à n’importe laquelle de ces vues.

Modifier la vue sur un appareil

Vous pouvez personnaliser les éléments de votre widget en fonction de l’appareil sur lequel il s’affiche. Personnalisez votre widget par appareil pour optimiser l’expérience de visualisation des visiteurs.

Priorité ordinateur

Ajoutez tous les éléments à la vue Ordinateur, qui est la configuration par défaut.
Vous pouvez adapter votre design à un autre appareil si nécessaire (mobile/tablette). Les modifications apportées à un autre appareil restent spécifiques à cet appareil et n’affecteront pas les autres.

Modifier un élément sur un appareil spécifique

Pour modifier un élément sur un appareil spécifique, cliquez sur l’une des icônes d’appareil en haut de la page, puis modifiez l’élément.

Masquer un élément sur un appareil spécifique

Pour masquer un élément sur un appareil spécifique :
  1. Sélectionnez l’élément que vous souhaitez masquer.
  2. Cliquez sur le menu trois points.
  3. Cliquez sur une icône d’appareil pour masquer l’élément.

Synchronisation des appareils

Avec la synchronisation des appareils, vous pouvez désigner un appareil leader pour chaque élément, et déterminer comment les paramètres de l’élément doivent être synchronisés entre l’appareil leader et les autres appareils. Vous devez choisir une règle de synchronisation pour tous les appareils suiveurs. Dans l’onglet Général de chaque élément, vous trouverez une section appelée Synchronisation des appareils.
Lorsque vous ouvrez cette section, il y a un label Appareil leader avec trois icônes cliquables : mobile, tablette et ordinateur. Par défaut, l’appareil leader sélectionné est l’ordinateur, mais vous pouvez sélectionner un autre appareil leader. Les paramètres appliqués sur un appareil leader seront répliqués sur tous les autres appareils qui sont entièrement ou partiellement synchronisés avec lui. Vous pouvez sélectionner l’option de synchronisation à l’aide du menu déroulant. Par défaut, la règle de synchronisation que vous appliquez à chaque appareil est Partiellement synchronisé. Le statut d’un appareil peut être :
  • Entièrement synchronisé : les propriétés, la position, la taille et les états de l’élément sont synchronisés avec l’appareil leader.
  • Partiellement synchronisé : tous les styles seront hérités de l’appareil leader jusqu’à ce que l’un des styles change sur un appareil.
  • Aucune synchronisation : aucun des paramètres de l’élément n’est synchronisé avec l’appareil leader.
  • Masquer : l’élément n’est pas visible sur l’appareil.

Configurer un événement de type “Appareil”

Vous pouvez également configurer un événement pour personnaliser l’affichage des éléments de votre widget en fonction de l’appareil. Pour ajouter un événement de type Appareil :
  1. Cliquez sur + Ajouter un événement > Appareil.
  2. Sélectionnez vos conditions.
  3. Cliquez sur Ajouter une action > Éléments.
Vous pouvez maintenant choisir d’afficher ou de masquer un élément spécifique.
Si vous avez précédemment masqué un élément sur un appareil spécifique (dans le menu trois points), cela est indiqué par des icônes dans le pop-in.