Tạo mã HTML đưa nhạc vào website hoặc blog

Nhạc và âm thanh là nhu cầu rất lớn của các bạn trẻ, đa số các bạn trẻ hiện nay hay lên internet không có một website riêng cũng có một blog, bài viết này sẽ hướng dẫn cho các bạn tạo mã HTML để đưa nhạc, phim, clip vào blog hoặc website của bạn.


Hiện nay, hầu hết các trang nghe nhạc đều tích hợp chức năng tạo mã để dán vào blog, website, form, … nên các bạn không phải mất công nhiều. Nếu thích nghe bài nào, bạn chỉ việc tới trang nghe bài đó rồi copy mã HTML, BB Code mà trang web nghe nhạc đã tạo sẵn rồi dán vào blog, website, forum của bạn là ok. Dưới đây là vài ảnh minh họa:

Ảnh minh học cho website http://nhaccuatui.com

Ảnh minh học cho website http://mp3.zing.vn

Còn nếu bạn chỉ có một liên kết nhạc trực tiếp thì sao ? Cách đơn giản là sử dụng chức năng tạo mã HTML cho Media đơn giản của website http://cit.ucsf.edu

Bước 1:

http://cit.ucsf.edu/embedmedia/step2.php?mediatype=WindowsMedia

Bước 2:

Bạn có thể để trống mục Server.

Nhập đường dẫn của file nhạc có đuôi MP3, WMA hoặc WMV… vào mục File path.  Để có đường link nhạc bạn có thể upload nhạc từ máy tính lên trang  www.uploadingit.com để lấy đường link nhạc. VD:  

Audio clip: Adobe Flash Player (version 9 or above) is required to play this audio clip. Download the latest version here. You also need to have JavaScript enabled in your browser.

Điều chỉnh kích thước cho giao diện chơi nhạc trong 2 mục Width (rộng), Height (cao).

* Ngoài ra bạn còn có thể chọn một số thuộc tính như sau:

Start automatically?: Tự động play hoặc không
Show controls?: Hiển thị những nút điều khiển hoặc không
Loop playback?: Tự động phát lại hoặc không
Alignment: Vị trí (trái, phải…)

Để hoàn tất bước 3 bạn nhấn nút SUBMIT.

Bước 3:

Nhấn nút TEST MEDIA để xem thử.

Nếu chương trình chạy tốt, bạn chỉ việc copy đoạn mã HTML bên dưới để đưa vào Blog, forum, website, hoặc trang web của mình.

Mình thử một cái nhé

  • Đây là liên kết trực tiếp tới một file nhạc đặt trên host của mình:

    Audio clip: Adobe Flash Player (version 9 or above) is required to play this audio clip. Download the latest version here. You also need to have JavaScript enabled in your browser.

  • Còn đây là kết quả:


Audio clip: Adobe Flash Player (version 9 or above) is required to play this audio clip. Download the latest version here. You also need to have JavaScript enabled in your browser.


Chúc bạn thành công!

