Il est fréquent de constater que les vidéos sur Facebook sont visionnées sans le son. Lorsque vous parcourez votre fil d’actualité, que ce soit sur votre ordinateur ou via l’application mobile, les vidéos démarrent automatiquement, mais sans audio, sauf si vous activez le son en cliquant sur la vidéo. Ce fonctionnement est pratique, notamment pour ne pas déranger votre entourage lorsque vous regardez, par exemple, la énième vidéo de chat qui apparaît dans votre flux. Si vous désirez insérer une vidéo YouTube sur votre site, mais avec le son désactivé par défaut, un petit script, créé par Amit Agarwal de Labnol, peut vous être d’une grande aide. Ce script permet de lancer les vidéos automatiquement, mais avec le son coupé. Les visiteurs de votre site qui souhaitent entendre la vidéo devront activer le volume manuellement. Voici comment cela fonctionne.
Commencez par sélectionner la vidéo YouTube que vous souhaitez intégrer. Dans la barre d’adresse de votre navigateur, repérez l’identifiant de la vidéo. Il s’agit de la suite de caractères alphanumériques qui suit « https://www.youtube.com/watch?v= ».
Voici le code d’intégration à utiliser. Vous devez simplement remplacer « YOUR_VIDEO_ID », à la huitième ligne, par l’identifiant de la vidéo que vous venez de copier.
<div id="muteYouTubeVideoPlayer"></div>
<script async src="https://www.youtube.com/iframe_api"></script>
<script>
function onYouTubeIframeAPIReady() {
var player;
player = new YT.Player('muteYouTubeVideoPlayer', {
videoId: 'YOUR_VIDEO_ID', // Identifiant de la vidéo YouTube
width: 560, // Largeur du lecteur (en pixels)
height: 316, // Hauteur du lecteur (en pixels)
playerVars: {
autoplay: 1, // Lancer la vidéo automatiquement
controls: 1, // Afficher les boutons de lecture/pause
showinfo: 0, // Masquer le titre de la vidéo
modestbranding: 1, // Masquer le logo YouTube
loop: 1, // Lancer la vidéo en boucle
fs: 0, // Masquer le bouton plein écran
cc_load_policty: 0, // Masquer les sous-titres
iv_load_policy: 3, // Masquer les annotations
autohide: 0 // Ne pas masquer les contrôles pendant la lecture
},
events: {
onReady: function(e) {
e.target.mute();
}
}
});
}
// Code par @labnol
</script>
Utilisez ce code pour intégrer votre vidéo et celle-ci sera muette par défaut. Voici un aperçu du résultat (capture d’écran ci-dessous).
Il est important de noter que ce script ne fonctionnera pas pour les vidéos dont l’intégration est restreinte. Cependant, il est compatible avec la grande majorité des vidéos disponibles sur YouTube.