Merci de désactiver votre bloqueur de publicités.

Les seules pubs ici sont discrètes (barre latérale sur PC, sous le contenu sur mobile).
Elles ne gênent pas la lecture et peuvent même vous offrir des avantages (réduc, mois gratuit…).

Brivembed

Brivembed

Description du projet

Intégrez des vidéos, pens, démos et autres contenus externes sans charger d’iframes tierces avant le consentement de l’utilisateur.

  • Ne crée pas l’iframe avant consentement
  • Prend en charge YouTube, Dailymotion, CodePen, GitHub Pages avec la possibilité d’ajouter vos propres services
  • Affiche un espace réservé respectueux de la vie privée
  • Permet d’ajouter facilement un bouton de plein écran si le service n’en propose pas
  • Permet aux utilisateurs d’autoriser un contenu une seule fois ou de toujours autoriser un service
  • Ne dépend d’aucun service externe

Liens utiles

Démonstration

Exemple avec YouTube


<div class="brivembed" data-provider="youtube" data-code="IU0q-RXET8c"></div>

Exemple avec Dailymotion


<div class="brivembed" data-provider="dailymotion" data-code="x2khcmq"></div>

Exemple avec CodePen


<div class="brivembed" data-provider="codepen" data-user="BreatFR" data-code="bGbxNm"></div>

Exemple avec GitHub Pages


<div class="brivembed" data-fullscreen="1" data-provider="githubpages" data-src="https://androdawton.github.io/stellaris-tech-tree/cetus-4.3.2/"></div>

Cet exemple utilise également l'attribut data-fullscreen="1" afin d'ajouter un bouton permettant de basculer le contenu en plein écran.

Installation rapide

  • Ajoutez le CSS (vous pouvez bien entendu le personnaliser)
  • Ajoutez le JavaScript
  • Remplacez vos iframes par le code HTML correspondant

Téléchargement

Ce projet vous est utile ? Vous pouvez soutenir son développement via les boutons en pied de page.