Comment configurer le widget Ajouter à l'écran d'accueil pour les notifications push Web iOS

Les utilisateurs d'iOS ne peuvent recevoir des notifications push web que lorsqu'un site web a été ajouté à leur écran d'accueil et ouvert en tant qu'application web. Les visiteurs qui naviguent sur votre site directement dans Safari ou tout autre navigateur sur leur iPhone ou iPad ne verront pas d'invite d'abonnement aux notifications push et ne pourront pas s'abonner.

Le widget Ajouter à l'écran d'accueil résout ce problème. Lorsqu'un visiteur iOS arrive sur votre site dans un navigateur, PushEngage détecte que le site n'est pas exécuté en mode écran d'accueil et affiche une fenêtre contextuelle qui le guide à travers le processus : appuyez sur le bouton Partager, choisissez Ajouter à l'écran d'accueil, puis ouvrez le site à partir de l'icône sur son écran d'accueil. Une fois qu'il le fait, l'invite d'abonnement standard aux notifications push apparaît et il peut s'abonner comme n'importe quel autre visiteur.

Ceci est une fonctionnalité que PushEngage a ajoutée suite à des demandes directes de clients, et son activation est l'étape la plus importante que vous puissiez entreprendre pour développer votre base d'abonnés aux notifications push iOS.

Prérequis

Avant d'activer le widget, assurez-vous que votre configuration répond aux exigences suivantes :

  • iOS 16.4 ou version ultérieure. Le widget ne s'affiche que sur iOS 16.4 et versions supérieures. Les visiteurs utilisant des versions antérieures d'iOS ne le verront pas, et les notifications push web ne sont pas prises en charge sur ces versions de toute façon.
  • Manifeste d'application web. Pour les versions d'iOS antérieures à la 26, votre site doit inclure un manifeste d'application web lié dans l'en-tête <head> de la page (<link rel="manifest" href="/manifest.json">). Sans cela, iOS n'affichera pas la bonne icône et le bon nom de site lorsque le visiteur l'ajoutera à son écran d'accueil. Sur iOS 26 et versions ultérieures, un manifeste est recommandé mais pas obligatoire.

Si vous utilisez un plugin WordPress ou un constructeur de site web hébergé, votre thème peut déjà inclure un manifeste. Vous pouvez le confirmer en consultant le code source de votre page et en recherchant rel="manifest".

Trouver le widget

Dans votre tableau de bord PushEngage, accédez à Design » Widgets. Faites défiler la page jusqu'en bas pour trouver la section Ajouter à l'écran d'accueil.

Cliquez sur le bouton pour activer le widget. Une fois activé, il apparaîtra automatiquement aux visiteurs iOS éligibles qui ouvrent votre site dans un navigateur plutôt que depuis une icône de l'écran d'accueil.

Pour personnaliser le texte et l'apparence, cliquez sur Modifier la fenêtre contextuelle.

Modification du widget

La page Modifier Ajouter à l'écran d'accueil est divisée en quatre sections : Détails de base, Personnalisation de l'interface utilisateur, Comportement d'affichage et Ciblage d'URL. Un aperçu en direct sur la droite se met à jour au fur et à mesure que vous apportez des modifications, vous permettant de voir exactement à quoi ressemblera la fenêtre contextuelle avant de l'enregistrer.

Détails de base

Cette section contrôle le contenu textuel de la fenêtre contextuelle.

Titre

Le titre de la fenêtre contextuelle. La valeur par défaut est « Ajoutez-nous à votre écran d'accueil ». La limite de caractères est de 124. Gardez ce texte court et direct : une instruction claire est plus efficace que plusieurs idées.

La limite de caractères est de 305. Le placeholder {{share_icon}} s'affiche comme l'icône du bouton Partager d'iOS dans le texte de l'instruction, ce qui permet aux visiteurs d'identifier facilement le bon bouton sans aucune ambiguïté. Vous pouvez placer {{share_icon}} n'importe où dans votre texte d'instruction et PushEngage remplacera l'image de l'icône lorsque la fenêtre contextuelle s'affichera.

Texte du bouton

L'étiquette du bouton de confirmation. La valeur par défaut est « Je l'ai ajouté ». La limite de caractères est de 47. C'est ce sur quoi les visiteurs appuient après avoir terminé les étapes : appuyer dessus indique à PushEngage qu'ils ont ajouté le site à leur écran d'accueil et ferme la fenêtre contextuelle.

Personnalisation de l'interface utilisateur

