22. Insert Audio in Landing Page

1. Code to insert audio on the page before the body tag

<audio id="123" autoplay>
  <source src="link_audio">
</audio>

EX link_audio: https://dl.dropboxusercontent.com/s/ovd28vclita3btl/mnY8FlxAWuvS.128.mp3

In some cases, the browser will block audio auto play, need to install additional custom code:

  • When the customer interacts with the page, the audio will turn on

let videoElem = document.getElementById('123')
if (videoElem) {
    let playAttempt = setInterval(() => {
      document.getElementById('123').play()
        .then(() => {
          clearInterval(playAttempt);
        })
        .catch(error => {});
    }, 3000);
}
document.body.addEventListener('click', () => {
    document.getElementById('123').play()
})

2. In case you want to turn off background sound when playing video, use this code

window.WebcakeScript.pubsub.subscribe('pause-video', () => {
document.getElementById('123').pause()
})

Paste the above code in "Custom code JavaScript" after the second code

Last updated