# Parcours d'apprentissage

Un widget de type `Parcours d'apprentissage` vous permet d'intégrer à votre produit ou votre site internet un parcours d'apprentissage spécifique pour délivrer de l’éducation contextuelle.

## Créer un widget

Pour créer un widget de type `Parcours d'apprentissage`, cliquez sur le bouton `Nouveau` en haut à droite puis sur `Parcours d'apprentissage`. Un panneau latéral permettant de créer un nouveau widget s'ouvre :&#x20;

* Choisissez le mode de rendu de votre widget :&#x20;
  * `Embed` : le widget est sous forme d'embed, vous pouvez l'intégrer n'importe où sur votre site ou votre application.
  * `Modale` : le widget est dans une fenêtre qui s'ouvrira au clic sur un bouton.
  * `Drawer` : le widget est dans un panneau latéral qui s'ouvrira au clic sur un bouton.
* Donnez un `titre`. :bulb: Ce titre ne sera pas visible dans le widget intégré au sein de votre application.
* Sélectionnez un parcours d'apprentissage à l'aide la barre de recherche.
* Cliquez sur `Créer` : ça y est, votre widget est prêt à être intégré ! :point\_right: [Plus d'information ici.](https://help.meltingspot.io/manage-spot/widget/implementation)

<figure><img src="https://2006110990-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJ79zpqfFC0YiOG6mb94n%2Fuploads%2FQF0wb3PEPwWod53vxYgP%2Fimage.png?alt=media&#x26;token=dfad3543-910b-44e9-a465-fdd0bd3577eb" alt="" width="330"><figcaption></figcaption></figure>

## Modifier un widget

Vous pouvez modifier un widget depuis deux endroits différents :&#x20;

* Depuis la liste des widgets, en cliquant sur les trois petits points à droite de la carte d'un widget puis sur `Modifier`.&#x20;
* Depuis la fenêtre d'Aperçu du widget, en cliquant sur le bouton `Modifier`.

### Onglet Général

Depuis l'onglet `Général`, vous pouvez modifier :&#x20;

* Le **type de rendu** du widget. <mark style="color:red;">**Attention**</mark>, changer le type de widget implique de devoir mettre à jour le code.
* Le **titre** du widget.
* Le **parcours d'apprentissage sélectionné** : pour cela, il vous suffit de cliquer sur le bouton `X` en haut à droite du parcours d'apprentissage sélectionné et d'utiliser la barre de recherche afin de trouver le parcours d'apprentissage de votre choix.

Une fois toutes vos modifications faites, cliquez sur le bouton `Enregistrer`.

### Onglet Statistiques

Depuis l'onglet `Statistiques`, vous pouvez accéder aux données d'utilisation de votre widget :&#x20;

* Un premier encadré `Données du widget` vous donne des chiffres d'utilisation en rapport avec le widget dans sa globalité :&#x20;
  * `Vues` : le nombre de fois où le widget a été vu
  * `Intéractions avec le parcours d'apprentissage` : le nombre de fois où quelqu'un a complété des étapes du parcours d'apprentissage depuis le widget
  * `Dernière mise à jour` : la date de dernière modification du widget
* Dans le deuxième encadré (`Données sur le parcours d'apprentissage`), vous retrouvez des données sur le parcours d'apprentissage en général :&#x20;
  * `Participants` : Le nombre global de participants sur le parcours d'apprentissage (quelque soit le lieu : Spot, embed ou widget).
  * `Dernière mise à jour` : la date de dernière modification du parcours d'apprentissage

Un bouton `Ouvrir le parcours d'apprentissage` vous permet d'accéder au parcours d'apprentissage dans le Spot.

## Aperçu d'un widget

L'aperçu du widget dépend du type de rendu de ce dernier :&#x20;

* S'il s'agit d'un widget de type `Embed` ou `Modale` : Au clic sur la carte d’un widget, une fenêtre s'ouvre. Dans cette fenêtre, vous pouvez voir un aperçu du rendu du widget dans votre application ou site (dans le cas de l'embed, des zones grises matérialisent le contenu de votre site).&#x20;
* S'il s'agit d'un widget de type `Drawer` : Au clic sur la carte d’un widget, un panneau latéral s'ouvre. Vous pouvez y voir un aperçu du rendu du widget dans votre application ou site.

Dans la zone du bas de la modale, il y a plusieurs boutons :&#x20;

* `Obtenir le code` : vous donne le choix entre [envoyer](#recuperer-le-code) le code du widget directement par mail (avec le bouton `Envoyer les instructions`) ou  [récupérer et copier](#recuperer-le-code) le code du widget (avec le bouton `Copier le code`)
* `Modifier` : vous permet d'ouvrir le panneau latéral d'édition.

<figure><img src="https://2006110990-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJ79zpqfFC0YiOG6mb94n%2Fuploads%2FYAn3Nf9jBHFc8pgvh2J2%2Fimage.png?alt=media&#x26;token=26777671-c606-4620-978d-890d75b577fb" alt="aperçu d&#x27;un widget modale" width="563"><figcaption><p>Aperçu d'un widget modale</p></figcaption></figure>

## **Affichage du widget**&#x20;

Dans votre site ou votre application, de nombreux membres pourront accéder à votre widget. Pas de panique, ils ne verront le parcours que s'ils y ont accès :&#x20;

* Si le membre est connecté et a accès au parcours d'apprentissage, il verra le parcours et il pourra compléter ses étapes.
* Si le membre n'est pas connecté et que le parcours est public, il ne verra que la liste des étapes du parcours ne pourra pas naviguer au sein de ces étapes.
* Si le membre n'a pas accès au parcours (parce qu'il est secret), il ne pourra pas voir le parcours.

{% hint style="success" %}
Si le membre complète une ou plusieurs étapes d'un parcours depuis un widget, les activités correspondantes seront bien prises en compte et vous pourrez les retrouver dans la page `Dashboard` des paramètres de votre Spot.
{% endhint %}

**Pour vous assurer que l'utilisateur voit le contenu du widget en étant connecté, nous vous recommandons de mettre en place une authentification SSO dans l'espace d'intégration du widget.**&#x20;

{% content-ref url="../sso" %}
[sso](https://help.meltingspot.io/manage-spot/sso)
{% endcontent-ref %}

{% hint style="info" %}
Une fois le SSO configuré, il est possible de transmettre le token JWT authentifiant l'utilisateur directement dans le script du widget. Plus d'informations [ici](https://help.meltingspot.io/sso#embed-widgets--sso).&#x20;
{% endhint %}

## Supprimer un widget

Pour supprimer un widget, vous avez 2 possibilités :&#x20;

* Depuis la carte d'un widget, en cliquant sur les trois petits points à droite puis sur `Supprimer`.
* Depuis le panneau latéral d'édition  d'un widget, en cliquant sur les trois petits points en haut à droite puis sur `Supprimer`.

Au clic sur l'un de ces deux boutons, une fenêtre de confirmation s'ouvre.&#x20;

{% hint style="danger" %}
Attention, toute suppression est définitive !
{% endhint %}

{% hint style="info" %}
Si vous supprimez un widget dans les paramètres de votre Spot, il est conseillé de le supprimer aussi dans le code de votre application ou site - pas d'inquiétude si vous oubliez, vos membres ne verront qu'un encart vide 😉
{% endhint %}
