Thứ Bảy, tháng 7 29, 2006

Cách xây dựng chương trình chơi nhạc cho trang web của bạn

Xin lưu ý: hiện nay không có cách nào để chèn nhạc vào bài viết của blog Yahoo 360, xin xem thêm chi tiết bên dưới.

Cách đơn giản nhất để chèn một chương trình nghe nhạc vào trang web của bạn là dùng đoạn mã sau:

    < src="Đường dẫn" type="application/x-mplayer2" autostart="true" loop="false" width="300" height="42" controller="true" bgcolor="#FF9900" > < /embed >
Lưu ý là đoạn mã trên đã được thay đổi một chút vì lý do kỹ thuật (thay dấu _<_>_ bằng _<_ và _&gt_), nên nếu bạn copy&paste nó thì sẽ không có tác dụng đâu, muốn nó có tác dụng thì bạn phải tự tay gõ lại nó, hoặc copy&paste rồi thay các dấu "<" (">") trong bài bằng dấu "<" (">") trên bàn phím.

Đây là đoạn mã chèn nhạc đơn giản nhất, tương thích với tất cả các trình duyệt, hiệu quả trong 90% trường hợp (hầu hết các trang nghe nhạc đều dùng cách này).

Tuy nhiên, nếu bạn muốn làm một trang nghe nhạc chuyên nghiệp hơn, ví dụ như album sau của Microwave - Lối thoát:

Bạn nhấn vào tên bài hát để nghe bài đó, hoặc nhấn vào đây để nghe cả album (theo thứ tự).

Ưu điểm của cách làm này là rất tiện lợi cho người nghe, vì họ không phải vào xem tận 11 trang để nghe 11 bài ở trên, mà chỉ việc vào trang album, rồi thích nghe bài nào thì nhấn vào bài đó thôi. Tất nhiên là nếu bạn đặt quảng cáo ở trang web của mình thì có thể bạn sẽ không thích làm cách này.

Còn đây là cách đặt đoạn mã ở trên: chương trình này gồm 2 phần: javascript để lập cửa sổ mới và chèn chương trình chơi nhạc vào cửa sổ này, phần 2 là html để gọi lệnh javascript trên.

Phần 1:
    < script language=JavaScript type=text/javascript >
    function mediaplayer(filedesc,filepath,WindowNumber)
    {

    var objTypeTag = "application/x-mplayer2";

    PlayerWin = window.open('',WindowNumber, 'width=320, height=217, top=0, left=0, screenX=0, screenY=0, resizable=0, scrollbars=0, titlebar=0, toolbar=0, menubar=0, status=0, directories=0');

    PlayerWin.focus();
    PlayerWin.document.writeln("< html >< head >< title >" + filedesc + "< /title >< /head >");
    PlayerWin.document.writeln("< body bgcolor='#9999ff' >");
    PlayerWin.document.writeln("< div align='center' >");
    PlayerWin.document.writeln("< b style ='font-size:18px;font-family:Lucida,sans-serif;line-height:1.6' >" + filedesc + "< /b >< br / >");
    PlayerWin.document.writeln("< embed src ='" + filepath + "' type='" + objTypeTag + "' autoplay='true' width='280' height='69' controller='1' showstatusbar='1' bgcolor='#9999ff' kioskmode='true' >");
    PlayerWin.document.writeln("< /div >");
    PlayerWin.document.writeln("< p style='font-size:12px;font-family:Lucida,sans-serif;text-align:center' >< a href='" + filepath +"' >Download this file< /a > < span style='font-size:10px' >(right-click or Control-click)< /span >< /p >");
    PlayerWin.document.writeln("< form >< div align='center' >< input type='button' value='Close this window' onclick='javascript:window.close();' >< /div >< /form >");
    PlayerWin.document.writeln("< /body >< /html >");

    PlayerWin.document.close();
    }
    < /script >


Bạn chỉ cần chèn đoạn mã trên vào trang web nghe nhạc của mình là được.

Phần 2:

Đoạn mã thứ 2 là < a href="Đường dẫn" target="_blank" onClick="javascript:mediaplayer('Tên bài hát',this.href,'1'); return false" > Nhấn vào đây để nghe < /a > , chèn một lần cho mỗi bài hát.

Những vấn đề khác:

1. Nếu bạn muốn lập playlist như ở trên (*.m3u), bạn cần tạo một file text có nội dung:

#EXTM3U
(Đường dẫn tới bài 1)
(Bài 2)
(Bài 3)
...

với dòng thứ nhất là định dạng của playlist (ở đây là m3u), các dòng còn lại là đường dẫn (URL) tới bài hát, rồi lưu file này bằng định dạng *.m3u

Nếu muốn chính xác hơn, bạn cũng có thể dùng chương trình chơi mp3 để tạo playlist này.

2. Hiện tại blog Yahoo 360 chưa hỗ trợ chèn nhạc vào bài viết, nhưng chèn nhạc vào trang chủ của blog thì được, bạn vào phần Edit Blast của mình ( http://360.yahoo.com/edit/blast.html ), rồi điền link tới bài hát vào phần URL. Sau đó mỗi lần bạn muốn nghe bài đó thì nhấn vào nút |> để nghe, nhưng xin nói trước là chất lượng sẽ thấp hơn thực tế nhiều đấy.

3. Đối với người dùng Linux: bạn cần phải có chương trình hoặc plugin hỗ trợ nghe nhạc online, như gxine, kmplayer hoặc mozilla-mplayer; còn những người dùng Windows thì chỉ cần chương trình Windows Media Player bản 9.0 trở lên là được (có thể cũ hơn, nhưng tôi chưa thử).

Mong nhận được sự góp ý của các bạn.

Download cả bài hướng dẫn: http://www.myfilehut.com/userfiles/159996/ct-nghe-nhac.zip

(gồm bài hướng dẫn + 3 đoạn mã ở trên).

2 nhận xét:

  1. Tôi vừa thay đổi một số chi tiết của bài viết này, hi vọng là đỡ rắc rối hơn trước một chút.

    Trả lờiXóa