Pronunciation Audio (Like on LinkedIn)

Linked in allow you to record your name and then an icon is visible after your mane which is when clicked plays a recording. See example: https://www.linkedin.com/in/maiacybelle/

I’d like to do this on their webflow site About | Carpenter Consulting Partners

And, I don’t want to embed a Soundcloud player on the page as it looks really clunky. I just want to have a clickable icon (exactly like LinkedIn).

Any suggestions? Or am I looking at getting some custom code done?

Many Thanks
Graham


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hi @grahamtaylornyc You’re probably looking for something like the below, which according to my knowledge requires some low-level coding

Pronunciation Audio Test

Text to Voice converted here[for the experimental purpose]

Learn how to host mp3 on google drive here

:point_down:code used

<script>
let audioButton = document.querySelector(".audio-button"); // <-- Change CSS Class Here
audioButton.addEventListener("click", function () {
  var audio = document.getElementById("audio");

  if (audio.paused) {
    audio.play();
  } else {
    audio.pause();
    audio.currentTime = 0;
  }
});

</script>


<audio
  id="audio"
  src="https://docs.google.com/uc?export=download&id=1DR2uziOQoACl8XGfJP8fTuYNFhX77hZ0"
></audio>;

Hope this helps :peace_symbol:

Thank you so much!!!