Tạo playlist nhạc cho Blog

/
MP3 Flash Player for Blogspot
Bài viết này sẽ hướng dẫn cách tạo một playlist nhạc bằng Flash để chèn vào blog, không phải từ mp3.zing.vn hay bất cứ website âm nhạc nào mà là của chính bạn. Đây là một MP3 Flash Player sử dụng tệp xml tạo track list để chơi nhạc mp3 (và chỉ định dạng .mp3 mà thôi), ngoài ra thì MP3 Player này còn cho phép hiển thị cover riêng cho từng bài.

Demo bạn có thể xem ở dưới đây.



Xem screenshot nếu Playlist không load được do lag mạng

Đầu tiên bạn download Mp3 Flash Player tại đây, tiến hành giải nén được hai file là player.swfplaylist.xml. Tiếp theo, bạn upload 2 file này lên một dịch vụ hosting nào đó mà có hỗ trợ direct link. Ở đây mình up lên DROPBOX.

Khi đã có link direct của flash rồi thì bạn thay vào đoạn code bên dưới:
<object data="http://dl.dropbox.com/u/11103024/mp3player/player.swf?autostart=true&amp;playlist=http://dl.dropbox.com/u/11103024/mp3player/playlist.xml" height="226" type="application/x-shockwave-flash" width="408" wmode="transparent"><param name="movie" value="http://dl.dropbox.com/u/11103024/mp3player/player.swf?autostart=true&playlist=http://dl.dropbox.com/u/11103024/mp3player/playlist.xml"/></object>
Đoạn code trên bạn có thể chèn vào một tiện ích HTML/Javascript hoặc ngay trên bài đăng cũng được. Để add nhạc vào playlist thì chúng ta edit playlist.xml bằng Notepad, trong file xml này bạn sẽ thấy:
<song location = "URL bài nhạc"
cover = "URL ảnh đại diện"
title = "tựa đề bài hát"/>

Muốn thêm bao nhiêu bài hát vào list thì bạn chèn thêm bấy nhiêu đoạn mã ở trên. Xong rồi thì save lại, DROPBOX sẽ tự động cập nhật. Chúc bạn tạo được một playlist nhạc "không đụng hàng".

- Nhạc cũng nên upload lên DROPBOX luôn cho tiện.
- Kích thước ảnh cover phải là 150x150 pixel.
Add a Comment

86 comments

=))Vậy có thể chèn vào bài viết không Noct ? Để mình vọc thử :">

4/26/2011 comment-delete

hihi, đã làm đc

4/26/2011 comment-delete

Thủ thuật hay tuy nhiên em chưa có nhu cầu sử dụng? Cảm ơn bác nhé! :D

4/26/2011 comment-delete

trông hay và rất bắt mắt

4/26/2011 comment-delete

cái này cũng hay! hihi! để test =]]

4/27/2011 comment-delete

làm đc òi! nhưng mà dùng tạm cái cũ của mình tiện hơn! ^^

4/27/2011 comment-delete

Đôi khi tìm trên mp3.zing hoặc nhaccuatui.com cũng không có bài nhạc mình thích, đợi duyệt thì lâu quá :-ss. Dùng cái Flash này thì chủ động hơn b-)

4/27/2011 comment-delete

Nhận xét này đã bị quản trị viên blog xóa.

4/28/2011 comment-delete

@Minh Quân: Đọc kĩ nội qui comment dùm cái nhé, không phải muốn khoe khoang ở đâu cũng được

4/28/2011 comment-delete

ưhm, cám ơn bạn lần nữa, tuyệt lắm. Mỗi lần viết blog mình phải có nhạc để nghe ! ^^

4/28/2011 comment-delete

Hay ở chỗ là đc cá nhân hóa! Chưa hề xài thằng dropbox này, Nó ổn định ko bác Noct ? :-?

4/28/2011 comment-delete

Nó cũng bình thường nhưng được cái là link direct, bandwidth khá. Nhưng nếu bác biết host khác xịn hơn thì cứ phang :D

4/28/2011 comment-delete

cái url mp3 là link nhạc có dạng http://____.mp3 a`h bác,

4/28/2011 comment-delete

Ừ đúng rồi :)

4/28/2011 comment-delete

@Noct : Sorry Noct nhé

4/29/2011 comment-delete

Mấy bữa nay chưa rảnh đi dạo blog. Chúc bác Noct ăn mùa lễ hoàng tà ráng nhé. b-)

