Section sur le code personnalisé

La section Code personnalisé vous permet d’intégrer directement votre propre HTML et CSS sur la page d’accueil de la base de connaissances. Il existe pour des situations où les blocs de corps standards comme le texte enrichi, les cartes multicolonnes, l’image avec texte – ne vous offrent pas la mise en page ou la fonctionnalité dont vous avez besoin. Avec ce bloc, vous avez un contrôle total sur ce qui se rend et son apparence, ce qui en fait le bon choix pour le contenu dynamique, les embeds tiers ou les traitements visuels personnalisés impossibles à utiliser par les autres blocs.

Quand utiliser la section Code personnalisé

• Bannières dynamiques - affichez une promotion saisonnière, une annonce de lancement de produit ou un avis de maintenance en utilisant du HTML personnalisé que vous pouvez mettre à jour indépendamment de la mise en page.
• Minuteurs de compte à rebours - Intégrez un compte à rebours alimenté par JavaScript pour des événements, lancements ou offres à durée limitée.
• Widgets tiers intégrés - Ajoutez des insertions provenant de services externes comme des lecteurs vidéo, des constructeurs de formulaires, des widgets de chat ou des badges de page de statut, qui n’ont pas de bloc dédié.
• Contenu personnalisé - Lorsque vous avez besoin d’une mise en page ou d’un traitement visuel spécifique qui n’est pas possible avec le texte enrichi ou les blocs de cartes multicolonnes, écrivez votre propre HTML et CSS pour y parvenir.

Comment ajouter une section de code personnalisé

1. Naviguez dans () dans la barre de navigation de gauche du portail de la base de connaissances.
2. Dans le panneau de navigation de gauche, naviguez vers Knowledge base site > personnalisation du site.
3. Cliquez sur le bouton Personnaliser le site .

4. Dans le menu déroulant de gauche, sélectionnez Page d’accueil . La section Corps affiche la liste des blocs corporels.
5. Cliquez sur Ajouter la section et sélectionnez la section Code personnalisé. Le bloc est ajouté à la liste.
6. Utilisez l’icône Réordre () pour réarranger le bloc. Les icônes de Réordre et de Masquer () apparaissent lorsque vous survolez un bloc de corps dans la section Corps.

Comment configurer la section Code personnalisé

1. Cliquez sur le bloc de section Code personnalisé pour ouvrir l’éditeur.
2. Dans l’onglet HTML , ajoutez ou modifiez votre code HTML.
3. Dans l’onglet CSS , ajoutez ou modifiez votre code CSS.
4. Cliquez sur Enregistrer pour sauvegarder vos modifications en tant que brouillon.
5. Cliquez sur Aperçu pour voir comment le code se rend sur le site de la base de connaissances.
6. Cliquez sur Publier pour afficher les changements.

Meilleures pratiques

• Faites toujours un aperçu avant de publier – les différences de rendu entre l’éditeur et le site en ligne peuvent être subtiles. Utilisez l’option Aperçu pour vérifier la mise en page et le style avant de vous engager.
• Gardez le HTML autonome – évitez de référencer des feuilles de style ou scripts externes qui pourraient bloquer le chargement des pages ou entrer en conflit avec les styles propres de Document360.
• Définissez votre CSS – utilisez des noms de classes spécifiques pour vos éléments personnalisés afin d’éviter de remplacer les styles par défaut du site.
• Utilisez l’onglet CSS pour tous les styles – garder les styles séparés du balisage facilite la maintenance et la mise à jour du code.
• Testez entre le mode clair et le mode sombre – si votre base de connaissances supporte le mode sombre, vérifiez que votre code personnalisé se rend correctement dans les deux.

FAQ