1ère étape: Récupérer le lien de votre VOD sur la marketplace bsport.
Pour accéder à votre marketplace, il suffit d'entrer le lien suivant dans la barre de recherche de votre navigateur :
backoffice.bsport.io/m/xxx/ID
Dans cette URL :
"/m" signifie que vous allez vers la marketplace de bsport
"/xxx" sera remplacé par le nom de votre studio
"/ID" correspond à votre ID bsport
Pour trouver votre ID sur la plateforme : Paramètres > Général > "BSPORT ID".
Copier l'URL dans la barre de recherche de votre navigateur et remplacer "ID" par votre bsport ID puis appuyer sur "entrer".
2ème étape : Récupérer l'URL de votre onglet VOD.
Cliquer sur l'onglet "VOD" de votre marketplace.
Dans notre exemple, nous avons pris la marketplace de Dancefloor Paris, on obtient cette URL :
2ème étape bis : Obtenir une URL pré-filtrée.
Vous avez aussi la possibilité d'ajouter des filtres pour afficher une sélection spécifique de vidéos. Vous pouvez filtrer par niveaux, professeurs, catégories ou encore durée.
Choisir un ou plusieurs filtres ici :
Exemple : En filtrant sur le niveau "Intermédiaire" et sur la catégorie "Dance Classique" sur la marketplace de Dancefloor Paris, on obtient :
https://backoffice.bsport.io/m/Dancefloor-Paris/192/vod?level=3
3ème étape : Intégrer la VOD à l'aide d'une balise iframe.
Utiliser la balise suivante :
<iframe src="https://backoffice.bsport.io/m/XXX/id/vod" style="" ></iframe>
Remplacer le lien https://backoffice.bsport.io/m/XXX/id/vod avec le lien obtenu lors de la 2ème étape.
Par exemple, pour Dancefloor Paris, cela donne :
<iframe src="https://backoffice.bsport.io/m/Dancefloor-Paris/192/vod" style="" ></iframe>
Ou avec les filtres :
<iframe src="https://backoffice.bsport.io/m/Dancefloor-Paris/192/vod?level=3" style="" ></iframe>
Il faudra ajouter du code CSS au style="" présent dans l'iframe afin qu'il s'affiche dans les bonnes dimensions sur votre site internet.
Par exemple :
style="height:100vh; width: 100%;"
4ème étape: Intégrer l'iframe sur votre site internet.
Copier-coller la balise iframe à l'endroit voulu sur votre site internet.
Par exemple, avec le code suivant :
<iframe src="https://backoffice.bsport.io/m/Dancefloor-Paris/192/vod?level=3" style="height: 150vh; width: 100%" ></iframe>
On obtient ce rendu sur le site internet :
