Text based audio player

  • Is there any way to use compact audio player to implement a text based audio player. Specifically, I am designing a Mandarin language learning site and would like to make it possible to click on characters to hear their pronunciation. I don’t want any buttons, sliders, or pause feature, because none of the audio will be longer than a couple seconds.

    Thanks!

    https://www.ads-software.com/plugins/compact-wp-audio-player/

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Contributor mbrsolution

    (@mbrsolution)

    Hi, it could work if you allow the black arrow next to the Mandarin character. That way the person learning would press the black arrow to listen to the pronunciation.

    Thread Starter mirgcire

    (@mirgcire)

    @mbrsolution, thanks for the rapid response ??

    Actually, I can not allow the black arrow. There will be many characters on a page and very close together, adding black arrows would make the page difficult to read, as well as confusing.

    Plugin Contributor mbrsolution

    (@mbrsolution)

    Hi, unfortunately at the present it is not achievable. The only option as far as I know is to add the arrow next to the character.

    Thread Starter mirgcire

    (@mirgcire)

    I am sure it is not too hard. This plugin is based on soundmanager2 and I have noticed there are other websites that are based on soundmanager2 and achieving the result I am after.

    Plugin Contributor mbrsolution

    (@mbrsolution)

    Hi, can you share a website that is achieving your goal using this plugin? This might help me work out how they achieved this set up.

    Thank you

    Thread Starter mirgcire

    (@mirgcire)

    This site should be helpful: https://www.schillmania.com/projects/soundmanager2/demo/play-mp3-links/

    The “Flat (CSS-only) style” section is pretty close to what I am looking for.

    I was able to achieve something very similar with howler.js, but it had a side effect that stumped me.

    This js code seems to be relevant also, but I haven’t been able to get my head around it yet.

    Thanks!

    Plugin Contributor mbrsolution

    (@mbrsolution)

    Currently the only way I can see you achieving your goals with this plugin is by hacking into the code. For example add the images of each character to the the plugins image folder. Replace the arrow image with the new images for each file you want to play.

    You will also have to create special custom CSS code for each file you want played in your website.

    Thread Starter mirgcire

    (@mirgcire)

    That’s sad. Using the Howler.js library I was able achieve my goal quite easily. You can take a look at here to see how simple it is. (you need to scroll down a bit to the table labelled “initials:finals:” and click words in the middle of the table.)

    Plugin Contributor mbrsolution

    (@mbrsolution)

    I am sure there could be a way to get this plugin to work for you. At the present I can’t see any way to implement your request without editing the code using CSS or other.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Text based audio player’ is closed to new replies.