Achat intégré#

Permettez à vos utilisateurs de créer et de payer un site NAMES LEGAL sans quitter votre application. Vous collez une ligne de code ; un cadre apparaît dans votre page et tout l'achat se déroule à l'intérieur.

Votre utilisateur devient un client NAMES LEGAL, facturé directement par NAMES LEGAL. Vous ne gérez jamais les paiements, les données de carte ni les mots de passe.

1. Obtenir un canal de vente#

Demandez à l'équipe NAMES LEGAL un canal de vente. Il contient :

Paramètre	Rôle
Identifiant (`via`)	Votre nom technique, par exemple `app-ecole`.
Sites autorisés	Les adresses de votre application autorisées à afficher le cadre, une par ligne (`https://app.example.com`). Le cadre refuse de s'afficher ailleurs.
Adresse de notification	Facultatif. Le point de terminaison de votre serveur appelé lorsqu'un site acheté via vous est prêt.
Secret de signature	Généré pour vous. Signe les notifications.

2. Coller le code#

<script src="https://names.legal/static/embed/names-legal.js"
        data-via="app-ecole"
        data-lang="fr"
        data-email="direction@ecole.ch"
        data-name="École Horizon"
        data-first-name="Awa" data-last-name="Diop"
        data-ref="instance-42"></script>

Le script insère le cadre à l'endroit où il se trouve et ajuste automatiquement sa hauteur.

Attribut	Obligatoire	Effet
`data-via`	oui	Votre identifiant de canal.
`data-lang`	non	Langue du cadre : `en`, `fr`, `de`, `it`, `es`, `pt`.
`data-email`, `data-first-name`, `data-last-name`	non	Préremplissent le compte.
`data-name`	non	Nom de l'organisation ; sert aussi à suggérer le nom du site.
`data-site`	non	Nom de site suggéré (`ecolehorizon` → `ecolehorizon.names.legal`).
`data-ref`	non	Votre identifiant pour cet utilisateur. Il vous est retourné lorsque le site est prêt.
`data-plan`	non	Formule sélectionnée par défaut.

Vous préférez un simple cadre ? Cela fonctionne aussi :

<iframe src="https://names.legal/embed/app-ecole/?lang=fr&ref=instance-42"
        style="width:100%;max-width:640px;height:1100px;border:0"></iframe>

3. Ce que voit votre utilisateur#

Formule : mensuelle ou annuelle, modules complémentaires facultatifs.
Leur site : nom (disponibilité vérifiée pendant la saisie) et langues.
Leur compte : identifiant et mot de passe pour leur console.
Paiement : une fenêtre de paiement sécurisée s'ouvre au-dessus de votre page. Le paiement n'est volontairement pas à l'intérieur du cadre : certains moyens de paiement ont besoin de toute la page, et le prestataire de paiement déconseille d'imbriquer son paiement dans des cadres.
Site prêt : le cadre l'indique et propose d'ouvrir la console.

Le cadre n'a besoin d'aucun cookie tiers, il fonctionne donc dans Safari et dans les navigateurs qui les bloquent.

4. Savoir quand le site est prêt#

Dans la page, sans serveur :

document.addEventListener("names-legal:ready", function (event) {
  console.log(event.detail.site_url, event.detail.console_url, event.detail.reference);
});

Sur votre serveur, si vous avez déclaré une adresse de notification, vous recevez un événement site.ready signé. Voir Webhooks.

Sécurité#

Le cadre ne s'affiche que sur les adresses déclarées pour votre canal (Content-Security-Policy: frame-ancestors).
Vous ne voyez jamais le mot de passe ni les détails de paiement de l'utilisateur.
Le formulaire d'achat est protégé contre les soumissions automatisées et soumis à une limite de débit.