23.11.2010 in Home > Internet by Namit Gupta

Embed Audio on Website – The Best Way

Audio_Icon

Embedding Audio or Video is the best way to make a webpage more interactive. There are quite many options to embed a video on a webpage, you can easily upload a video on YouTube and embed it on your webpage. But there are not much options to embed an audio.

SoundCloud is a great service for sharing music on web. You can easily and in no time embed an audio with a stunning audio player on your webpage. It supports AIFF, WAVE, FLAC, OGG, MP3, AAC files. SoundCloud has both the free and premium accounts. In free account you can upload and share audio but with some limitations, mainly you can only upload up to 120 mins of audio.

Related: How to Hide Video Display from an Embedded YouTube Video

Procedure to Embed Audio on a Webpage

1. Goto SoundCloud.com

2. Click on ‘Upload & Share’.

soundcloud

Then click on ‘Choose files‘. Select the track you want to upload, from your hard disk.

soundcloud upload files

3. Uploading will start. Enter the track information and your email id. [Email is required, because a confirmation mail will be sent to your email address, then only you will be able to view the uploaded audio.]

trackinfo

4. Click on the confirmation link sent at your email address. You will be redirected to your just uploaded track.

track

5. You can now listen to your uploaded track.

6. Now you can both, share it with other or embed it on your website.

7. Click on the ‘Share‘ button at the top of audio player.

share

8. Copy and share the secret link to share the audio with your friends or anyone.

9. Copy the embed code to embed the played on your webpage, and you can even customize the look of audio player.

To customize click on ‘Customize player‘. Change the color and type of player (Some players are only available to premium account users)

customization

10. Copy the embed code and paste it on your website, wherever you want to audio player to appear.

Sample:
Ho Subah by Joshish

Feel free to put in your questions and queries in the comment box below. I will be happy to answer them.

  • http://www.niharsworld.com/ Nihar

    Great tip dude.

    Thanks. Keep coming…

  • http://theitechblog.com/ Namit Gupta

    I suppose this is not possible with the Sound Cloud player. Could not find any such way to hide the player from appearing.

  • Jason R.

    How do I add the Soundcloud Dreamweaver plugin on my blog so that songs can auto play?