Modifier le HTML et le CSS de votre widget ou microsite pour Advocate

Vous pouvez personnaliser vos widgets Advocate et votre microsite avec du HTML et du CSS supplémentaires afin de mieux les aligner avec l’apparence et l’identité visuelle de votre marque. Grâce à l’éditeur HTML intégré d’Advocate, vous pouvez ajouter de la structure, du style et même remplacer certains composants par défaut pour une personnalisation plus poussée.

Remarque: La modification personnalisée du HTML/CSS est uniquement disponible pour certaines éditions d’Advocate. Contactez l’assistance pour mettre à niveau votre compte et accéder à cette fonctionnalité.

Pourquoi utiliser du HTML ou du CSS personnalisé ?

Le HTML personnalisé et le CSS en ligne vous permettent de :

  • Respecter plus fidèlement les directives de marque de votre entreprise

  • Reformater la mise en page et les espacements

  • Appliquer des styles au-delà de ceux disponibles dans l’éditeur par défaut

  • Remplacer le style de certains composants du widget ou du microsite

Modifier le HTML ou le CSS

Vous pouvez modifier le HTML ou le CSS pour apporter d’autres personnalisations à votre microsite à l’aide de l’éditeur HTML intégré. Bien que l’éditeur HTML offre davantage de flexibilité dans la conception du microsite, gardez à l’esprit que nous ne sommes pas en mesure de dépanner les ajustements effectués avec du HTML ou du CSS personnalisé.

  1. Dans le menu de navigation de gauche, sélectionnez [Engage] v2 [Engage] → Contenu.

  2. Sur la carte du microsite, sélectionnez Modifier le contenu.

  3. Dans l’onglet Microsite, sélectionnez la mise en page ou la page dont vous souhaitez modifier le code.

  4. Sélectionnez [Vue du code] dans la barre de menu supérieure.

  5. Ajoutez ou modifiez le HTML et le CSS selon les besoins.

  6. Le CSS peut être ajouté de trois façons :

    • En important une feuille de style CSS externe

    • En haut de la page dans une <style> balise :

    <style>
      p {
        color: blue;
      }
    
      .exampleClass {
        color: green;
        font-size: 25px;
        text-align: center;
      }
    
      #exampleId {
        color: red;
        font-size: 30px;
      }
    </style> 
    • En ligne, pour appliquer un style à un élément HTML spécifique :

    <h3 style="font-size:30px;color:blue;">Recevez une récompense lorsque votre ami utilise notre produit</h3> 
  7. Sélectionnez [Pinceau] pour prévisualiser vos modifications.

  8. Sélectionnez Enregistrer le brouillon pour enregistrer, ou Publier pour mettre les changements en ligne.

Modifier les composants à l’aide des parties CSS

Certains composants intégrés de votre widget ou microsite ne peuvent pas être entièrement stylisés via l’éditeur visuel. Dans certains cas, vous pouvez remplacer leur apparence à l’aide de parties CSS, qui offrent un contrôle plus granulaire.

Si vous souhaitez effectuer des mises à jour de style avancées, l’équipe d’impact.com peut vous conseiller sur ce qui est possible et partager les sélecteurs de parties CSS pertinents. Si vous souhaitez modifier des composants avec des parties CSS, contactez votre équipe Advocate Implementation ou l’équipe d’assistance post-lancement.

Mis à jour

Ce contenu vous a-t-il été utile ?