Le Popup, Banner & HTML Builder est l’action à tout faire pour afficher du contenu : promotions, annonces, popups de coupon, roues de la fortune, sliders hero, boutons de chat flottants, suivis de progression — tout ce qui se construit à partir d’un modèle ou de votre propre HTML, affiché en popup, en barre, en plein écran ou intégré dans la page.
En ajouter une
- Dans une campagne de ciblage et personnalisation, ouvrez l’étape Contenu et cliquez sur Ajouter une action.
- Choisissez Popup, Banner & HTML Builder. La galerie de modèles s’ouvre. Vous pouvez aussi choisir Partir de zéro et coller votre propre HTML, ou copier une action que vous avez déjà créée.
Les familles de la galerie (chacune renvoie à son article détaillé) :
- Coupon Popup — code promo avec copie au clic / révélation d’un texte flouté.
- Spin Wheel (empilée et côte à côte/plein écran) — roue des lots ludique.
- Hero Slider — jusqu’à quatre diapositives en rotation.
- Announcement Bar et Rotating Announcement Bar — bandeaux en haut / en bas.
- Status Tracker et barres de progression par paliers — progression en direct vers un objectif / de fidélité, à partir des valeurs du profil.
- Hover Bubble CTA — bouton de coin flottant qui ouvre une bulle de message (lancer un chat, réserver un appel).
- Center Modal, Full-Screen Overlay, Corner Toast, System Message, tiroirs verticaux et bannières.
- Multi-Step Quiz — questionnaire de vente guidée.
L’éditeur
Étape 1 — Concevez votre bannière ou popup. Cliquez sur n’importe quel élément directement dans l’aperçu en direct, ou dépliez son groupe dans la barre latérale. Chaque réglage a un bouton ⚡ Variations — des cas selon l’audience (langue, pays, visiteur récurrent, champ CRM…) avec une valeur par défaut, exactement comme décrit dans le guide du compte à rebours.
Ce que contiennent les groupes (Coupon Popup illustré ; les autres modèles varient) :
- Style — préréglage de couleurs, disposition de l’image, coins, animation d’entrée (pop…), ombre de la carte, CSS avancé de la carte.
- Coupon Code — le code lui-même et son Reveal Style : copy (cliquer pour copier dans le presse-papiers), reveal (flouté jusqu’au clic), display (toujours affiché).
- Text — surtitre, titre, corps, mentions ; chacun avec un interrupteur afficher/masquer, son propre point d’accroche CSS et ses Variations.
- Button — le texte, puis Open link (même fenêtre / nouvelle fenêtre) ou Run JavaScript ; Count clicks here (click target) en fait la cible de clic prise en compte pour le CTR ; animation facultative.
- Close — gardez le × intégré, ou choisissez dans la bibliothèque d’icônes (24 icônes) ou une image personnalisée. Don’t show again for N sessions : une fois qu’un visiteur l’a fermé, il reste masqué pendant ce nombre de sessions — 0 le laisse revenir à la visite suivante, 999 revient à ne plus jamais l’afficher.
- HTML Source (advanced) — le balisage complet, pour les développeurs.
Barre d’outils : Aperçu sur téléphone / tablette / ordinateur, Changer de modèle, Ajouter à vos modèles (enregistre votre version personnalisée pour la réutiliser), et Modifier l’action avec l’IA — décrivez la modification en langage courant et l’IA restyle ou réécrit l’action.
Règles d’affichage et emplacement
Étape 2 — Définir les règles d’affichage et l’emplacement :
- Élément intégré — s’affiche dans un ou plusieurs emplacements ; s’insère dans le contenu de votre page.
- Popup flottante — choisissez une position à l’écran ; puis l’animation d’entrée, un fond modal assombri facultatif, le comportement au défilement, le bouton de fermeture, la fermeture automatique. Les réglages qui ne s’appliquent qu’aux popups s’affichent désactivés pour l’intégré — l’écran garde sa forme.
- Tant que vous n’avez pas choisi d’emplacement, l’action n’a nulle part où s’afficher — l’étape l’indique explicitement : une action invisible n’est donc jamais un mystère.
- Déclencheurs — le moment où l’action s’ouvre. Il y en a onze, regroupés selon ce que fait le visiteur — voir Déclencheurs plus bas.
- Plafonds de fréquence — arrêter après une fermeture / un clic / N impressions, mode rafale, espacement après d’autres popups — chaque règle reformulée en langage courant avec vos chiffres.
Déclencheurs — quand la popup s’ouvre
Un déclencheur décide du moment où une action apparaît, une fois que les règles d’audience de la campagne ont déjà décidé qui la voit. Cochez-en autant que vous voulez : le premier qui se produit l’ouvre.
À l’arrivée
- À l’entrée sur la page — dès le chargement de la page. C’est aussi le comportement par défaut : si rien d’autre n’est coché, l’action s’ouvre au chargement.
- Afficher après un délai — un nombre de secondes, compté depuis le chargement de la page, quoi que fasse le visiteur.
- Après une inactivité de — aucun mouvement de souris, aucun clic, aucune touche. N’importe lequel des trois relance le compteur : le déclenchement a donc lieu après une vraie pause plutôt qu’à heure fixe.
Selon l’engagement
- Après avoir fait défiler jusqu’à — un pourcentage de la hauteur totale de la page.
- Si remontée en haut de page — le visiteur est descendu puis remonté.
- Quand du texte est copié — il a utilisé Cmd/Ctrl+C.
- Quand du texte est sélectionné — il surligne une phrase, avant de la copier. Le déclencheur attend environ une demi-seconde après que la sélection a cessé de changer, pour qu’un glisser se termine d’abord, et exige au moins dix caractères — un double appui accidentel sur un mot ne compte pas.
- Quand il arrête de faire défiler pendant — arrêté au milieu de la page, en train de lire plutôt que de survoler. Seul un vrai défilement lance le chronomètre : une page que personne ne fait défiler ne le déclenche donc jamais ; chaque nouveau défilement le relance.
À l’intention de sortie — désormais aussi sur téléphone
L’intention de sortie repose sur deux détecteurs indépendants, car quitter une page se présente de façon complètement différente avec une souris et sur un écran tactile. Cochez l’un, l’autre, ou les deux.
- Ordinateur — le curseur sort. Se déclenche quand le pointeur franchit le bord supérieur de la fenêtre, là où se trouvent le bouton de fermeture, les onglets et la barre d’adresse. Sortir par les côtés ou par le bas ne compte pas, car ce ne sont pas des sorties.
- Mobile — appui sur Retour. Le visiteur appuie sur Retour sur un appareil tactile. Le détecteur ne s’arme qu’après un engagement du visiteur — un défilement, un appui ou une frappe — jamais sur un simple chargement de page : quelqu’un qui repart immédiatement garde donc son bouton Retour. Une fois armé, un appui sur Retour ouvre l’action au lieu de quitter la page, qui reste en place ; l’appui suivant quitte normalement. Un rechargement le réarme.
Depuis votre propre code
- Sur un événement de votre site — appelez
_S_T.trigger("add_to_cart")depuis n’importe quel endroit de votre page au moment où la chose se produit, ou poussez{event: "add_to_cart"}dans votre data layer et utilisez le nom que vous avez déjà dans votre gestionnaire de balises. Les noms doivent correspondre exactement, majuscules comprises. Le déclencher avant le chargement de l’action ne pose aucun problème — l’action s’ouvre dès qu’elle arrive.
L’ouvrir depuis un élément de la page
Indépendamment des déclencheurs ci-dessus, une action peut être lancée par le visiteur : au clic ou au survol d’un élément que vous désignez, sur un élément que Personyze ajoute pour vous, ou sous forme de popup réductible qui reste repliée en onglet jusqu’à ce qu’on l’ouvre.
La mesurer
Le bouton marqué click target alimente le CTR de l’action ; les impressions, clics et fermetures remontent à l’étape Performance de la campagne et, si l’option est activée, dans Google Analytics. Pour comparer des designs entre eux, activez les tests A/B à l’étape Contenu.
