---
sourceDocument: Interface utilisateur de la Now Platform Xanadu
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/fr-FR/xanadu/platform-user-interface

 Release :

    - xanadu

ft:locale :

    - fr-FR

ft:publication_title :

    - Interface utilisateur de la Now Platform Xanadu

ft:clusterId :

    - platux

bundleId :

    - platux

workflow :

    - Platform


---

# Cloner un widget

# Cloner un widget {#ariaid-title1}

* Rversion finale: Xanadu
* 
* Mis à jour 1 août 2024
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 1 minute de lecture

Tirez parti du code existant en clonant et en modifiant un widget existant.

## Avant de commencer

Rôle requis : admin ou sp_admin

## Pourquoi et quand exécuter cette tâche

Remarque :  
Les widgets du système de base sont en lecture seule afin que vous puissiez profiter des futures mises à jour. Pour apporter des modifications, vous pouvez cloner des widgets du système de base. Cependant, les widgets clonés sont considérés comme des widgets personnalisés et ne bénéficient pas des futures mises à jour apportées aux widgets à partir desquels ils ont été clonés.

## Procédure

1. Ouvrez l'éditeur de widget dans la page de configuration de Service Portal, puis sélectionnez un widget existant dans la liste Sélectionner un widget .  
   Par exemple, sélectionnez Hello World 2.
2. Dans le menu de liste dans l'en-tête du widget, cliquez sur Cloner \<\< Hello World 2 \>\>.  
   Figure 1. Cloner un widget
3. Saisissez un nom pour le widget cloné.  
   L'ID du widget est créé automatiquement en fonction du nom du widget.
4. **Facultatif :** Sélectionnez Créer une page de test pour créer automatiquement une page contenant le widget.
5. Utilisez les cases à cocher pour afficher ou masquer les différents composants de l'éditeur de widget selon vos besoins.  
   Apportez des modifications au modèle HTML, au CSS, au script client, au script serveur ou à la fonction de lien.  
   Figure 2. Clone de Hello World 2
6. Pour activer un aperçu de votre widget, utilisez l'option Activer l'aperçu dans le menu.  
   Utilisez l'icône en forme dœil qui apparaît pour afficher ou masquer un aperçu de votre widget.
{#t_CloneAndEditAWidget__steps_qpj_g5m_2v}

## Que faire ensuite

Si vous clonez un widget qui utilise le modèle Angular ng-template, vous devez cloner manuellement le modèle et modifier le nom de la référence du modèle dans le widget.

Par exemple, le widget de menu d'en-tête utilise le menuTemplate ng-template `angulaire`. Si vous clonez le widget de menu d'en-tête, vous devez également cloner le `menuTemplate` et lui attribuer un nom unique. Lorsque vous ouvrez le clone du widget de menu d'en-tête, vous pouvez voir une référence au menuTemplate dans le code HTML.  
Figure 3. menuTemplate dans le widget d'en-tête HTML