16 thoughts on “Tạo mã HTML đưa nhạc vào website hoặc blog

  1. Xin cảm ơn bài viết rất hay “Tạo mã HTML đưa nhạc vào website hoặc blog” của bạn.
    Tôi bắt chước làm thử, nhập đường dẫn một file nhạc lấy từ trang Mediafire của riêng tôi, nhưng đến bước “Test Media”, mở ra thì không thấy gì, chỉ là ô vuông trống. Vậy là không thành công.
    Xin hỏi có phải do file nhạc từ trang Mediafire thì không đáp ứng được yêu cầu này?
    – Tôi thử vào uploadingit.com để upload nhạc thì không vào mục đăng ký được (click vào thì chẳng có gì xảy ra cả. Trang web ấy bị làm sao ấy??)
    – Xin hỏi ngoài trang uploadingit.com thì còn trang web nào tương tự, cho phép mình upload nhạc không ạ?
    Cảm ơn bạn nhiều.

  2. Chào bạn. Bạn liên kết (link) file từ mediafire không phải là link trực tiếp. Nếu bạn muốn có liên kết trực tiếp thì bạn phải có hosting riêng hoặc là dịch vụ lưu trữ file có hỗ trợ. Theo mình thấy thì Esnips rất tốt cho việc này, trước đây mình cũng đã từng dùng. Website: http://esnips.com

    Sử dụng Esnip bạn sẽ thấy rất dễ dàng trong việc upload và chia sẻ file nhạc. Chỉ cần upload file nhạc lên, sau đó sử dụng chức năng Mp3 Widget, copy lấy mã và dán vào chỗ bạn muốn hiện, thế là xong. Demo một cái nhé

    Get this widget | Track details | eSnips Social DNA

    Chúc bạn thành công ^^ !

  3. Hi,
    Rất cảm ơn bạn đã chỉ dẫn thêm. Mình đã tạo account trên esnips.com, upload thử 1 file nhạc lên, dùng Mp3Widgets để tạo Mp3Player thì được cái Player giống như trên của bạn, phát lại file nhạc ngon lành.
    Đến đây mình thử áp dụng đường dẫn của file nhạc ấy vào trang “Embedded Media HTML Generator” của CIT xem nó có chạy được không.
    Mình copy đường dẫn file nhạc:
    URL: http://www.esnips.com/doc/8179fbc5-2409-4067-966c-eaa259aafdf0/14-Dancing-leaves
    rồi theo đường dẫn mà bạn đã nêu ở bước 1 bên trên http://cit.ucsf.edu/embedmedia/step2.php?mediatype=WindowsMedia) dán thử vào rồi click “Test Media”: Vẫn không được!!?
    – Vậy trang “Embedded Media HTML Generator” của CIT bị hư rồi hay đang bảo trì hay update gì đó mà nó không hoạt động? Sao bạn lại làm được vậy?
    – Xin bạn thử làm lại với file nhạc của mình, xem có được không ạ?
    – Chức năng này có hoạt động với Yaohoo Mail không? Hay chỉ trên forum hay blog? Nếu bạn bè đọc mail mình mà có thể thấy cái hộp Player như thế rồi click nghe trực tiếp thì hay biết mấy nhỉ (thay vì phải gửi file nhạc đính kèm, rồi phải download về nghe, lòng vòng quá)
    Rất cảm ơn bạn chỉ giáo.

  4. Chào bạn. Link để bạn có thể embed được phải là link trực tiếp (direct link) giống như link ví dụ của mình trê kia. Rất ít trang cung cấp dịch vụ lưu trữ file miễn phí cho phép bạn lấy được direct link vì lý do băng thông, tài nguyên server bị tiêu tốn rất nặng. Nếu bạn có nhu cầu lưu trữ và chia sẻ file, nhạc, phim cao đến vậy, hãy bỏ tiền ra mua máy chủ ảo riêng (hosting riêng cũng không thể đáp ứng được). Còn về việc đưa mã vào trong email, mình chưa thử nhưng theo mình cũng không thể vì lý do bảo mật người dùng. Nếu muốn gửi nhạc cho bạn bè qua email, bạn post bài nhạc đó lên blog rồi gửi cho bạn của bạn, nhưng thế cũng không có gì là bất tiện cả 🙂

  5. Chào bạn Triều.
    Đúng là yahoo mail, google mail cho nhúng code gửi đi nhưng mở ra thì không tạo đuợc cái hộp player như trên kia mà cũng chỉ là một dọc code thôi. Vậy là mã HTML trên chỉ dùng cho website, forum có mở html.
    Nếu mình có một blog riêng như bạn nói thì đơn giản rồi. Vấn đề là mình hổng có viết blog 🙂
    Dù sao cũng xin cảm ơn bạn rất nhiều đã chia sẻ, giúp mình có thêm kiến thức.
    Chúc bạn dồi dào sức khỏe.

  6. Chào bạn!
    Mình cũng có một host riêng và mình thử làm như bạn nói nhưng khi test thử hay copy đoạn code thì nó báo
    Launch in external player
    ở chỗ file path mình ghi là http://nhahangtieccuoiq12.com/hinhanh/MOV00825.3GP.
    Bạn có thể chỉ cho mình biết mình đã sai ở đâu được ko ạ? Rất cảm ơn ban.

  7. Chào bạn!
    Mình cũng có một host riêng và mình thử làm như bạn nói nhưng khi test thử hay copy đoạn code thì nó báo
    Launch in external player và chẳng có gì cả
    ở chỗ file path mình ghi là http://nhahangtieccuoiq12.com/hinhanh/MOV00825.3GP.
    Bạn có thể chỉ cho mình biết mình đã sai ở đâu được ko ạ? Rất cảm ơn ban.

  8. Chao tat ca cac ban minh rat vui khi biet duoc trang web nay
    Minh dang tim kiem dode html cho nguoi khac download file nhac
    Minh dang dang viet ve trang web huong dan cho nguoi VN hoc tieng Thai
    (minh biet chut it ve ngon ngu Thai nen minh muon chia se cho moi nguoi)
    nhung trinh do tin hoc cua minh kem qua nen phai nho den su giup do cua cac ban
    Minh rat mong duoc su giup do cua cac ban
    neu cac ban muon hoc tieng Thai ban co the nhan tin cho minh qua mail vthoang@live.com
    ban co the hoi tat ca nhung gi ban muon ve ngon ngu Thai
    than chao cac ban

  9. Bạn ơi mình copy code chạy thử nhưng ko đc. Nó báo”Launch in external player”mình copy file khác thì nghe đc nhạc nhưng phải dow về rất bực.
    Làm thế nào để lấy nhạc trong máy mà nó chạy được ý

  10. Copy & paste the following…


    Audio clip: Adobe Flash Player (version 9 or above) is required to play this audio clip. Download the latest version here. You also need to have JavaScript enabled in your browser.


    • Chào bạn. Liên kết từ uploadingit.com không phải là liên kết trực tiếp nên không thể sử dụng cách này được ^^ !


  11. Audio clip: Adobe Flash Player (version 9 or above) is required to play this audio clip. Download the latest version here. You also need to have JavaScript enabled in your browser.


  12. minh lam theo huong dan cua ban sao lien ket uploadling.it lai ko phai la lien ket truc tiep vay.?
    Cach 2 ban huong dan hinh nhu cung ko dc hay sao y

Leave a Reply

Your email address will not be published. Required fields are marked *