Hey guys,

anyone about before and after audio player embedded on website (see attachment)

thanks

anyone??

If you're a coder/developer, check out this free/Open Source Jplayer JQuery plugin: Demo : Multi instanced jPlayer video players (It's audio or video. The video demos on the page are set up to stop if another player on the page starts playing.

If you're not a coder, save yourself five minutes, as it's not for the code-shy.


I didn't do an exhaustive search, but I was hoping to find something a non-coder could just plug in. I don't see any reason that a non-coder friendly plugin or other embedable player couldn't be found. You should keep looking.

Certainly there were Flash-based players that offered that capability. Unfortunately, HTML5 compatibility tends to mean a lot more code for any given functionality. (And HTML5 and poor use of it [particularly by advertising coders] is one of the reasons why 'modern' sites on the web now run so much slower than they did a few years ago.)

But HTML5 was forced upon us by Apple, concerned because the proprietary Flash plugin platform it 'replaces' ran slow on their platform; it was probably inevitable, though, since Flash's new owners, Adobe (who bought Macromedia to get it) have proven all but incapable of keeping it stable and/or safe. It was a a pretty good tool under Macromedia -- though oft-abused by overambitious 'Flash designers' -- but under Adobe it's become a total mess.

Hi thanks for your info.. I'm not a coder :(

Hey, sl4hz!

Good news!

I just realized (or maybe the functionality was just added) that you can get a basic toggle behavior between players if you use the native media player option in the latest version of Wordpress! No coding necessary. If one player on a page is playing, the other players stop but keep their play head position.

Here's an example: Built-in audio player toggle demo | AYoS Test Base

I confirmed that this works with self-hosted Wordpress sites as well as the free/pay sites offered by their commercial side, Wordpress.com. On the Wp-com-hosted free tier you can link the player to an audio file hosted somewhere else (as long as you have a direct link to it); their paid users can upload audio files directly to their account.

Self-hosted WP users can either upload the files or link to audio files hosted elsewhere.

The players can be restyled to some extent via CSS code (you wouldn't want to try to learn CSS coding just for this, but it's pretty easy to paste a snippet of code into the current WP theme's edit page [Appearance/Themes/Editor]. If you need more info and I don't see your response in this thread for some reason, feel free to PM me.

Hey bro!

Did you find the audio player?

I'm looking for this too!!!

If you posted the website where you found it rather than the images, a savvy member could firebug it and figure out what player is being used.

You could also just have the "after" button raise the volume 4db's in the player, probably no one would know ho ho ho.

The first button is on High Quality Online Mixing And Mastering By Doctor Mix and the second Sage Audio | Online Mastering Service | Free Sample Of Your Song

hey, yeah haven't found one yet. hope someone can help

Any news on this?
I found one a few months back, but it didn't work with Squarespace. I'm moving to Wix soon and I can't remember the name of the plugin :|

did you find one ? if yes would you like to share ?

Hi Folks,
I can develop this script for you in one day if you need it.
My website is https://pollastri.dev, contact me.

Best
Andrea

Hi folks!
I developed it!

It's a simple HTML/jQuery/CSS script!

I used DoctorMix samples for this demo (Thank You to Claudio)!
You have to use your own MP3 files!!!

This is the link: https://drive.google.com/file/d/1gHQ...ew?usp=sharing

I hate WP so don't ask me how to integrate it into WP but if you need help (not related to WP), write me!

I hope you enjoy it

Best
Andrea

Hi Andrea,

I test it and it works for web! thanks for share that.

But I was wondering if you need to add something else for mobile version?

What happens is when you are playing on your phone to hear "the before and after", it keeps playing the first song and never stop, even if I'm out of "safari-app" the song keeps playing.

hope you can help me.

Cheers

Cruz

Hi folks... I just updated the "mobile issue"... now it works fine!

https://drive.google.com/file/d/1gHQ...ew?usp=sharing

Bye

Hello, everyone! If someone still need this player - try to ask majormixing.com[quote]Major Mixing | ONLINE MIXING AND MASTERING SERVICE


They have very similar!

Hi there!

I would like to try it! Could you please share a new link?

hey thanks for doing this i’m surprised other coders haven’t stepped up, I really appreciate you taking the time! i noticed the link is not working, is there another way to download this? Thanks again

Hello,

Anyone still have the files, that could re-upload please?

Sorry for the double reply, but as a matter of coincidence, after posting the last reply, a free before/after player popped up on github.

Here is the link: https://github.com/mattbartley/AB-Au...e0sPlJCccsfvu8

I have it already implemented on my studio webpage.

Hey, I'm still a beginner in HTML/CSS/JS. How were you able to implement multiple instances of the player on your website? I'm thinking that you had to rewrite some of the code because otherwise all the players would play the same two audio files.

Many thanks!

Hey there. I'm in the same boat here. I had a web guy code it for me into the managing system I use, just like my whole web, so I cannot help you unfortunatelly. :(

Hi there,

Just wanted to let you know that if you use Wordpress for your website, there's an extension available that allows you to compare two audio files in real time. This tool is amazing and I'm planning to add it to my own website soon.
https://fr.wordpress.org/plugins/audio-comparison-lite/

Hey, sl4zhz! A developer and I just created SoundToggle, a before and after (A/B) audio player that anyone can build and embed on their website without any coding experience required.

You can check it out here: https://SoundToggle.io

I found this post a year ago when I was in the same boat looking for a before/after player for my mixing website. I couldn't find any decent plug-and-play solutions, so I hired a developer and we set out to build one.

At the moment, you can build a playlist, customize colors, add artwork, and even change the names of the toggles/untoggled states to something else like Unmixed / Mixed.

You can also share a direct link to the player hosted on our site in case you just want to quickly demo some A/B samples without building a whole webpage for it.

We're slowly working on adding some other features in too.

I know, I know.... I'm 8 years late to answer your question! Better late than never, right?! ?

Let me know how this works for you. Cheers!