How to stop auto-replay of video header

Took a minute to dig this out, it works on my client site here: https://musichands.co.uk/

I have no idea how it will work in your setup, accept no liability etc.

Copy the global.js file from wp-content/themes/twentyseventeen/assets/js

in you child theme folder create the folder “js” inside a folder “assets”

paste the global.js file, open it in your favourite code editor.

At the bottom of the file you will find this:

// Add header video class after the video is loaded.
$( document ).on( ‘wp-custom-header-video-loaded’, function() {
$body.addClass( ‘has-header-video’ );
});

Change it to this:
// Add header video class after the video is loaded.
$( document ).on( ‘wp-custom-header-video-loaded’, function() {
$body.addClass( ‘has-header-video’ );
});
$( document ).ready( function() {
$( document ).on( ‘wp-custom-header-video-loaded’, function() {
$(“#wp-custom-header-video”).attr(‘autoplay’,true );
$(“#wp-custom-header-video”).attr(‘loop’,false );
});
});

Hope this helps you @korgul

p.s. the magic happens here: $(“#wp-custom-header-video”).attr(‘loop’,false ); the false statement is what stops the video, set it to true and it WILL loop.

(This is from here: https://wordpress.stackexchange.com/questions/254234/wordpress-4-7-custom-video-header-stop-autoplay – so we both owe thanks to @bravokeyl !)

• This reply was modified 6 years, 9 months ago by David Hoy WP.

Props @bravokeyl

For whatever reason this isn’t working. I’ve turned off site caching, cleared browser caching, and yet the video continues to play.

WordPress version is 4.9.5, Twenty-Seventeen version is 1.5.

Don’t know how relevant it is, but this is a fresh/clean install of WordPress.

This didn’t work for me either until I noticed that the above code has different quote and speech marks. I’ve had this before when pasting code in regular text that it changes it to opening quotes and closing quotes, which are different characters and not recognised by the code
If I pasted this code it shows errors.
However, if I retyped all of the quote and speech marks with the standard (below the @ sign on my keyboard for quotes and above no. 2 for speech marks) it works fine.

Try this:

// Add header video class after the video is loaded.
$( document ).on( 'wp-custom-header-video-loaded', function() {
$body.addClass( 'has-header-video' );
});
$( document ).ready( function() {
$( document ).on( 'wp-custom-header-video-loaded', function() {
$("#wp-custom-header-video").attr('autoplay',true );
$("#wp-custom-header-video").attr('loop',false );
});
});

Also, under the original code there is
})( jQuery );

Make sure you leave that after this code.
Hope that helps