Las ventanas emergentes son ventanas modales de llamada a la acción que aparecen y se superponen a la página en un momento específico o bajo condiciones y desencadenantes específicos. Las ventanas emergentes están diseñadas para centrar la atención del Nom d'utilisateur una vez que ha realizado una acción.

Pour commencer, accédez à Modèles> Popups. Controle el diseño, las condiciones, las reglas y los estilos de la ventana emergente y luego diseñe el Contenu de la ventana emergente.

Noter: Cliquez sur l'icône de la roue dentée Fenêtre contextuelle Paramètres dans la barre d'outils inférieure du panneau pour modifier les paramètres de la fenêtre contextuelle.

Conception pop-up

Paramètres

La conception

1. Largeur: Définir la largeur exacte de la fenêtre contextuelle, en utilisant px ou vh
2. Hauteur: Définit la hauteur exacte de la fenêtre contextuelle, en utilisant px ou vh. Utilisez 100vh pour la largeur et la hauteur pour créer des fenêtres contextuelles en plein écran
3. Horizontal: Choisissez la position horizontale de la fenêtre contextuelle, entre Gauche, Centre ou Droite
4. Verticale: Choisissez la position verticale de la fenêtre contextuelle, en haut, au centre ou en bas
5. Couverture: Afficher ou masquer la superposition d'arrière-plan
6. Bouton Fermer: Choisissez Afficher ou Masquer le bouton Fermer
7. Afficher le bouton après x secondes (si Afficher le bouton de fermeture a été choisi) - Sélectionnez le nombre de secondes à attendre avant d'afficher le bouton de fermeture
8. Animation d'entrée: Choisissez l'animation d'entrée contextuelle, telle que le fondu et le zoom, dans les sélections déroulantes. Choisissez n'importe quel effet d'animation pour prévisualiser l'effet.
9. Quitter l'animation: Choisissez l'animation de sortie contextuelle, telle que le fondu et le zoom, dans les sélections déroulantes. Choisissez n'importe quel effet d'animation pour prévisualiser l'effet.
10. Durée de l'animation: Définit la durée de l'animation, en millisecondes

Configuration générale

1. Qualification: Saisissez le titre de la fenêtre contextuelle. Ce titre ne sera affiché que sur le backend, pas pour l'utilisateur.
2. État: Brouillon, en attente de révision, privé ou publié

Paramètres de prévisualisation

1. Prévisualiser le contenu dynamique comme: Choisissez parmi Fichiers, Pages, Articles, Médias ou 404 pages.

Remarque: pour afficher le contenu que vous avez choisi, vous devez recharger la page après avoir sélectionné le contenu dynamique.

Style

Surgir

1. Type de fonds: Elija un color de fondo, una imagen o un dégradé
2. Type de bordure: Sélectionnez le type de bordure, en choisissant parmi aucune, pleine, double, pointillée, pointillée ou rainurée
3. Rayon du bord: Définit le rayon de la bordure pour contrôler l'arrondi des coins de chaque côté de la fenêtre contextuelle
4. Ombre de la boîte: Ajuster les options d'ombre de la boîte

Couverture

1. Type de fonds: Choisissez une couleur d'arrière-plan, une image ou un dégradé

Bouton Fermer

1. Positionner: Choisissez d'afficher le bouton Fermer à l'intérieur ou à l'extérieur de la fenêtre contextuelle
2. Position verticale: Utilisez le curseur pour sélectionner la position verticale du bouton Fermer
3. Position horizontale: Utilisez le curseur pour sélectionner la position horizontale du bouton Fermer

Normal | Flotter

1. Couleur: Sélectionnez la couleur du bouton Fermer pour les états Normal et Survol
2. Couleur de l'arrière plan: Choisissez la couleur d'arrière-plan du bouton Fermer pour les états Normal et Survol
3. Taille: Définit la taille du bouton de fermeture

Avancée

Avancée

