So haben Sie Videos auf Ihrer Website. Wahrscheinlich über Vimeo oder Youtube laden. Obwohl Vimeo Ihre Videos meist nicht für Werbezwecke verwendet, ist es möglich, sie bis zur Zustimmung noch vom Laden auszuschließen. In diesem Tutorial werden wir ein Youtube-Video einrichten und es nur dann laden, wenn die Zustimmung für Marketing-Cookies erteilt wird.
Youtube lädt über iframes (dieses Tutorial kann für alle iframed-Inhalte verwendet werden).
- Sie benötigen die URL eines Videos, das Sie verwenden möchten. Zum Beispiel dieses klassische Musikstück von Yo Yo Yo Ma Ma. https://www.youtube.com/embed/1prweT95Mo0
- Sie müssten die Einbettungscodes ändern, die Sie von Youtube, Vimeo oder anderen Iframe-Quellen erhalten. Die 'src=' Teil sollte auf data-src= geändert werden. und du müsstest auch die Kategorie der Cookies hinzufügen, die ebenfalls genehmigt werden musste, um das Video durch Hinzufügen zu laden: data-cookiefirst-category="functional " oder advertising (z.B. bei Verwendung von Youtube)
- Du musst einen Button oder ein Bild direkt vor oder nach dem Iframe hinzufügen, es kann onclick die Kategorie der Cookies akzeptieren, die zum Laden des Iframe-Inhalts benötigt werden.
- Wie Sie sehen, wird der Iframe immer noch geladen und nimmt Platz auf Ihrer Website ein. Sie können dieses benutzerdefinierte css zur Seite hinzufügen, um es auszublenden.
iframe:not([src]) {
display: none;
}
Dies ist also ein Beispielcode, der die Schaltfläche "Marketing-Cookies akzeptieren, um dieses Video zu laden" anzeigt. Auf Klick wird ein Video geladen.
<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')">Marketing-Cookies akzeptieren</button> um dieses Video anzusehen.
</div>
Dasselbe könnte auch verwendet werden, wenn Sie z.B. andere Iframe-Inhalte einbetten müssten.