prehidingStyle
La propriété prehidingStyle vous permet de définir un sélecteur CSS pour masquer le contenu personnalisé jusqu’à son chargement. Cette propriété est utile dans les implémentations synchrones du SDK Web pour éviter le scintillement. Adobe recommande d’utiliser le fragment de code de masquage préalable pour les implémentations asynchrones du SDK Web.
Les sélecteurs CSS que vous définissez dans cette propriété commencent à masquer le contenu lorsque vous exécutez la première commande sendEvent sur une page. Le contenu est démasqué lorsqu’une réponse d’Adobe est reçue, qui inclut généralement du contenu personnalisé. Le contenu est également démasqué si la commande sendEvent échoue ou expire.
Si vous incluez prehidingStyle et le fragment de code de masquage préalable dans votre mise en oeuvre, le fragment de code de masquage préalable est prioritaire sur cette propriété de configuration.
Prémasquage du style à l’aide de l’extension de balise SDK Web
Sélectionnez le bouton Fournir un style de prémasquage lors de la configuration de l’extension de balise.
- Connectez-vous à experience.adobe.com à l’aide de vos informations d’identification Adobe ID.
- Accédez à Collecte de données > Balises.
- Sélectionnez la propriété de balise de votre choix.
- Accédez à Extensions, puis cliquez sur Configurer sur la carte SDK Web Adobe Experience Platform.
- Faites défiler l’écran jusqu’à la section Personalization, puis sélectionnez le bouton Fournir un style de prémasquage.
- Ce bouton ouvre une fenêtre modale avec un éditeur CSS. Insérez le sélecteur CSS et le bloc de déclaration de votre choix, puis cliquez sur Enregistrer pour fermer la fenêtre modale.
- Cliquez sur Enregistrer sous les paramètres d’extension, puis publiez vos modifications.
Prémasquage du style à l’aide de la bibliothèque JavaScript du SDK Web
Définissez la chaîne prehidingStyle lors de l’exécution de la commande configure. Si vous omettez cette propriété lors de la configuration du SDK Web, rien n’est masqué lors de l’exécution de la première commande sendEvent sur une page. Définissez cette valeur sur le sélecteur CSS souhaité et le bloc de déclaration pour les bibliothèques chargées de manière synchrone.
alloy("configure", {
datastreamId: "ebebf826-a01f-4458-8cec-ef61de241c93",
orgId: "ADB3LETTERSANDNUMBERS@AdobeOrg",
prehidingStyle: "#container { opacity: 0 !important }"
});