Loading post navigation ...
 
 

Pro page

15
Nhận xét

Tạo một trình nghe nhạc MP3 mang phong cách của riêng bạn vào blog

| by Phan Dũng | views

Hãy nhấn thanks để ủng hộ tác giả

[FD's BlOg] - Tiện ích sẽ giúp các bạn tạo một trình nghe nhạc MP3 đơn giản vào trong blog của bạn, với những bài hát do chính bạn chọn, kèm theo những hình ảnh hiển thị của riêng bạn.

Với việc hiển thị một trình nghe nhạc vào blog của bạn đơn giản chỉ mang tính giả trí, và một phần tạo ra phong cách riêng cho blog của bạn, với những bài nhạc mà bạn yêu thích, những hình ảnh của riêng bạn, thì át hẳn nó sẽ là riêng biệt. Và trình nghe nhạc này chỉ có thể chơi được nhạc mp3.

Tiện ích chỉ đơn giản gồm các phần cơ bản như:
- Các nút chơi nhạc cơ bản của một trình nghe nhạc.
- Dòng hiển thị bài hát đang được chơi.
- Phần của sổ chính gồm 2 phần : bên trái hiển thị hình ảnh, bên phải hiển thị list danh sách các bài nhạc.

Hình minh họa:

Sau đây là các bước cài đặt:

1. Đầu tiên bạn phải có file chạy xspf_player.swf có thể download ở đây.
2. Sau đó giả nén ra và upload file xspf_player.swf lên 1 host nào đó. Ví dụ mình sử dụng host free của Google đó là Googlesite. Link sẽ có dạng như sau : http://sites.google.com/site/fdblogsite/Home/xspf_player.swf
3. Upload nhạc của bạn, hoặc có thể lấy link nhạc từ các website nghe nhạc.

4
. Tạo file XSPF Music Playlist.
-Các bạn mở Notepad (trong máy tính của bạn) và copy đọan code bên dưới (nhớ bổ sung list nhạc của bạn vào) sau đó lưu file lại với tên là myplaylist với phần mở rộng là .xspf (như vậy file có tên như sau myplaylist.xspf).
Chú ý: phần mở rộng phải là .xspf, nếu sai tiện ích sẽ không chạy được.

Bây giờ dán code bên dưới vào Notepad:

<?xml version="1.0" encoding="UTF-8"?>
<playlist version="0" xmlns = "http://xspf.org/ns/0/">

<title>FD's BlOg - MP3 Player</title>
<trackList>

<track>
<location>http://URL.com/song1.mp3</location>
<image>http://URL.com/song1.jpg</image>
<annotation>Song1 display text</annotation>
</track>

<track>
<location>http://URL.com/song2.mp3</location>
<image>http://URL.com/song2.jpg</image>
<annotation>Song2 display text</annotation>
</track>

<track>
<location>http://URL.com/song3.mp3</location>
<image>http://URL.com/song3.jpg</image>
<annotation>Song3 display text</annotation>
</track>

<track>
<location>http://URL.com/song4.mp3</location>
<image>http://URL.com/song4.jpg</image>
<annotation>Song4 display text</annotation>
</track>

<track>
<location>http://URL.com/song5.mp3</location>
<image>http://URL.com/song5.jpg</image>
<annotation>Song5 display text</annotation>
</track>

</trackList>
</playlist>

Chú ý :
- Dòng code màu đỏ : là tên sẽ hiển thị cho trình nghe nhạc
- Dòng code màu xanh dương : là link của bài nhạc, và ảnh của bài nhạc.
- Dòng code màu xanh : là dòng text sẽ hiển thị khi bài hát được chơi, ví dụ tên bài hát.
- Khi thêm bài mới chỉ cần download file về
myplaylist.xspf chèn thêm code như bên dưới rồi upload lên lại:

<track>
<location>http://URL.com/song6.mp3</location>
<image>http://URL.com/song6.jpg</image>
<annotation>Song6 display text</annotation>
</track>

<track>
<location>http://URL.com/song7.mp3</location>
<image>http://URL.com/song7.jpg</image>
<annotation>Song7 display text</annotation>
</track>

5. Sau khi chúng ta đã có file myplaylist.xspf, hãy up nó lên host,ví dụ như link này : http://sites.google.com/site/fdblogsite/Home/myplaylist.xspf

6. Bây giờ ta chèn trình nghe nhạc vào blog.
- Vào blog, tạo 1 widget HTML/Javascript
- Sau đó dán code bên dưới vào:

<object codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=" type="application/x-shockwave-flash" standby="Player is loading ..." height="160" width="400" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000">
<param name="_cx" value="10583">
<param name="_cy" value="4445">
<param name="FlashVars" value="">
<param name="Movie" value="http://sites.google.com/site/fdblogsite/Home/xspf_player.swf?playlist_url=http://sites.google.com/site/fdblogsite/Home/myplaylist.xspf">
<param name="Src" value="http://sites.google.com/site/fdblogsite/Home/xspf_player.swf?playlist_url=http://sites.google.com/site/fdblogsite/Home/myplaylist.xspf">
<param name="WMode" value="Window">
<param name="Play" value="0">
<param name="Loop" value="-1">
<param name="Quality" value="High">
<param name="SAlign" value="LT">
<param name="Menu" value="-1">
<param name="Base" value="">
<param name="AllowScriptAccess" value="sameDomain">
<param name="Scale" value="NoScale">
<param name="DeviceFont" value="0">
<param name="EmbedMovie" value="0">
<param name="BGColor" value="E2E2E2">
<param name="SWRemote" value="">
<param name="MovieData" value="">
<param name="SeamlessTabbing" value="1">
<param name="Profile" value="0">
<param name="ProfileAddress" value="">
<param name="ProfilePort" value="0">
<param name="AllowNetworking" value="all">
<param name="AllowFullScreen" value="false">
<embed src="http://sites.google.com/site/fdblogsite/Home/xspf_player.swf?playlist_url=http://sites.google.com/site/fdblogsite/Home/myplaylist.xspf" quality="high" bgcolor="#E2E2E2" name="xspf_player" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" align="center" height="160" width="400">
</embed>
</object>

Chú ý :
- Dòng code màu đỏ : thay đổi kích thước cho trình nghe nhạc của bạn
- Dòng code màu cam: màu nền của trình nghe nhạc.
- Dòng code màu xanh dương : là địa chỉ của file playlist (myplaylist.xspf)
- Dòng code màu xanh : địa chỉ file chạy (xspf_player.swf)

7. Đặt nó vào nơi mà bạn muốn hiển thị. Rồi save template.

Như vậy đã xong. Chúc các bạn thành công.


Enter your mail address:

15

Unknown

sao mình up lên nó có đuôi mylist.xspf.txt nữa nó ko chay cậu giúp với.

Unknown

file mylist.xspf up lên vậy đúng chưa http://ndkhanh1989.110mb.com/images/myplaylist.xspf.

Phan Dũng

@Duy Khánh :Có đuôi .txt là sai rồi bạn.
Bạn nhớ là khi tạo file myplaylist.xspf từ Notepad, bạn nên chỉnh chế độ hiển thị phần mở rộng của file để tiện thay đổi.

JungShin

http://jungjin-shin.blogspot.com cho em xin liên kết

Unknown

anh ơi, em tạo rồi nhưng sao nó ko hiện cái list nhạc vậy anh @@!

Higo_Chan

bạn có thể thử ^ v ^ V.I.P

Patytien

cho em hỏi muốn cho nó tự Play nhạc làm như nào ak

Unknown

cái này hay ghê tai opera mini android

Unknown

:) tks vì đã chia sẻ
loa hội trường

