Embed Sparkup in your website or event app

With an embedded Sparkup session, you can enjoy the full Sparkup experience directly from your website or application.

We'll look first at how to retrieve your session link and then at how to integrate it. In this article:

• Deeplink to enter a session
• Player mode integration
• Full mode integration
• Interactivity mode integration

Deeplink to enter a session

Once you've created your session, you can use what's known as a “deep link”, which looks something like this:

https://sparkup.events/connect/ABCDE , where "ABCDE" is your session code.
(or https://alias.sparkup.live/connect/ABCDE depending on your sparkup URL)

Here's how to retrieve this link from your Sparkup session:

1. Open the General menu,
2. Copy the participant URL from your session.

With this link, your participants will enter Sparkup directly into the session, without having to enter the session code.

To this link, you can also add certain parameters to suit your requirements:

• "embed" : if set to true (recommended), profile information from first connection + background, title and logo of the session will be hidden,
• "mode" : there are 3 possible modes:
  • player -> integrates the video player part of Sparkup only, while benefiting from interactivity + emojis, camera and raise-your-hand buttons (no Chat, no participant Menu),
  • full -> integrates the whole Sparkup interface (including Chat and participant Menu),
  • interactivity -> only includes live interactivity such as live questions, word clouds...
• If you wish to dynamically complete the participant profile:
  
  • "email" -> participant email (mandatory),
  • "firstName" -> participant first name (optional),
  • "lastName" -> participant last name (optional).

Important: For the moment, links that dynamically complete the profile will only work if the user doesn't already have a Sparkup account.

Here is an example of a link using the different parameters:

https://sparkup.events/connect/ABCDE?embed=true&mode=player&email={{EMAIL}}&firstName={{FIRSNAME}}&lastName={{LASTNAME}} (where "ABCDE" is your session code and ({EMAIL}}, {{FIRSTNAME}}, {{LASTNAME}} are the participant information from the site where Sparkup is integrated).

Player mode integration

Example iframe code :

<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="100%" width="100%" style="min-width:340px; min-height:192px;"></iframe>


You can use this code, and replace the link with your session deeplink, keeping the parameters ?embed=true&mode=player (see above).

ℹ️ Recommended aspect ratio: 16:9

Full mode integration

Example iframe code :

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

You can use this code, and replace the link with your session deeplink, keeping the parameters ?embed=true&mode=full (see above).

ℹ️ Below an iframe width of 540px, Sparkup will switch to a mobile format interface:

Interactivity mode integration

Example iframe code :

<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>

You can use this code, and replace the link with your session deeplink, keeping the parameters ?embed=true&mode=interactivity (see above).

ℹ️ Optimum width 360px