pagefly.ioRemarque
Cette fonctionnalité peut ne pas fonctionner sur certains thèmes Shopify selon la façon dont le développeur du thème crée le thème.
Cette fonctionnalité ne s’applique qu’à une section. Si vous avez besoin de rendre un bouton collant, veuillez contacter notre équipe d’assistance. (cette documentation ne s’applique pas pour rendre un bouton collant).
Dans cet article, vous apprendrez à créer une section collante avec le code CSS personnalisé.
Comment faire une section collante
Étape 1: Cliquez sur la section que vous souhaitez rendre collante
Étape 2: Accédez à l’onglet Général > Faites défiler jusqu’à Activer le haut collant > Sélectionnez Oui.
Remarque: Cette fonctionnalité ne fonctionne que sur la page en direct et peut ne pas fonctionner en raison d’un conflit de thème.Maintenant, choisissez le bouton Publier dans la barre de menu et accédez à la page en direct pour voir le résultat.
Configuration
Lorsque vous activez la fonction Activer le haut collant, vous devez régler deux paramètres avancés.
| Décalage supérieur: pour ajuster l’espacement entre le bord supérieur de la fenêtre d’affichage et la section collante |  |
| Z-index (dans le bouton Plus de paramètres): Niveau de pile d’une section, une avec un niveau de pile plus élevé sera devant une plus basse |  |
La section collante des cas courants ne fonctionne pas
La section n’est pas collante
Bien que vous ayez suivi toutes les étapes ci-dessus, la section collante ne fonctionne toujours pas. Vous ne savez pas pourquoi ?
J’ai mis cette section collante mais cela ne fonctionne pas sur la vue en direct:
La raison en est qu’il existe une section conteneur de cette section comprenant un code du thème qui est “overflow:hidden;“. Ce code remplace le code collant et empêche la section collante de fonctionner. Pour résoudre ce problème, veuillez suivre ces étapes :
- Sur la page en direct, faites un clic droit sur la section collante et ouvrez Inspecter
- À partir de la section collante, vérifiez les sections contenant cette section une par une
- Vérifiez jusqu’à ce que vous voyiez le code “overflow:hidden;” dans l’onglet Styles de la section
- Copiez le nom de classe de cette section. Retournez à l’éditeur de page PageFly, ouvrez l’éditeur de code personnalisé et ajoutez ce code:
.classname {overflow: visible !important;}
Dans ce cas, le nom de classe de la section est “pagefly-container” donc le code que vous devez ajouter est: https://pastebin.com/raw/YkX4J7z6
- Publiez la page et vérifiez la Vue en direct
Si vous avez suivi les solutions ci-dessus, la section collante ne fonctionne toujours pas, veuillez nous contacter via l’application Live Chat 24/7 afin que nous puissions vous aider directement.
Si vous avez d’autres questions, n’hésitez pas à rejoindre notre communauté. Cette communauté est exclusive aux marchands PageFly uniquement avec nos experts et marchands du monde entier!
Previous article
