Así que tienes videos en tu sitio web. Probablemente se cargan en Vimeo o Youtube. Mientras que Vimeo no usa sus videos para publicidad, podría ser seguro bloquearlos para que no se carguen hasta que se dé el consentimiento. En este tutorial vamos a configurar un video de Youtube y sólo se cargará cuando se dé el consentimiento para las cookies de marketing.
Youtube se carga sobre iframes (este tutorial puede ser usado para todo el contenido de iframes).
- Necesitas la URL de un video que quieras usar. Por ejemplo, esta pieza de música clásica de Yo Yo Ma https://www.youtube.com/embed/1prweT95Mo0
- Tendrías que cambiar los códigos de incrustación que obtendrías de Youtube, Vimeo o cualquier otra fuente de iframe. La parte 'src=' debería ser cambiada a data-src= y necesitarías añadir también la categoría de cookies que necesita ser consentida también para cargar el vídeo añadiendo: data-cookiefirst-category="functional" o publicidad (cuando se usa Youtube por ejemplo)
- Necesitas añadir algún botón o imagen directamente antes o después del iframe, puede hacer clic en aceptar la categoría de cookies necesarias para cargar el contenido del iframe.
- Como puedes ver el iframe sigue cargado y ocupando espacio en tu sitio web. Puedes añadir este css personalizado a la página para ocultarlo.
iframe:not([src]) {
display: none;
}
Así que este es un código de ejemplo que muestra un botón "Aceptar cookies de marketing para cargar este vídeo". Al hacer clic, se cargará un vídeo.
<iframe width="640" height="360" frameborder="0" allowfullscreen="allowfullscreen" data-src="https://www.youtube.com/embed/1prweT95Mo0" data-cookiefirst-category="advertising"></iframe>
<div class="cookiefirst-disabled-resource">
Please <button onclick="CookieFirst.acceptCategory('advertising')">Accept marketing cookies</button> to watch this video.
</div>