Intégrez Sparkup dans votre site web ou votre application

Grâce à une session Sparkup intégrée, vous pouvez bénéficier de toute l'expérience Sparkup directement depuis votre site web ou votre application.

Nous verrons d'abord comment récupérer le lien de votre session et ensuite comment l'intégrer. Dans cet article :

• Lien profond pour entrer dans une session Sparkup
• Intégration mode player
• Intégration mode full
• Intégration mode interactivité seule

Lien profond pour entrer dans une session Sparkup

Une fois votre session créée, vous pouvez utiliser ce que l'on appelle un "lien profond" qui ressemble à ceci :

https://sparkup.events/connect/ABCDE , où "ABCDE" est votre code session unique.
(ou https://alias.sparkup.events/connect/ABCDE en fonction de votre URL Sparkup)

Voici comment récupérer ce lien depuis votre session Sparkup :

1. Ouvrez le menu Général,
2. Copier l'URL participant de votre session.

Avec ce lien, vos participants entreront dans Sparkup directement dans la session, sans avoir à entrer le code session.

À ce lien, vous pouvez également ajouter certains paramètres en fonction de vos besoins :

• "embed" : si définie comme true (recommandé), les informations du profil lors de la connexion + le background, le titre et le logo de la session seront masqués,
• "mode" : il existe 3 modes possibles :
  • player -> intègre la partie player vidéo de Sparkup uniquement tout en bénéficiant de l'interactivité + des boutons emojis, caméra et lever la main (pas de Chat, ni de Menu participant),
  • full -> intègre la totalité de l'interface Sparkup (incluant le Chat participant, le chat speaker, le partage d'écran speaker et le Menu participant),
  • interactivity -> intègre seulement la partie interactivité live type live questions, nuage de mots...
• "remote" : définit si les participants seront sur place, à distance. Lorsque vous copiez/collez votre lien, vous choisissez déjà celui dont vous avez besoin. 3 possibilités :
  • true (lien à distance) -> les participants seront configurés à distance, ils disposeront donc des fonctionnalités à distance (stream, caméra, microphone),
  • false (lien sur site)-> les participants seront configurés sur place, ils ne disposeront donc pas des fonctionnalités à distance (stream, caméra, microphone),
  • not used (lien général) -> les participants devront choisir eux-mêmes s'ils sont à distance ou non.
• Si vous souhaitez compléter dynamiquement le profil participant :
  • "email" -> email du participant (obligatoire),
  • "firstName" -> prénom du participant (facultatif),
  • "lastName" -> nom du participant (facultatif).

Important: Pour le moment, les liens complétant dynamiquement le profil ne fonctionneront que si l'utilisateur n'a pas déjà de compte Sparkup.

Voici un exemple de lien utilisant les différents paramètres :

https://sparkup.events/connect/ABCDE?embed=true&mode=player&email={{EMAIL}}&firstName={{PRENOM}}&lastName={{NOM}} (où "ABCDE" est votre code session et ({EMAIL}}, {{PRENOM}}, {{NOM}} sont les informations du participants provenant du site où Sparkup est intégré).

Intégration mode player

Exemple de code iframe :

<iframe src="https://sparkup.events/connect/ABCDE?embed=true&mode=player" allow="autoplay; encrypted-media; picture-in-picture; camera *; microphone *" frameborder="0" scrolling="no" allowtransparency="true" allowfullscreen="true" height="auto" width="100%" style="min-width:340px; min-height:192px; aspect-ratio: 16/9;"></iframe>

Vous pouvez utiliser ce code, et remplacer le lien par votre lien profond de session en gardant les paramètres ?embed=true&mode=player (voir plus haut).

ℹ️ Ratio recommandé : 16/9

Intégration mode full

Exemple de code iframe :

<iframe src="https://sparkup.events/connect/ABCDE?embed=true&mode=full" allow="autoplay; encrypted-media; display-capture; picture-in-picture; camera *; microphone *" frameborder="0" scrolling="no" allowtransparency="true" allowfullscreen="true" height="100%" width="100%" style="min-width:496px; min-height:400px;"></iframe>

Vous pouvez utiliser ce code, et remplacer le lien par votre lien profond de session en gardant les paramètres ?embed=true&mode=full (voir plus haut).

ℹ️ En dessous d'une largeur iframe de 540px, Sparkup passera à une interface format mobile :
 

Intégration mode interactivité seule

Exemple de code iframe :

<iframe src="https://sparkup.events/connect/ABCDE?embed=true&mode=interactivity" allow="camera *; microphone *" height="100%" frameborder="0" scrolling="no" allowtransparency="true" style="min-width:360px; min-height:400px;"></iframe>

Vous pouvez utiliser ce code, et remplacer le lien par votre lien profond de session en gardant les paramètres ?embed=true&mode=interactivity (voir plus haut).

ℹ️ Largeur optimale 360px