Puis-je ajouter un code personnalisé à mon ancienne landing page ?
Vous pouvez ajouter un code personnalisé (HTML, CSS et JavaScript) à votre landing page en utilisant l’espace réservé au code personnalisé dans l’éditeur de landing page . Utilisez cette option chaque fois que vous souhaitez ajouter des outils et des widgets non inclus dans l’éditeur.
Le code est ajouté aux versions desktop et mobile de votre landing page. Si vous souhaitez effectuer des tests A/B sur votre landing page, veillez à ajouter le placeholder à chaque variante. Vous pouvez également l’ajouter à une page de remerciement.
Il y a quelques points à garder à l’esprit lorsque vous travaillez avec du code personnalisé :
- Vous ne pouvez ajouter du code personnalisé que dans la section <body>.
- Pour être conforme au GDPR, assurez-vous d’informer vos leads et vos visiteurs que vous utilisez des formulaires ou du code tiers impliquant la cartographie thermique ou le suivi.
- L’ajout de plusieurs codes de suivi, widgets, etc. peut ralentir votre landing page. De plus, si vous surchargez votre landing page avec du contenu, les visiteurs risquent de cliquer dessus.
- Lorsque vous travaillez dans l’éditeur de la landing page, vous ne verrez que l’espace réservé. Le script ne s’exécute qu’en mode prévisualisation et dans une page publiée. Vous devez donc inspecter la page juste après l’avoir publiée pour vérifier qu’elle fonctionne comme vous l’aviez prévu. Vous ne devez pas partager le lien vers la page avant de vous être assuré de sa qualité.
- Il est conseillé de vérifier que la page contenant le code s’affiche correctement dans tous les navigateurs web, en particulier si vous modifiez des feuilles de style CSS.
- Notre équipe Customer Success peut vous fournir une assistance pour les fonctionnalités standard disponibles dans l’éditeur. Nous ne pouvons pas offrir d’assistance ni garantir la fonctionnalité d’autres scripts tiers.
Vous pouvez ajouter le code personnalisé à n’importe quel modèle nouveau ou existant dans l’éditeur. Voici comment procéder :
1. Allez dans Landing pages et faites l’une des choses suivantes :
- cliquez sur le bouton Créer landing page pour construire une nouvelle page
- sélectionnez Modifier la page dans le menu Actions situé à côté du nom de la page
2. Double-cliquez sur l’icône Code personnalisé pour ajouter le placeholder au modèle.
Le placeholder apparaît dans le coin supérieur gauche de la section affichée.
Lorsque vous double-cliquez sur l’icône, une fenêtre modale s’ouvre automatiquement pour vous permettre de saisir le code.
3. (Facultatif) Faites glisser le marqueur si vous souhaitez qu’il apparaisse à un endroit précis de la page. Double-cliquez sur l’espace réservé pour ouvrir une fenêtre modale dans laquelle vous pouvez saisir le code.
4. Collez ou tapez le code. Veillez à entourer vos scripts de balises <script> (pour JavaScript). Si vous ajoutez plusieurs extraits de code, collez-les les uns sous les autres.
5. (Facultatif) Si vous effectuez un test A/B, répétez les étapes 2 à 4 pour chaque variante de la page.
6. Lorsque vous créez une nouvelle page, cliquez sur l’icône de téléphone portable pour générer une version adaptée aux téléphones portables de votre page. Si vous modifiez une page existante, cliquez dessus pour vérifier si vous approuvez les modifications.
7. (Facultatif) Cliquez sur Aperçu pour vérifier si le code affiche correctement les éléments que vous avez ajoutés et qui doivent être visibles par vos visiteurs.
8. Enregistrez les modifications ou publiez la landing page.
9. Affichez la landing page publiée pour vérifier qu’elle s’affiche correctement.