Aller au contenu principal

Liens de paiement Stripe

L'intégration Selgeo la plus simple — aucun code backend requis. Le snippet de suivi réécrit automatiquement les Liens de paiement Stripe sur votre page pour inclure le click_id, et Selgeo le lit depuis le webhook Stripe lorsque le client paie.

Version API : v1

Prérequis​

  • Le snippet Selgeo est installé sur votre site web (Configuration du snippet)
  • Vous utilisez des Liens de paiement Stripe (URLs https://buy.stripe.com/...) sur votre site
  • Votre compte Stripe est connecté à Selgeo dans le tableau de bord (Paramètres > Stripe)

Fonctionnement​

┌──────────────────────────────────────────────────────────────────────┐
│ 1. Visiteur clique sur le lien partenaire :                          │
│    https://votre-site.com/pricing?ref=abc123                         │
│                                                                      │
│ 2. Snippet enregistre le clic, stocke click_id dans sessionStorage   │
│                                                                      │
│ 3. Snippet détecte le Lien de paiement Stripe sur la page :          │
│    <a href="https://buy.stripe.com/test_xyz">Acheter</a>             │
│                                                                      │
│ 4. Snippet réécrit le lien :                                         │
│    <a href="https://buy.stripe.com/test_xyz?client_reference_id=     │
│         CLICK_ID">Acheter</a>                                        │
│                                                                      │
│ 5. Client clique sur le lien, paie sur Stripe                        │
│                                                                      │
│ 6. Stripe envoie webhook avec client_reference_id → Selgeo           │
│    l'associe au clic et attribue la conversion au partenaire         │
└──────────────────────────────────────────────────────────────────────┘

Le flux entier est automatique. Vous n'avez qu'à :

  1. Installer le snippet.
  2. Mettre des Liens de paiement Stripe sur votre page.
  3. Connecter Stripe à Selgeo.

Configuration​

Étape 1 : Installer le snippet​

Si ce n'est pas déjà fait, ajoutez le snippet de suivi à votre site :

<script
  async
  src="https://cdn.selgeo.com/v1/selgeo.js"
  data-merchant="pk_test_YOUR_KEY"
></script>

Voir la Configuration du snippet pour tous les détails.

Étape 2 : Ajouter des Liens de paiement Stripe à votre page​

Utilisez les Liens de paiement Stripe comme d'habitude. Par exemple :

<a href="https://buy.stripe.com/test_abc123">S'abonner au Plan Pro</a>
<a href="https://buy.stripe.com/test_def456">S'abonner au Plan Enterprise</a>

Le snippet détecte toute balise <a> dont le href commence par https://buy.stripe.com et la réécrit quand un click_id est stocké.

Étape 3 : Connecter Stripe​

Dans le tableau de bord Selgeo, allez dans Paramètres > Stripe et connectez votre compte Stripe. Cela permet à Selgeo de recevoir les webhooks Stripe et d'associer client_reference_id aux clics partenaires.

Ce que le snippet réécrit​

Le snippet ajoute le paramètre de requête client_reference_id aux URLs des Liens de paiement Stripe :

Avant :

https://buy.stripe.com/test_abc123

Après (quand un click_id est stocké) :

https://buy.stripe.com/test_abc123?client_reference_id=f47ac10b-58cc-4372-a567-0e02b2c3d479

Si aucun clic de parrainage n'a été enregistré dans la session actuelle (pas de click_id dans sessionStorage), les liens sont laissés inchangés. Les clients non référés voient l'URL originale.

Liens dynamiques​

Le snippet utilise un MutationObserver pour surveiller les nouveaux Liens de paiement ajoutés à la page après le chargement initial. Cela gère :

  • Applications monopage — liens rendus après des changements de route
  • Contenu chargé en différé — liens qui apparaissent après le défilement ou l'interaction utilisateur
  • Outils de test A/B — liens injectés par des expériences côté client

Les nouveaux liens sont réécrits automatiquement au fur et à mesure qu'ils apparaissent dans le DOM. Aucun code supplémentaire n'est nécessaire.

Protection contre la surcharge marchand​

Si vous définissez vous-même client_reference_id sur un Lien de paiement (ex. pour passer votre propre ID client), le snippet ne remplacera pas votre valeur :

<!-- Votre client_reference_id personnalisé est préservé -->
<a href="https://buy.stripe.com/test_abc123?client_reference_id=mon_client_123">
  S'abonner
</a>

Si vous avez besoin de passer à la fois votre propre référence et le click_id Selgeo, envisagez plutôt d'utiliser l'approche Stripe Metadata, où vous avez un contrôle total sur les données attachées à l'objet Stripe.

Tests​

  1. Créez un lien de suivi dans le tableau de bord Selgeo.
  2. Visitez votre site en utilisant le lien de suivi : https://votre-site.com/?ref=VOTRE_REF_TEST
  3. Inspectez le Lien de paiement — faites un clic droit sur le lien et sélectionnez "Inspecter" ou "Copier l'adresse du lien". Vérifiez que client_reference_id a été ajouté.
  4. Cliquez sur le Lien de paiement et complétez l'achat en utilisant la carte de test Stripe 4242 4242 4242 4242.
  5. Vérifiez le tableau de bord — la conversion doit apparaître dans Analytics, attribuée au partenaire.

Mode débogage​

Ajoutez data-debug à la balise snippet pour voir l'activité de réécriture dans la console :

[selgeo] Stripe payment link rewritten https://buy.stripe.com/test_abc123?client_reference_id=f47ac10b-...

Limitations​

  • Seuls les liens buy.stripe.com sont détectés. Si vous proxiez des Liens de paiement Stripe via votre propre domaine, le snippet ne peut pas les détecter. Utilisez plutôt Stripe Checkout ou Stripe Metadata.
  • Le visiteur doit d'abord arriver via un lien de suivi. S'il n'y a pas de click_id dans sessionStorage, aucune réécriture n'a lieu.
  • Session limitée à l'onglet. Le snippet stocke le click_id dans sessionStorage, qui est limité à l'onglet. Une fois que les Liens de paiement sur la page actuelle sont réécrits, le client_reference_id est intégré dans l'URL — l'ouverture d'un lien réécrit dans un nouvel onglet fonctionne bien. Cependant, si le visiteur ouvre votre site lui-même dans un nouvel onglet (ex. depuis un favori), le snippet n'aura pas de click_id pour réécrire les liens sur cette page.

Prochaines étapes​