Dans cet article, nous allons voir comment configurer la possibilité de fermer un élément Engage, qu'il s'agisse d'éléments à l'intérieur de votre contenu, ou bien en surimpression (formats modale / popin). C'est parti !
Faire disparaitre un élément au clic sur un bouton
Pour permettre à vos utilisateurs de fermer un élément Engage en cliquant sur un bouton, suivez ces étapes :
Modifier un élément : Accédez à votre dashboard Engage et sélectionnez l'élément que vous souhaitez modifier.
Ajout ou modification d'un composant Bouton : Ajoutez un nouveau bouton ou modifiez un bouton existant dans votre élément.
Action : Configurez l'action du bouton pour qu'il détruise entièrement l'élément. Cette action garantit que l'élément disparaitra complètement au moment du clic.
Faire disparaitre un élément au clic sur une image
Vous souhaitez permettre la fermeture d'un élément au clic sur une image, telle qu'une icône en forme de croix ? procédez comme suit :
Modifier un élément
Ajout ou modification d'un composant Image : Ajoutez une image ou modifiez une image existante dans l'élément.
Détruire l'élément au clic sur le bloc > Oui
Voici un exemple fonctionnel illustrant la fermeture d'un élément au clic sur une image :
Fermer un élément en surimpression (modale, popin)
Les éléments en surimpression peuvent être configurés pour se fermer de deux manières différentes :
Avec la fonctionnalité native CSS conteneur parent
Configurer le CSS conteneur parent : Utilisez cette fonctionnalité native pour permettre un affichage modale en autonomie depuis le dashboard, sans nécessiter d'intervention technique supplémentaire.
Cliquez sur le bouton Modifier les propriétés de l'élément
Déroulez Configuration avancée
Ciblez le conteneur parent en commençant par
#p3-parent-frame {Appliquez le style que vous souhaitez obtenir en utilisant les propriétés CSS de votre choix
Configurer la fermeture : Suivez les instructions des sections précédentes pour configurer la fermeture via un bouton ou une image.
En ciblant une balise présente sur votre site
ℹ Cette option nécessite une intervention technique sur le html de votre page.
Renseigner l'#ID ou la .classe de la balise dans la condition d'affichage nommée "Dans un élément cible". L'élément Engage va alors s'insérer à cet emplacement sur votre page.
Intégrer des conditions d'affichage et de masquage basées sur les events. Se référer à la section "Intégrer une condition d'affichage et de masquage de la div" sur cet article pour plus de détails. Cette méthode est à réserver aux utilisateurs avancés, qui souhaitent tirer partie de balises déjà présentes sur leur site.
Vous savez désormais comment permettre à vos lecteurs de fermer un élément, que ce soit via un bouton, une image, ou en utilisant une fonctionnalité plus avancée.
Une question ? Contactez nous sur le chat 😉