Personnaliser l'en-tête de votre API Portal

Personnalisez l'en-tête de votre API Portal pour afficher les informations utilisateur·trice et un bouton Log out (Déconnexion).

Pourquoi et quand exécuter cette tâche

Vous pouvez personnaliser les fichiers HTML de l'API Portal pour ajouter des éléments personnalisés si nécessaire. La bonne pratique est de copier les dossiers et fichiers depuis themes/talend à la racine du dépôt. Ainsi, vous pouvez écraser les fichiers par défaut sans les modifier.

Avertissement : Si vous avez téléchargé une version mise à jour du thème après avoir écrasé les fichiers du thème, vous devez mettre à jour manuellement vos fichiers personnalisés.

Procédure

À la racine du dépôt de votre API Portal, créez un dossier layouts et, dans celui-ci, créez un dossier partials.
Copiez le fichier /themes/talend/layouts/partials/header.html dans le dossier /layouts/partials créé.
Vous avez à présent deux fichiers header.html dans le dépôt. Vous devez modifier celui dans /layouts/partials.
Dans votre nouveau fichier header.html, avant la balise de fermeture </ul>, ajoutez un élément <li> contenant un lien vers la page de déconnexion et les informations utilisateur·trice.
Exemple
```
  <li style="margin-left: auto; margin-right: 1em">
    <a href="/logout">Log out</a>
    <span id="user"></span>
  </li>
```

Après la balise de fermeture </ul>, ajoutez un élément <script> pour récupérer les informations utilisateur·trices depuis la route /me.

Exemple

<script>
  fetch('/me')
  .then(response => response.json())
  .then(me => document.getElementById('user').innerHTML = me.clientPrincipal.userDetails)
  .catch(e => document.getElementById('user').innerHTML = 'Anonymous');
</script>

Effectuez un commit de vos modifications.

Cette page vous a-t-elle aidé ?

Si vous rencontrez des problèmes sur cette page ou dans son contenu – une faute de frappe, une étape manquante ou une erreur technique – faites-le-nous savoir.

Laissez vos commentaires ici