Add a mute button to a (color-section) video

Hi there!

My goal is to create a landing page with a color-section (youtube) video, which is muted by default, but can be unmuted with a small, front-end, mute button. According to this thread, there is no standard way to do this, at least via the layout-builder. I have spent the last few hours trying to implement this myself, but I keep arriving at dead ends. Does anybody know what is the best way to go about this?

Thusfar, I have tried:

1) …naively changing the data-mute='1' to 'data-mute='0' attribute in the third childelement down from the color-section div which carries the section ID. This unmutes the sound on on page load, but it has (of course) no dynamic behaviour.

2) …setting data-controls='disabled' to 'enabled', presuming this would make some standard controls show up.

2) …overriding the shortcodes.js file with my own shortcodes-child.js file in my child-theme folder and trying to access the API. I’m not getting very far with this though, as there is no documentation available on how to use the aviaVideoAPI in shortcodes.js. This is why I’m starting to think that isn’t the right way either.

Any help would be appreciated!

• This topic was modified 9 years, 5 months ago by blimps. Reason: code tag was wrong