# Document

Un widget de type `Document` vous permet d'intégrer à votre produit ou votre site internet un document de type `Page` pour délivrer de l’éducation contextuelle.

## Créer un widget

Pour créer un widget de type `Document`, cliquez sur le bouton `Nouveau` en haut à droite puis sur `Document`. 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 document de type `Page` à 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.](/manage-spot/widget/implementation.md)

<figure><img src="/files/3yzssHs6o7pMyHp4YzgR" 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 **document sélectionné** : pour cela, il vous suffit de cliquer sur le bouton `X` en haut à droite du document sélectionné et d'utiliser la barre de recherche afin de trouver le document 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.
  * `Dernière mise à jour` : la date de dernière modification du widget.
* Dans le deuxième encadré (`Données sur le document`), vous retrouvez des données sur le document en général :&#x20;
  * `Dernière mise à jour` : la date de dernière modification du document.

Un bouton `Ouvrir le document` vous permet d'accéder au document 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="/files/wcWx57S3eRpM3E1mN9Ci" 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 document que s'ils y ont accès.&#x20;

Pour avoir accès à un document, il faut que :&#x20;

* Le membre soit connecté
* Le membre ait accès à la collection qui contient le document (soit parce que la collection est publique, soit parce qu'elle est privée, mais que le membre est invité à la collection).
* Le document soit publié (sauf si le membre est admin ou a la permission "gérer & créer les collections")

{% hint style="success" %}
Si un membre affiche le widget document et y a accès, l'activité correspondante sera bien prise en compte et vous pourrez la 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="/pages/Mp8I18JxVzQr6Qe6xnvt" %}
[Single Sign-On](/manage-spot/sso.md)
{% 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](/manage-spot/sso.md#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 %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.meltingspot.io/manage-spot/widget/document.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
