Qui peut accéder à la configuration ?

Rôles	Accès
👑 Admins	Accès complet
🛠️ Éditeurs	Pas d'accès
👀 Lecteurs	Pas d'accès
🔒 Lecteurs restreints	Pas d'accès

Quels sont les différents modes de widget ?

Compact	Complet

Comment afficher le widget ?

Etape 1 : Charger la bibliothèque

Incluez dans l'en-tête de votre site le script d'affichage du widget :

<script async defer src="https://display-widget.feedier.com/widget.js?api_key={CLE D'API FEEDIER PUBLIQUE}"></script>

Pour trouver votre clé API :
Feedier → Paramètres avancés -> Clé API publique

Étape 2 : Ajouter l'élément de données dans votre page

Les deux widgets utilisent une structure <div> avec des paramètres passés en tant qu'éléments de données.

Exemple :

<div data-feedier-widget data-layout="compact" data-primary-color="#cc0d2b" data-kpi='ratings("survey.id", "=", "123")' data-score-max="5" ></div>

Quels sont les paramètres communs aux deux modes de widget ?

Paramètre	Obligatoire	Description
`data-feedier-widget`	✅	Utilisé par la bibliothèque pour initialiser le widget.
`data-layout`	✅	`compact` ou `complet`
`data-score-max`	✅	Le maximum de l'échelle, par exemple `5`, s'il s'agit d'une note sur 5 ou `10` s'il s'agit d'un NPS.
`data-kpi`	✅	L'indicateur de performance clé (KPI) rendu en utilisant le langage KPI de Feedier : KPI Documentation Quelques exemples : sentiment("topic.name", "=", "Packaging"), ratings() nps(), satisfaction(), etc.
`data-primary-color`	❌	Le code couleur HEX du widget
`data-min-count`	❌	Le nombre minimum de retours requis pour afficher le widget. S'il est fixé à `10`, le widget ne sera affiché que si plus de 10 feedbacks sont renvoyés.
`data-threshold`	❌	Le score minimum de l'indicateur de performance clé requis pour afficher le widget. S'il est fixé à `3,5`, le widget ne sera affiché que si le score moyen calculé par `data-kpi` est supérieur à 3,5.
`data-fql`	❌	Une FQL optionnelle pour filtrer les feedbacks utilisés dans le widget. Ceci supporte TOUS les filtres du module FQL dans Feedier, voir : Utiliser les filtres (FQL) dans l'API Feedier
`data-locale`	❌	Soit `en` ou `fr.` Si d'autres sont nécessaires, contactez l'équipe Feedier.
`data-locales`	❌	Utilisé pour remplacer toute chaîne de caractères affichée : data-locales='{ "fr" : { "labels" : { "title" : "Avis clients" }, "full" : { "loadMore" : "Voir plus" } }, "*" : { "full" : { "sort" : { "label" : "Ordonner les retours" } } } }'

Quels sont les paramètres spécifiques au mode widget compact ?

Paramètre	Obligatoire	Description
`data-target`	❌	Cible CSS utilisée pour rediriger les clics de l'utilisateur sur le widget vers une autre partie de la page. Par exemple vers les retours de texte d'un second widget chargé sur la page. Voir l'exemple ci-dessous.

<div data-feedier-widget data-layout="compact" data-primary-color="#cc0d2b" data-kpi='ratings("survey.id", "=", "123")' data-threshold="3.5" data-score-max="5" data-min-count="10" data-target="#feedier-reviews" data-locale="en" ></div> .... <div id="feedier-reviews" data-feedier-widget data-layout="full" ...

Quels sont les paramètres spécifiques pour le mode widget complet ?

Paramètre	Obligatoire	Description
`data-description`	❌	Contenu HTML affiché sous le titre. Il peut contenir des liens, du contenu, etc.

Chaque carte du widget complet comporte 3 éléments :

Un attribut (comme le nom, le produit, etc.)
Un score
Un verbatim

Tous ces éléments sont optionnels.

Paramètres	Obligatoire	Description de l'attribut
`data-heading-attribute-name`	❌	Identifie le titre de la carte. Il doit s'agir d'un attribut existant dans Feedier (voir la page Attributs dans Feedier).
`data-score-feedback-item-id`	❌	L'identifiant de l'élément de feedback dans Feedier utilisé pour afficher le score dans la carte.
`data-verbatims-feedback-item-id=`	❌	L'ID de l'élément de feedback dans Feedier utilisé pour afficher le verbatim dans la carte.

Exemple,

<div   id="feedier-reviews"   data-feedier-widget   data-description='Description example here. <a href="test.com"> Link</a>'   data-layout="full"    data-primary-color="#cc0d2b"   data-score-max="5"   data-threshold="3.5"   data-min-count="200"   data-locale="en"   data-kpi='ratings("survey.id", "=", "123")'   data-heading-attribute-name="first_name"       data-score-feedback-item-id="456"   data-verbatims-feedback-item-id="789"      ></div>