the video is controlled with the file /wp-includes/js/wp-custom-header.js
for customize them in your theme you need overwrite this file.
- Copy this file to your assets, from the root of your website write cp wp-includes/js/wp-custom-header.js wp-content/themes/[Your Theme]/assets/js/wp-custom-header.js
- register the new file in
[Your Theme]/functions.php
adding this code add_action( ‘wp_enqueue_scripts’, ‘register_header_script’ ); function register_header_script() { wp_deregister_script( ‘wp-custom-header’); wp_register_script( ‘wp-custom-header’, get_theme_file_uri(‘/assets/js/wp-custom-header.js’), array( ‘jquery-masonry’ ), false, 1 ); } - Now we can control the video in many ways, to turn on the sound in our file
wp-custom-header.js
search and delete the linee.target.mute();
(line 390 in wordpress 4.9.8 or line 394 in WordPress 5.5.1)
before
handler.player = new YT.Player( video, { height: this.settings.height, width: this.settings.width, videoId: this.settings.videoUrl.match( VIDEO_ID_REGEX )[1], events: { onReady: function( e ) { e.target.mute(); handler.showControls(); }, ...
after
handler.player = new YT.Player( video, { height: this.settings.height, width: this.settings.width, videoId: this.settings.videoUrl.match( VIDEO_ID_REGEX )[1], events: { onReady: function() { // e.target.mute(); handler.showControls(); }, ...
Exist many other header’s video functionalities than you can customize in this file.
Enjoy !