1. Afficher le bouton de fermeture après (secondes): Entrez un nombre de secondes. Le bouton de fermeture n'apparaîtra qu'après ce délai.
   
2. Fermer automatiquement après (ms): Saisissez le nombre de ms à attendre avant de fermer automatiquement la fenêtre contextuelle. Laissez vide pour désactiver l'arrêt automatique.
3. Évitez le chevauchement des fermetures: Sélectionnez Oui pour empêcher les utilisateurs de fermer la fenêtre contextuelle en cliquant sur la superposition.
4. Évitez de fermer avec la touche ESC: Sélectionnez Oui pour empêcher les utilisateurs de fermer la fenêtre contextuelle en appuyant sur la touche Échap.
5. Désactiver le défilement des pages: Sélectionnez Oui pour empêcher les utilisateurs de faire défiler la page affichée derrière la fenêtre contextuelle
6. Évitez les fenêtres contextuelles multiples: Si l'utilisateur a vu une autre popup sur la page qu'il visite, masquez cette popup en sélectionnant Oui
7. Ouvrir par sélecteur: Ingrese una lista de selectores que activarán manualmente la ventana emergente (ID de CSS, clases o elementos de datos). Vea las instrucciones
8. Marge: Ajuster les marges
9. Farci: Ajuste le remplissage autour de la fenêtre contextuelle
10. Classes CSS: Ajoutez votre classe personnalisée sans le point (par exemple ma classe)

CSS personnalisé

CSS personnalisé: Entrez votre propre CSS

Définir les conditions

termes le permite establecer en qué páginas de su sitio la toile aparecerá la ventana emergente.

Définissez les conditions qui déterminent où votre popup est utilisé (à l'exclusion de l'activation manuelle). Par exemple, ajoutez une condition Inclure et choisissez Singulier> Couverture pour afficher uniquement la fenêtre pop-up sur la page d'accueil du site. En savoir plus sur les conditions.

Définir des déclencheurs

Déclencheurs ce sont les actions des utilisateurs qui font apparaître votre campagne. Sélectionnez Oui ou Non pour chaque option qui ouvrira la fenêtre contextuelle.

1. Chargement sur la page: S'il est défini sur Oui, définissez le nombre de secondes à attendre, lors du chargement de la page, avant que la fenêtre contextuelle ne soit activée.
2. En déplacement: S'il est réglé sur Oui, sélectionnez la direction (vers le haut ou vers le bas) et la quantité de défilement avant l'activation de la fenêtre contextuelle. Faire défiler vers le bas est basé sur Pourcentage page défilée vers le bas; Le défilement vers le haut est basé sur nombre de pixels décalé vers le haut.
3. Lors du défilement vers l'élément: S'il est défini sur Oui, saisissez le nom du sélecteur (ID CSS) qui déclenchera la fenêtre contextuelle lorsque l'utilisateur y fera défiler. Vous devez également ajouter l'ID CSS dans l'onglet Avancé de l'élément.
4. En cliquant: S'il est défini sur Oui, saisissez le nombre de clics qui déclencheront la fenêtre contextuelle
5. Après l'inactivité: S'il est défini sur Oui, entrez le nombre de secondes d'inactivité de l'utilisateur qui déclenchera la fenêtre contextuelle.
6. Intention de sortie sur la page: Définissez Oui pour déclencher la fenêtre contextuelle lorsque l'activité de la souris de l'utilisateur indique l'intention de quitter la page

Règles avancées

Règles avancées spécifiez les autres conditions à remplir pour générer une fenêtre contextuelle.