4/30/2011 comment-delete

anh cho em hỏi một câu ngoiaf lề
em có cái theme vô tình tìm được trên mạng, h em muốn viết tiếng việt có dấu trong cái file xml thỳ làm thế nào, khi em viết vài thỳ đều báo lỗi, hoặc là bị lỗi font, mất chữ .....mong anh giúp zùm em. Thanks anh trước nha.

4/30/2011 comment-delete

Em hãy cài đặt cái theme đó lên Blogger rồi sau đó hẵng chỉnh sửa, nếu chỉnh trực tiếp trong file xml thì có thể bị hỏng, nguyên nhân thì dài dòng lắm không tiện nêu ra.

4/30/2011 comment-delete

hi hi, thabnks anh nhiu`
bữa tr'c em làm thử bằng world, rồi up lên, nó báo lỗi file liền và ko lưu được ......
p/s: anh học BK chuyên ngành CNTT a`h

5/01/2011 comment-delete

Hi Noct, cái Randomplay hok hoạt động đc àh? ^^

5/01/2011 comment-delete

Cũng không rõ nữa, chèn đại :D

5/01/2011 comment-delete

Tốt nhất là up lên blogger xong chỉnh sửa, hiển thị tốt tiếng Việt luôn

5/02/2011 comment-delete

Tuyệt vời :) Bác Noct có thể chia sẻ 1 số host cho up file mp3 direct ko? Mình tìm hoài ko thấy!

5/04/2011 comment-delete

Chỉ biết mỗi Dropbox với fileden.com :((
Cùng lắm thì dùng IDM bắt link của mấy web nhạc =))

5/04/2011 comment-delete

Noct ơi, muốn đổi nền khung nhạc thì làm thế nào? Nền màu trắng ko hợp trong site mình!

Không hiểu sao từ khi thấy cái template Perception bị cậu modify và rename tác giả thì tôi không muốn giúp gì nữa :-?

5/08/2011 comment-delete

Ủa thế mình tham khảo và chỉnh sửa khác đi cũng phải để nguyên hả noct! Sr noct, vì mình tham khảo tem này trên 1 trang nào mình cũng không nhớ!

Cái này có ưu điểm gì so với Playlist của các trang nhạc nhỉ?

Không quảng cáo, tùy chỉnh chất lượng nhạc + ảnh bìa theo ý thích và đặc biệt là "không đụng hàng" :D

5/08/2011 comment-delete

blog rất đẹp cho rinsun kết bạn nha
chúc bạn vuj vẻ

5/11/2011 comment-delete

Cái Player này đẹp nhưng khi em làm thì lúc rê chuột vào nó chạy danh sách nhanh quá làm không thể chọn kịp bài hát nữa, có cách nào khắc phục không anh?

5/18/2011 comment-delete

Anh cũng không rõ nữa, chắc do cái list của em dài quá nên nó phải scroll nhanh. Em thử bỏ bớt còn 10 bài xem còn bị không.

5/18/2011 comment-delete

anh ơi ! sao làm cái http://dl.dropbox.com/u/30700724/playlist.xml
có thể hiện chữ tiếng việt vậy

Có thể cái Flash này không hỗ trợ Unicode, tạm thời cứ ghi không dấu vậy :D

5/30/2011 comment-delete

thank anh nhiu nhiu..
mà cho em hoi cai "song location" dung url cua nhaccuatui.com sao hog dk j anh..??

6/01/2011 comment-delete

Được, nhưng nhaccuatui.com nó đổi link liên tục đấy nên không dùng lâu được.

6/01/2011 comment-delete

Không hiểu sao cái đầu play của mình nó lại chuyển sang màu trắng chứ nó ko có màu đen giống như của bạn

6/15/2011 comment-delete

Trong playlist.xml thì bạn sửa skin từ white thành black nhé.

6/15/2011 comment-delete

Thanks bạn :)

6/15/2011 comment-delete

sao mình coppy đường link ma k dk nhi?

7/05/2011 comment-delete

Phần scrolltype="auto", danh sách của m dài, m muốn có thanh cuộn thì sao Noct . Cảm ơn bài viết rất hay!

7/12/2011 comment-delete

áp dụng ngon lành cành đào thank ban!

8/02/2011 comment-delete

Noct ơi! Mình cũng xài blogspot. Mình rất thích tạo tab cho blog giống của Noct vậy đó. Noct chỉ mình cách làm nhé! Cám ơn rất nhiều!hi. Hôm nào lướt web có rảnh, mời Noct ghé thăm blog mình.hi

