Comment proposer la souscription à une offre sur mon site web

Pour proposer la souscription à un produit sur votre site, rien de plus simple !

Option 1 - Ajouter le parcours en iframe

Qu'est-ce qu'un "iframe" ? 

Un iframe est une balise HTML permettant l'affichage, sur une page Web, d'un contenu provenant d'un autre serveur. Dans votre contexte, il vous permettra d'afficher le parcours de souscription sans rediriger l'utilisateur vers un autre URL. 

Ajouter le parcours à votre plateforme

  • Aller sur votre plateforme Particeep Plug puis dans Mes Produits > "Action" sur votre produit > Widget
  • Copier le code présent dans Incorporer le widget Plug pour déployer le parcours de souscription sur votre interface utilisateur

Explications du code:

1 - Le tag <script> est votre parcours en iframe. Il doit être placé à la fin de votre code HTML, juste avant la balise </body>. Vous pouvez suivre les étapes suivantes pour vous guider: 

  • Aller sur l'éditeur de votre site web
  • Sélectionner la page sur laquelle vous souhaitez ajouter le parcours de souscription
  • Ajouter la ligne de code <script> à la fin de votre page juste avant le tag </body>

2- Le tag <button> est le bouton qui, lorsqu'il sera cliqué, affichera le parcours de souscription sur votre plateforme. Vous pouvez le placer où vous le souhaitez dans votre code HTML. 

Exemple de résultat:

Etape supplémentaire: Avoir plusieurs boutons pour démarrer le même parcours de souscription.

Si vous souhaitez avoir plusieurs boutons ( sur la même page web) qui démarrent le même parcours de souscription en iframe, il vous faudra ajouter le code suivant pour chaque nouveau bouton:

 <button onclick='this.addEventListener("click", PcpPlugGlobal.open("{PRODUCT_ID}"));'>{LABEL}</button>

Une modification sur ce code sera nécessaire, il faudra remplacer la valeur {PRODUCT_ID} par l'ID de votre produit. Cette ID se trouve sur votre premier bouton, c'est le reste du nom après pcp-plug-button-. 

Dans l'exemple ci-dessous, l'ID du produit est  9582ecbc-ef92-4a53-be64-bd67e311f541

<button id="pcp-plug-button-9582ecbc-ef92-4a53-be64-bd67e311f541">Buy</button><br>

Il faudra aussi aussi changer la valeur {LABEL}. Cette valeur est le texte qui vous souhaitez voir sur votre bouton (par exemple: "Vers mon parcours", "Pour souscrire, cliquez ici", etc... ) 

De ce fait, en suivant l'exemple ci-dessus, les autres boutons sur la page web auront le format suivant:

 <button onclick='this.addEventListener("click", PcpPlugGlobal.open("9582ecbc-ef92-4a53-be64-bd67e311f541"));'>Pour souscrire, cliquez ici</button>

Attention

N'oubliez pas de ne pas laisser les "{}" lorsque vous mettez l'ID du produit et du label dans le code. 

Exemple de résultat: 

Option 2 - Utiliser l'URL du parcours de souscription

Afin de permettre à vos utilisateurs d'accéder à votre parcours de souscription, vous pouvez aussi vous servir directement de l'URL du parcours. Cependant, contrairement à l'iframe, l'utilisateur sera redirigé vers l'URL du parcours. 

Pour trouver l'URL de votre parcours

  • Aller sur votre plateforme Particeep Plug puis dans Mes Produits > "Action" sur votre produit > Ajouter
  • Copier l'URL du parcours présent dans la barre d'URL en haut de votre navigateur

Etape intermédiaire

Remplacer le " stepX" à la fin de votre URL par "new". 

Incorporer le lien sur votre plateforme

Afin d'ajouter le lien à votre plateforme, vous pouvez vous servir du code suivant:

<a href="{URL}">{LABEL}</a>

Vous pouvez ajouter ce code plusieurs fois dans votre code HTML si vous souhaitez avoir différents points de redirection, vers le parcours de souscription, sur votre plateforme.

Attention

N'oubliez pas de ne pas laisser les "{}" lorsque vous mettez l'ID du produit et du label dans le code. 

Cela ne répond pas à votre problème ? Contactez-nous Contactez-nous