Site statique (HTML)

Site statique (HTML)Une balise. C'est tout.Prérequis : le site est créé dans CONTROL et ses domaines sont déclarés. Voir le README.La baliseÀ coller avant </body>, sur toutes les pages :

html

<script src="https://messagerie.inovertix.com/inodesk.js"
        data-site="INODSK_PUB_votre_cle"
        data-endpoint="https://messagerie.inovertix.com/api/inodesk"
        defer></script>

Le snippet exact, avec votre clé déjà en place, est dans CONTROL → INODESK → Sites & clés → onglet Intégration.Le widget dessine sa bulle, lit la configuration du site (couleurs, logo, onglets, formulaires) et s'adapte. Sur téléphone, le panneau passe en plein écran. Il ne pose aucun cookie et échoue toujours en silence : quoi qu'il arrive, votre page continue de fonctionner.Un formulaire dans la pageSi vous voulez le formulaire dans votre page plutôt que dans une bulle :

html

<div id="contact" data-inodesk-form="contact"></div>

Le widget remplit lui-même le conteneur, dans son propre shadow DOM — aucune règle CSS de votre site ne peut le déformer, et aucune des siennes ne peut fuir chez vous. Le data-inodesk-form porte l'identifiant du formulaire (CONTROL → INODESK → Formulaires).Sans la bulle flottanteSi vous ne voulez que le formulaire intégré, sans bulle permanente :

html

<script src="https://messagerie.inovertix.com/inodesk.js"
        data-site="INODSK_PUB_votre_cle"
        data-endpoint="https://messagerie.inovertix.com/api/inodesk"
        data-launcher="off"
        defer></script>

Ouvrir le widget depuis un bouton à vous

html

<button type="button" onclick="window.inodesk && window.inodesk('open')">
  Nous contacter
</button>

Appel	Effet
`inodesk('open')`	Ouvre le panneau sur l'onglet par défaut
`inodesk('open', 'support')`	Ouvre sur l'onglet « Ma demande »
`inodesk('close')`	Referme

L'appel est sans effet si le widget n'a pas encore chargé — il ne lèvera jamais d'exception dans votre page.Sans JavaScript du toutLe portail hébergé est une page complète, servie par CONTROL, aux couleurs de votre marque. Un simple lien suffit :

html

<a href="https://plateforme.inovertix.com/care/votre-site">Nous contacter</a>

Et pour pointer directement sur un formulaire précis (utile pour un QR code, une campagne, une carte de visite) :

html

<a href="https://plateforme.inovertix.com/care/votre-site/f/contact">Demander un devis</a>

Ces URLs sont affichées dans l'onglet Intégration du site, prêtes à copier.Si vous avez déjà votre propre formulaireEnvoyez son contenu à l'API publique. Le transport est choisi pour ne déclencher aucun préflight CORS : clé dans l'URL, corps en text/plain. La requête reste « simple » au sens du navigateur, donc un seul aller-retour.

html

<form id="contact">
  <input name="name" placeholder="Votre nom" required>
  <input name="email" type="email" placeholder="vous@exemple.com" required>
  <textarea name="message" placeholder="Votre message" required></textarea>

  <!-- Champ piège : invisible, hors tabulation, hors lecteurs d'écran.
       Aucun humain ne le remplit — un robot qui remplit tout, si. -->
  <div style="position:absolute;left:-9999px" aria-hidden="true">
    <input type="text" name="inodesk_website" tabindex="-1" autocomplete="off">
  </div>

  <button type="submit">Envoyer</button>
</form>

<script>
(function () {
  var KEY = 'INODSK_PUB_votre_cle';
  var API = 'https://messagerie.inovertix.com/api/inodesk';
  var form = document.getElementById('contact');

  // Horodatage d'affichage : le serveur range en « Spam » un formulaire renvoyé en
  // moins de trois secondes. Aucun humain ne remplit trois champs aussi vite.
  var renderedAt = Date.now();

  form.addEventListener('submit', function (event) {
    event.preventDefault();

    var data = Object.fromEntries(new FormData(form).entries());

    fetch(API + '/submissions?k=' + encodeURIComponent(KEY), {
      method: 'POST',
      headers: { 'Content-Type': 'text/plain;charset=UTF-8' },
      body: JSON.stringify({
        form_slug: 'contact',
        data: { name: data.name, email: data.email, message: data.message },
        inodesk_website: data.inodesk_website,
        rendered_at: renderedAt,
        source_url: window.location.href
      })
    })
      .then(function (r) { return r.json(); })
      .then(function (json) {
        form.innerHTML = '<p>' + (json.message || 'Merci, votre message est bien parti.') + '</p>';
      })
      .catch(function () {
        alert("L'envoi n'a pas abouti. Réessayez dans un instant.");
      });
  });
})();
</script>

La réponse est 202 dans tous les cas exploitables, y compris quand la soumission est classée en spam : c'est voulu. Un robot qui reçoit une erreur recommence ; un robot satisfait s'en va. Les suspectes sont rangées dans le dossier « Spam » de l'inbox et restaurables d'un clic.Le mur d'avisUne balise, un script, rien d'autre :

html

<div data-inodesk-reviews
     data-site="INODSK_PUB_votre_cle"
     data-endpoint="https://messagerie.inovertix.com/api/inodesk"
     data-mode="wall"></div>