8/04/2011 comment-delete

Ối bạn xinh thế thì phải ghé thăm thôi :*
Tab thì xem ở đây nhé :))

8/05/2011 comment-delete

@Noct :
um. thanks Noct nhiều nhé!

8/06/2011 comment-delete

Nhờ cậu mà một newbie như mình làm được nhiều cái hay ho :"D. Cái này thích ở chỗ là thoải mái chọn nhạc và cover mình thích :"D.

Mình cũng vừa lấy cái Newscast của cậu về xài nên qua đây cám ơn một tiếng cho phải phép :">. Cám ơn Noct nhiều nhé, hóng những bài viết mới của cậu :">

8/09/2011 comment-delete

Cảm ơn Noct nhiều,mình đã hoàn thành xong.Chúc bạn ngày nghỉ vui vẻ:))

Mình muốn hỏi, Playlist này là chạy trực tiếp từng ca khúc, hay là tự động download bài hát về máy vậy?
Vì mình đã làm được rồi, nhưng chỉ thấy xuất hiện download mp3, mà ko thấy playlist chạy. Không biết mình có làm sai bước nào không?

bạn tắt IDM đi thì nó mới chạy

8/28/2011 comment-delete

Oh, mình biết rồi, cám ơn bạn nhiều nha.

Anh Noct ơi, có cái Skin nào đơn giản hơn cái trong bài viết không ạ? Không cần Cover cũng được ạ.

9/01/2011 comment-delete

https://dl-web.dropbox.com/get/playlist.xml?w=9258a8db Anh Noct xem gium em cai link .xml nay sao chen vo ko choi hac duoc. :((
ps: xin loi vi khong go tieng Viet duoc.

9/08/2011 comment-delete

Link die...

9/09/2011 comment-delete

Cái này lạ đấy..
Đúng là tại hạ lâu ngày bế quan wa

9/14/2011 comment-delete

@TiensPhuAn Các hạ là ai thế ?

9/14/2011 comment-delete

Tại hạ là kẻ thích viết blog, tạo logo. Cam ơn noct vì những điều mới mẻ

9/16/2011 comment-delete

Bác ơi muốn thay đổi giao diện khác thì làm sao hả bác?

tks anh rất nhiều
bài viết perfect x'D

10/27/2011 comment-delete

Làm sao để lấy link direct như Noct, mình ko lấy được, nó là dạng download nên chèn vô ko hiển thị. help nha.

11/03/2011 comment-delete

@Hyoan bạn xóa IDM đi mới nghe nhạc được nhé.

11/05/2011 comment-delete

@Noct ý mình là file flash với xml ở dropbox. nhưng giờ mình biết rồi. Do mình chưa chuyển vô public folder nên ko thấy link direct như Noct. ^_^. Thanks.

11/05/2011 comment-delete

Mình muốn nó chỉ phát trên Home thôi ko muốn phát các trang khác có đc ko bạn!
Hướng dẫn mình luôn cái Code nha.
Tks

11/06/2011 comment-delete

Cho mình hỏi nó chơi shuffle được ko Noct?

12/01/2011 comment-delete

Cám ơn Noct nhiều nhiều nha!!!! ='D

12/04/2011 comment-delete

