The HTML5 video player element has a .volume property you can set (as a decimal fraction between 0 and 1) with JavaScript, but embedded players from streaming services typically have their own players within iframes which your JS cannot access. In some cases such players might accept an attribute value in the iframe tag to set a volume level. Availability of such an option will vary by provider.
Thanks bcworkz,
Even if I can only set the volumes for the uploaded files it will help as generally they are louder than the streamed files. Not quite sure how to add the JS. This is the html for the video block:
<figure class=”wp-block-video”><video controls src=”http://www.mellodeevo.com/wp-content/uploads/2023/01/You-and-Us_v16.movSmall.mov”></video></figure>
Here is the script from the page you linked:
const obj = document.createElement(‘audio’);
console.log(obj.volume); // 1
obj.volume = 0.75;
Not sure how to implement.
Sorry, that example isn’t very useful. The link was merely to document that a video player has a volume property that we can manipulate. This sets the volume of the first video player found to 70% (untested):
<script>
var vids = document.getElementsByTagName('video');
if ( 0 < vids.length ) { vids.item(0).volume = 0.7; }
</script>
You cannot place this code through the post editor, it’ll get corrupted. Probably the simplest way to place it is to put it on the relevant post template. If your theme is subject to periodic updates, you should keep the modified template in a child theme. As a test it’s OK to modify the template where it sits, but it’s not a good long term solution.