<script src="https://messagerie.inovertix.com/inodesk-reviews.js" defer></script>

Attribut	Valeurs	Effet
`data-mode`	`wall` (défaut), `badge`	Mur complet, ou la note seule
`data-limit`	un entier	Borne le nombre d'avis affichés

Fichier séparé du widget (~4 Ko) : une page « Ils nous ont fait confiance » n'a aucune raison de télécharger le panneau de contact complet. Comme le widget, il vit dans un shadow DOM — votre CSS ne peut pas le déformer, le sien ne peut pas fuir — et il échoue toujours en silence.Seuls les avis publiés dans CONTROL apparaissent : la modération est obligatoire, rien ne se publie sans une action humaine. Aucun avis publié → le bloc n'affiche rien.Le référencement, en une phraseCe script ne pose pas le balisage schema.org, parce qu'un JSON-LD injecté en JavaScript est lu de façon inégale par les moteurs. Sur un site statique, deux options :

Le plus simple — liez /care/{votre-site}/avis : la page portail est déjà brandée, balisée et indexable.

Le plus complet — générez le JSON-LD à la construction du site (générateur statique, script de build) à partir de GET /api/inodesk/reviews?k=…, et posez-le dans le <head>. La recette est dans avis-seo.md.

Suivre une commande sans le widget

const res = await fetch(
  "https://messagerie.inovertix.com/api/inodesk/order-lookup?k=INODSK_PUB_votre_cle",
  {
    method: "POST",
    // text/plain, comme les autres envois du widget : cela évite la requête
    // préliminaire CORS. Le serveur décode le JSON lui-même.
    headers: { "Content-Type": "text/plain" },
    body: JSON.stringify({ order_number: numero, phone: telephone }),
  }
);

const data = await res.json();

if (!res.ok) {
  // ⚠️ Afficher data.message TEL QUEL. Il est identique pour toutes les causes
  // d'échec — numéro inconnu, téléphone faux, IP verrouillée. Le préciser
  // transformerait cette page en confirmateur de commandes.
  erreur.textContent = data.message;
  return;
}

// data.order : number, status, status_label, placed_at, total, currency, city

N'ajoutez aucune latence conditionnelle avant d'afficher le résultat : le serveur applique déjà un plancher de temps de réponse, et un setTimeout posé seulement sur l'échec suffirait à trahir la différence.Checklist de recette

curl -sS "https://messagerie.inovertix.com/api/inodesk/ping?k=VOTRE_CLE" répond {"ok":true,…} avec le bon nom de site.

La bulle s'affiche sur toutes les pages, aux couleurs configurées.

Le panneau s'ouvre au clic, se ferme avec Échap, est navigable au clavier (Tab passe sur chaque champ, jamais sur le champ piège).

Une soumission de test arrive dans l'inbox avec son numéro #PREFIXE-1.

Le contact reçoit son accusé de réception, avec un lien de suivi qui s'ouvre.

La réponse d'un agent arrive bien chez le contact.

Le lien du portail hébergé fonctionne et affiche vos couleurs.

Sur téléphone réel : panneau plein écran, formulaire utilisable, clavier qui ne masque pas le bouton d'envoi.

Console du navigateur : aucune erreur, aucun avertissement CSP.

Les onglets activés dans CONTROL (Devis, Avis, Ma commande) apparaissent après un simple rechargement, sans modifier la balise du site.

data-inodesk-reviews affiche la note dès qu'un avis est publié, et rien avant.

Le mur d'avis n'est pas déformé par la feuille de style du site (shadow DOM).

Suivi de commande : une vraie commande remonte son statut ; un couple faux renvoie le même message et le même délai qu'un numéro inconnu.

Dépannage

Symptôme	Cause la plus fréquente
Rien ne se passe, aucune requête	La balise n'est pas dans la page (vérifier qu'elle est bien avant `</body>` et sur toutes les pages)
`/config` en 403 `origin_not_allowed`	Le domaine exact n'est pas déclaré. `https://exemple.com` et `https://www.exemple.com` sont deux domaines ; `http://` et `https://` aussi
`/config` en 401 `invalid_api_key`	Clé mal copiée (espace ou retour à la ligne en trop) ou révoquée
`Refused to load the script`	La CSP du site ne connaît pas le domaine CONTROL : ajouter `script-src` et `connect-src`
La bulle est cachée derrière un bandeau	Le widget monte à `z-index: 2147483000` : le bandeau est au-dessus, baissez le sien
Formulaire toujours classé en spam	`rendered_at` envoie un horodatage figé côté serveur : il doit être posé à l'affichage, dans le navigateur
Onglet « Devis » / « Avis » / « Ma commande » absent	La condition n'est pas remplie : formulaire de type devis, collecte ouverte, boutique INOSHOP liée
Mur d'avis vide	Aucun avis publié — la modération est obligatoire, rien ne se publie tout seul
Étoiles absentes des résultats Google	Balisage posé en JavaScript : le générer à la construction du site (avis-seo.md)
Suivi de commande toujours en échec	Le téléphone doit être celui de la commande ; après une dizaine d'essais ratés, l'IP est écartée une trentaine de minutes — avec le même message

Les codes d'erreur complets sont dans le tableau du README.