Bác Noct, lâu rồi mới có bạn nữ tới thăm nhà ,lại kon` cảm ơn nữa. Bác sướng nhá:D

12/04/2011 comment-delete

@Quang nhiều lắm chứ bác [-(, chẳng qua mấy bợn ấy e thẹn nên không ngỏ lời đó thôi =d>

12/04/2011 comment-delete

Chào bạn.
Trước tiên cảm ơn bạn đã chia sẻ một thủ thuật hay.
Tiện đây mình hỏi bạn chút nhé. Mình đã làm giống như của bạn, mình đã upload 2 file lên Dropbox và thay vào code của bạn ở trên sau đó copy vào bài đăng, nhưng khi đăng bài nó hiển thị dạng code trên mà không chuyển thành list nhạc. Bạn có thể hướng dẫn cụ thể hơn nữa được không, mình mới tạo blog nên còn "gà" lắm, mong bạn giúp đỡ.
Ngoài ra, mình muốn hỏi bạn chút nữa là khi mình chép các file nhạc vào public thì các file đó tự động up lên host phải không, sau đó mình có thể xóa file đó đi thì có ảnh hưởng không? bởi vì như vậy thì máy mình đầy lên không đủ.

@sangnguyenMS (addmin) cậu đã copy một số thủ thuật của tôi mà không ghi nguồn nên đừng mơ là sẽ được trả lời.

Trích: http://sangnguyenmskg.blogspot.com/2011/12/tuy-bien-nut-read-more-cua-blogspot.html

12/12/2011 comment-delete

Trước hết mình xin lỗi vì không biết đó là bài của bạn, vì mình không copy từ site của bạn mà từ đây: "http://luat1x1.blogspot.com/2011/11/tuy-bien-nut-read-more-cua-blogspot.html".
Thứ 2: Mình chỉ mới tạo blog này nên chưa có ý định công khai, mà bạn đã vào thì biết rồi đấy, mục đích của blog này không phải là để chia sẻ thủ thuật, mà mình tạo ra với mục đích khác. Do đó, mình không ghi nguồn gốc của bài đăng, đưa vào bài đăng với mục đích là nhớ mình đã làm những thủ thuật nào thôi.

Chuẩn không cần chỉnh,Không biết thanks NOct nhiều như thế nào chứ mình lùng cách chèn list nhạc lâu lắm rồi mà giờ mới thấy.^ ^.
Mình làm được rồi,Thanks vì Tut hướng dẫn Dropbox nữa.^^.
Noct này,hỏi cái này ngoài lề xíu nha:
1.Các link trong bài viết của blog sẽ được gạch dưới bằng 1 đường line,giờ muốn đổi đường line đó thành đường chấm chấm thôi được không?
2.Phần Bài viết trên blog của tớ,tớ đã chọn hiển thị các share button như Google +,+1,hay Mail it trên mỗi bài viết.Nhưng sao không thấy nó hiển thị :(

12/13/2011 comment-delete

Mà Muốn thay Skin khác thì lên Trang chủ Dropbox tìm hả Noct?

12/13/2011 comment-delete

Với list nhạc này thì sau khi hết bài có tự động chuyển qua bài kế tiếp không vậy, mình nghe list của bạn thấy nó chỉ phát bài 01 rồi chuyển sang bài của linkinpark không thấy nó phát nữa.

list nhạc trong demo chỉ có một bài duy nhất thôi bạn

5/18/2012 comment-delete

Vậy nó có tự động chuyển bài không Noct

Mình muốn kích thước của của bộ playlist to lên thì thay đổi code chỗ nào vậy Noct?

Cái này mình ko cho nó auto play được ko bạn, ah nếu chỉ dùng cho một file mp3 thì có skin nào khác ko nè?

6/29/2012 comment-delete

tất cả cái đó đều có thể điều chỉnh trong file xml

7/05/2012 comment-delete

sao mình tạo mãi mà nó k chạy nhỉ bác giúp t với
YH:a8forever_love

7/12/2012 comment-delete

Cảm ơn Noct, cái này rất tuyệt!

Tuy nhiên, mình muốn chỉnh sửa màu sắc của nó vì màu hông không phù hợp với tông màu của site mình.

Có cách nào để thay đổi màu sắc, giao diện của nó không? Chỉ mình với nhé :)

7/18/2012 comment-delete

ở đây không ai bị như bạn cả

7/21/2012 comment-delete

nếu bạn rành Adobe Flash CS5 thì có thể làm được

7/21/2012 comment-delete

cho tôi hỏi với sao tôi copy link direct vào ma ko lưu được ở trong Chỉnh sửa HTML của blog của tôi?

10/15/2012 comment-delete

cam on ban nhieu nhe

10/24/2012 comment-delete

sao em làm k dc vậy anh, anh có yahoo chat không giúp em tí ạ,

11/29/2012 comment-delete

mình đã làm theo cách bạn hướng dẫn nhưng ko thấy hiển thị gì mà cũng không thấy báo lỗi gì.
mình coppy vào trong thẻ Boydy ko biết đúng hay sai, nếu bạn rảnh pm yahoo caube.codon88 bảo mình với, mình thanks bạn nhiều!

1/01/2013 comment-delete

Đăng nhận xét

- Không chèn liên kết quảng cáo khi đăng nhận xét.
- Nội dung nên liên quan tới chủ đề của bài.
- Use English if you do not understand what we are talking about.

Chèn Emoticons
Top
Copyright © 2011 Noct Blog. Content is licensed under a Creative Commons Attribution-NonCommercial 3.0 License