1. Afficher après X pages vues: S'il est défini sur Oui, définissez le nombre de pages vues avant l'activation de la fenêtre contextuelle.
2. Afficher après X sessions: Si se establece en Sí, establezca el número de sesiones de usuario antes de que se active la ventana emergente (una sesión comienza cuando el usuario visita el sitio web y finaliza cuando el usuario cierra el le navigateur).
3. Présentez-vous jusqu'à X fois: Durée maximale d'affichage de la fenêtre contextuelle. Si Count est défini sur On Open, cela permettra uniquement à la fenêtre contextuelle de s'ouvrir autant de fois que le nombre configuré. Si Count est défini sur On Close, la fenêtre contextuelle ne s'ouvrira que jusqu'à ce que l'utilisateur l'ait fermée pour la énième fois, après quoi elle ne sera pas rouverte. Ce paramètre est défini sur le stockage local et y restera jusqu'à ce qu'il soit supprimé.
4. Al llegar de una URL específica: Si se establece en Sí, muestra u oculta la ventana emergente si un usuario llega desde una URL específica (ingresa la URL específica). Regex es una opción para que los usuarios avanzados establezcan reglas avanzadas para patrones de URL coincidentes.
5. Afficher en arrivant de: Si se establece en Sí, muestra si el usuario llega de los moteurs de recherche, une relier externo (ingrese la URL del enlace específico) y / o un enlace interno (ingrese la URL del enlace específico).
6. Masquer pour les utilisateurs enregistrés: Configúrelo en Sí para ocultar la ventana emergente para todos los usuarios que iniciaron sesión o para seleccionar roles personalizados. Para sitios web con cache, es posible que esta función no funcione correctamente
7. Afficher sur les appareils: Sélectionnez Oui pour choisir d'afficher sur un ordinateur de bureau, une tablette et / ou des appareils mobiles

Remarque: les fenêtres contextuelles ne peuvent pas être affichées plus d'une fois si la page n'est pas rechargée ou saisie à nouveau.

Contrôle de la fenêtre contextuelle par activation manuelle

Les fenêtres contextuelles peuvent être activées manuellement. Les liens dynamiques peuvent utiliser l'action contextuelle pour ouvrir ou fermer une fenêtre contextuelle. Le formulaire peut utiliser l'option Actions après soumission pour ouvrir ou fermer une fenêtre contextuelle. Tout élément peut utiliser un seul sélecteur (classe, ID ou élément de données) pour déclencher manuellement une fenêtre contextuelle lorsque l'utilisateur clique sur cet élément.

• À partir de n'importe quel élément de lien, choisissez Dynamique> Actions> Fenêtre contextuelle. Cliquer Surgir para seleccionar ya être Ouvrir la fenêtre contextuelle ou Fermer la fenêtre contextuelle. Si vous choisissez Fermer la fenêtre contextuelle, l'option «Ne pas réapparaître«Deviendra une option disponible.
• À partir d'un formulaire Elementor, choisissez Actions après l'envoi> Ajouter une action> Ouvrir la fenêtre contextuelle ou Fermer la fenêtre contextuelle
• À partir d'un Sélecteur personnalisé: Tout élément peut avoir un ensemble de sélecteurs qui peuvent être utilisés comme déclencheur manuel de pop-up. Modifiez l'élément et accédez à Avancé> Classes CSS (ou alors ID CSS) et donnez à l'élément un nom de classe (sans le point précédent) ou un nom d'identification (sans le # précédent). Dans les fenêtres pop-up termes, choisissez la page qui inclut l'élément avec le sélecteur unique (ex. Conditions> Inclure> Singulier> Pages> Titre de votre page). Lorsqu'un utilisateur visite cette page et clique sur l'élément, la fenêtre contextuelle est activée. Ceci est utile pour ouvrir une fenêtre contextuelle à partir d'un élément du menu de navigation d'un thème, du contenu d'un widget Editeur de texte, d'un élément ou d'un script non Elementor, etc.

Lors de l'activation d'une popup à partir d'un sélecteur personnalisé, notez que l'élément n'a pas besoin d'être un "lien". Un élément qui n'est normalement pas cliquable, tel que du texte brut, peut également être cliqué pour générer la fenêtre contextuelle. Notez également que le Déclencheurs y Règles avancées sera ignoré lors de l'utilisation de cette option.