Navigate / search

How to add a music player to your website

How to add a music player to your website 

A very simple tutorial, if you want to add music player or music playlist to your website, Blog, Blog post or any HTML or dynamic page you could follow the below tutorial.

Using the Yahoo music player, its never been so EASY to add media to your content and it’s a very light weight set up that can be configured in less that 2 minutes ;)

Step 1:  Upload the music file in mp3 or wav format to any location using FTP. Just like any other graphic or data it needs to be hosted some where. Once uploaded get the link to the file and use it in the blog below as below. 

Step 2:  Link to Audio file in the below format.

<a href=”http://mediaplayer.yahoo.com/example1.mp3″>First link</a>
<a href=”http://mediaplayer.yahoo.com/example2.mp3″>Second link</a>
<a href=”http://mediaplayer.yahoo.com/example3.mp3″>Third link</a>

Step 3:  Copy and paste this code on the same page

<script src=”http://mediaplayer.yahoo.com/js”></script>

Note:

If you want to embed the music player only for once, like for example in your post, embed the code with the blog post in “HTML” mode. Else if you want this to come in every page and do not want to use enter all these each time, you can paste the code in step 3 in the blog header (in themes)

You can see the official release page of yahoo media player here: http://mediaplayer.yahoo.com/

Features

  • Adds audio to your site with one line of HTML
  • Uses simple, easy-to-hack HTML instead of complicated proprietary markup, ushering in the REAL Media Web
  • Magical floating design never gets lost, is available when you need it, gets out of your way when you don’t need it
  • Automatically finds all audio links on your page, turning your page into a playlist
  • Plays all your blog entries with a single button click
  • Allows you to put the play buttons where they belong: IN CONTEXT
  • Keeps the user in the page rather than sending them away to a media player
  • Picks up your images and adds them as cover art
  • Requires no download, install or maintenance

Joshu Thomas

Founder of OrangeCopper Webmaster Networks, also writes for the latest Launch - HippieMonk Tech & LifeStyle Blog! Stay tuned to the Orangecopper Network of websites at our network page. Me on Google+

Trackbacks

  1. [...] This post was mentioned on Twitter by Joshu Thomas, Webdesign Blog. Webdesign Blog said: #webdesign How to add a music player to your website | Webdesign Blog http://ow.ly/19oq7s [...]