Cinq paramètres de couleur contrôlent l'apparence de la fenêtre contextuelle :

  • Couleur d'arrière-plan : l'arrière-plan de la carte de la fenêtre contextuelle (par défaut : blanc, #ffffff)
  • Couleur du texte : la couleur du titre et du texte de l'instruction (par défaut : presque noir, #0d0d0d)
  • Couleur du bouton : l'arrière-plan du bouton de confirmation (par défaut : violet PushEngage, #4642E5)
  • Couleur du texte du bouton : la couleur du texte sur le bouton de confirmation (par défaut : blanc, #ffffff)
  • Couleur du bouton de fermeture : la couleur du bouton X dans le coin supérieur droit de la carte (par défaut : presque noir, #0d0d0d)

Cliquez sur n'importe quelle vignette de couleur pour ouvrir le sélecteur de couleurs et entrer une valeur hexadécimale ou sélectionner une couleur. L'aperçu en direct se met à jour en temps réel.

Comportement d'affichage

Afficher le widget sur contrôle la fréquence d'apparition de la fenêtre contextuelle pour le même visiteur. La valeur par défaut est « Une fois par session », ce qui signifie que la fenêtre contextuelle s'affiche une fois par session de navigateur et peut réapparaître lors de la prochaine visite si le visiteur n'a pas encore ajouté le site à son écran d'accueil.

Délai de déclenchement (secondes) définit le nombre de secondes à attendre après le chargement de la page avant d'afficher la fenêtre contextuelle. La valeur par défaut est 0. Ajouter un court délai de 3 à 5 secondes peut réduire les frictions pour les visiteurs qui viennent d'arriver sur la page.

Ciblage d'URL

Par défaut, le widget apparaît sur chaque page de votre site. Vous pouvez utiliser le ciblage d'URL pour le restreindre à des pages spécifiques ou le supprimer sur d'autres.

Inclure les URL : lorsque cette option est activée, la fenêtre contextuelle s'affiche uniquement sur les pages dont l'URL correspond aux règles que vous définissez. Ceci est utile si vous souhaitez que l'invite apparaisse uniquement sur les pages à forte intention telles qu'une page produit, une page de destination ou la page d'accueil.

Exclure les URL : lorsque cette option est activée, la fenêtre contextuelle est supprimée sur les pages dont l'URL correspond à vos règles. Utilisez ceci pour empêcher la fenêtre contextuelle d'apparaître sur les pages où elle serait perturbatrice, telles que les pages de paiement ou de gestion de compte.

Activez l'une ou l'autre option pour afficher le champ de saisie d'URL, sélectionnez une règle de correspondance (Contient, Commence par ou Exact), entrez une partie d'une URL et cliquez sur Ajouter une URL.

Une fois tous les paramètres configurés, cliquez sur Enregistrer les modifications en haut de la page.

Comment le widget fonctionne pour les visiteurs iOS

Lorsqu'un visiteur iOS éligible ouvre votre site dans un navigateur et que le site n'est pas encore en mode écran d'accueil, le popup du widget apparaît après le délai configuré. Le visiteur lit l'instruction, appuie sur le bouton Partager de son navigateur, sélectionne Ajouter à l'écran d'accueil et ajoute l'icône du site à son écran d'accueil.

La prochaine fois que le visiteur ouvre votre site en appuyant sur l'icône de l'écran d'accueil, le site se charge comme une application web. PushEngage le détecte et affiche l'invite d'opt-in standard pour les notifications push. Le visiteur peut alors appuyer sur Autoriser et s'abonner.

Appuyer sur le bouton de confirmation (« Je l'ai ajouté ») sur le widget ferme le popup mais ne souscrit pas le visiteur. L'abonnement se produit lorsqu'il ouvre le site depuis son écran d'accueil et répond à l'invite d'opt-in.

Questions fréquemment posées

Le widget s'affichera-t-il aux visiteurs Android ou de bureau ? Non. Le widget Ajouter à l'écran d'accueil n'est affiché qu'aux utilisateurs iOS sur iOS 16.4 et versions ultérieures qui visitent le site dans un navigateur plutôt que depuis une icône d'écran d'accueil. Les visiteurs Android et de bureau ne sont pas affectés.

Que se passe-t-il si un visiteur appuie sur le bouton de confirmation sans ajouter le site à son écran d'accueil ? Le bouton ferme le popup et PushEngage enregistre l'interaction comme terminée. Selon votre réglage « Afficher le widget sur », le popup peut réapparaître lors d'une future session si le visiteur revient via un navigateur et n'a toujours pas ajouté le site à son écran d'accueil.

Le widget fonctionne-t-il sur tous les navigateurs sur iPhone ? Oui. Sur iOS, tous les navigateurs, y compris Safari, Chrome, Firefox et Edge, utilisent le même moteur WebKit et partagent la même limitation concernant les notifications push web. Le widget apparaît quel que soit le navigateur utilisé par le visiteur, tant qu'il est sur iOS 16.4 ou une version ultérieure et que le site n'est pas ouvert en mode écran d'accueil.

Pourquoi un manifeste d'application web est-il requis pour iOS avant la version 26 ? Lorsqu'un utilisateur ajoute un site à son écran d'accueil, iOS lit le manifeste de l'application web pour déterminer le nom à afficher sous l'icône et l'image d'icône à utiliser. Sans manifeste, iOS utilise le titre de la page et une capture d'écran, ce qui peut sembler incohérent ou déroutant. Sur iOS 26 et versions ultérieures, ces informations peuvent également être déduites d'autres signaux de page, c'est pourquoi un manifeste est recommandé mais n'est plus strictement requis sur cette version.

Mon site a déjà des notifications push qui fonctionnent pour d'autres plateformes. Dois-je faire autre chose pour prendre en charge iOS ? Les seules étapes supplémentaires pour iOS consistent à activer le widget Ajouter à l'écran d'accueil et à vous assurer que votre site inclut un manifeste d'application web. PushEngage gère la diffusion des notifications une fois que les abonnés ont donné leur accord. Aucune configuration spécifique à iOS n'est nécessaire au-delà de ce qui est couvert dans cet article.

Si vous avez des questions sur le widget Ajouter à l'écran d'accueil ou si vous avez besoin d'aide pour votre configuration de notifications push web pour iOS, n'hésitez pas à nous contacter. Notre équipe de support sera ravie de vous aider.

Dernière mise à jour le 6 juillet 2026

Engagez et retenez les visiteurs après qu'ils aient quitté votre site Web

Augmentez la valeur de chaque visite web avec des notifications push difficiles à ignorer.

  • Plan gratuit à vie
  • Configuration facile
  • Support 5 étoiles