Unknown

Tôi làm như bạn hướng dẫn nhưng không load file nhạc lên trình nghe nhạc được. Xin được giúp đỡ!

Khách (ẩn danh)

Hướng dẫn hay quá :)
quán karaoke hay ở tphcm

Unknown

Hay quá bạn, cám ơn bài viết đã chia sẻ. Chúc blog của bạn thành công nhé :)
Bên mình thuộc hệ thống karaoke lớn nhất việt nam . Quán Karaoke Icool đẹp nơi để bạn thăng hoa, thỏa mãn niềm đam mê ca hát.

 Tham khảo tại website: quán karaoke giá rẻ ở tphcm

Unknown

Hay quá bạn, cám ơn bài viết đã chia sẻ. Chúc blog của bạn thành công nhé :)
Bên mình thuộc hệ thống karaoke lớn nhất việt nam . Quán Karaoke Icool đẹp nơi để bạn thăng hoa, thỏa mãn niềm đam mê ca hát.

 Tham khảo tại website: quán karaoke giá rẻ ở tphcm

Unknown

Cám ơn bạn đạ chia sẻ bài viết.
Ghé tương xem quán karaoke sài gòn icool của chúng tôi

Unknown


☺ Các bạn có thể viết lời bình của mình cho bài viết, và tuân thủ một số quy tắc sau:
» Các bài comment phải nghiêm túc, không dung tục, không spam.
» Nội dung phải liên quan tới chủ đề bài viết.
» Có thể sử dụng thẻ trích dẫn [quote], cấu trúc thẻ như bên dưới :

[quote=AUTHOR name=fdquote]NỘI DUNG[/quote]

» Có thể sử dụng các thẻ <b>,<i>,<a>.


BlOg FD chính thức đóng comment của khách ẩn danh.

BlOg FD.

[▼/▲] More Emoticons
:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Newer Posts Older Posts Home