Thêm nhạc nền tự chạy cho website WordPress, Blogspot cực đơn giản
Hôm nay Hocban.vn chia sẻ đến mọi người cách thêm (chèn) nhạc nền (định dạng mp3) vào website WordPress, Blogspot để khi Tết, Giáng Sinh (Noel) lại cần. Cách làm cực kỳ đơn giản luôn.
Cái trò này để làm chi ta ?
Ai hỏi thì các bạn cứ nói “mình thích thì mình làm thôi :v ” haha ! Hề hề, nói vậy chứ cái này xài phải cân nhắc vì:
Cái hay: vào những ngày lễ tình cmn nhân, sinh nhật bạn gái, dợ, hay là một ngày lễ gì đó đặc biệt trong năm bạn chèn nhạc vào để hứng khởi và thay đổi không khí :v
Cái dở: nó có thể gây khó chịu khi người truy cập không muốn nghe nhạc hoặc không thích bài hát của bạn, và nó cũng không có chỗ tắt, mở tab mới mà vẫn là web của bạn thì nó hát bè, cái trước cái sau … không nghe được :v >> nên dùng cho landing page thì oke con dê luôn 😀
Cách thêm (chèn) nhạc nền tự chạy vào WordPress
Để làm các bạn chỉ cần copy đoạn code sau và đem dán vào file header.php hoặc footer.php là được nhé !
<audio autoplay > <source src="https://s3.amazonaws.com/Syntaxxx/bigger-picture.mp3" type="audio/mpeg"> </audio>
Ở đây mình sẽ dán nó vào phần footer, cụ thể là trong file footer.php và đặt nó gần cuối file, cụ thể hơn nữa là nó trên thẻ đóng </body> như hình dưới đây:
Các bạn có thể thay thế đường dẫn file .mp3 bằng đường dẫn bài hát mà bạn úp lên chẳng hạn như:
https://hocban.vn/wp-content/uploads/2017/07/ten-bai-hat.mp3
Một mẫu code cũng khá ngắn gọn, ngắn hơn cái trên luôn, các bạn chèn vào nó cũng hát được và có thể lặp lại.
<audio src="https://s3.amazonaws.com/Syntaxxx/bigger-picture.mp3" autoplay loop> </audio>
Nếu bạn muốn chèn nó vào một page hay posts nào đó thích và chỉ khi vào page đó nó mới hát nhạc thì bạn chèn nó ngay vào bài viết (phía dưới cùng) trong chế độ soạn thảo HTML CSS.
Đấy, rất đơn giản đúng không nào ? Anh em nào làm được rồi hoặc đang chơi trò này comment link web bên dưới xem nhé ! Có chơi mới dán, ko chơi không dán SPAM nhé !
Cách thêm nhạc nền tự chạy vào Blogspot
Trên Blogspot thì khá đơn giản, anh em thêm một tiện ích HTML/Javascript, sau đó dán đoạn code này vào và lưu lại.
<audio autoplay='true' src='https://s3.amazonaws.com/Syntaxxx/bigger-picture.mp3'/>
Vẫn như thường lệ, nếu có gì thắc mắc hoặc góp ý về thủ thuật này, anh em có thể côm mềnh bên dưới nhé :v
Đang yên đang lành, vào site bác giật hết cả mình vội cho volume về 0 gấp 🙁
Chỉ bài viết này mới hát thôi nhé bạn !
làm sao để tạo được links mp3. mình chỉ có 1 đoạn ghi âm trong máy có tạo được không
Nếu bạn đang dùng WordPress thì nó có sẵn phần upload lên website rồi. Còn nếu Blogspot thì úp lên bên khác và lấy link về.
google nó cấm tự động phát từ 2018 rồi các pro. ! số trình duyệt cũ vẫn phát dc
Bạn xem bài viết này vẫn tự chạy nhạc bình thường đấy :v
sao trên mobile nó ko nghe nhạc được vậy bạn
Trong bài mình có mấy đoạn code luôn, bạn thử đến khi nào được thì thôi nhé.
Em đọc bài viết và các câu trả lời độc giả của bác thì thấy bác không phải là dân lập trình chuyên về code, bác copy code để dùng thôi thì phải.
Đúng rồi bạn, mình không phải là dân code đâu, trong quá trình tùy chỉnh giao diện web cũng như sử dụng mình tham khảo nhiều tư liệu trên mạng để làm và có viết lại để dùng + ai cần người ta xem.
Trình duyệt Cốc Cốc và Google Chrome, không tự động phát đc. Trên Microsoft Edge thì lại tự động phát được. Fix lỗi này sao v bạn, tks!
Bạn thao tác với Blogspot hay WP thế ?
Mình làm trên LadiPage
LadiPage nó là HTML hay sao á, bác dùng code
HTML nhé, mình chèn vào thẻ <body>, đây là link demo của mình: https://bothan.site/demo/
Nghe nó hát bình thường mà bạn 😀
bạn sử dụng trình duyệt nào v, mình sử dụng cốc cốc và gg chrome ko auto nghe đc @@
Chrome, Firefox và Ege nhé thớt
Em gián vào html/JavaScript rồi ko thấy có nhạc
Bạn thao tác với Blogspot hay WP thế ?
blogger không đc
Đọc đoạn dưới cùng bài viết nhé bạn !
Có cách nào mà không phải click vào 1 cái thì nó bắt đầu mới phát không anh
Không hiểu ý bạn lắm, vì bài này hướng dãn cách chèn nhạc nó tự phát, không cần phải click play 😀
mình chèn nhạc nhưng mà phải click vào 1 cái gì đó thì nó bắt đầu mới phát thì sao hả bạn
Nếu mà trên WordPress thì cái đó dễ nữa, bác nhìn bên sidebar của Hoban.vn có thanh phát nhạc. Nó là Audio widget có sẵn của WordPress.
E cx muốn chèn nhạc nhưng phải đụng vào nút nó ms phát ạ, chỉ e vs ad
Bạn đang dùng wordpress.com , để thêm nhạc có nút PLAY thì bạn tạo một widget bên sidebar >> chọn Audio widget >> thêm bài hát vào thôi 😀
copy đoan mã vào rồi ra trang chủ chỉ có máy tính của tôi nghe dc là bị sao vậy ad ơi . qua máy tính khác vào trang ko nghe dc
Vậy bác cứ chèn link vào bình luận em nghe thử được không 😀
ad ơi em do không đăng ký tài khoản business trên wordpress mà chỉ là mục dích học tập e có copy cái code cuối cùng và quăng vô HTML custom thì nó có chạy
Nhưng khi em thay đổi link bài nhạc thì nó lại im lỉm không chạy dc là sao vậy ạ
Bài nhạc bạn đăng có link như nào cho mình xem thử 😀
Mình muốn cài bài khác thì sao ad
Bạn làm theo bài viết này là được nghen: https://hocban.vn/them-nhac-nen-tu-chay-cho-website-wordpress-cuc-don-gian
Thấy cũng tếu nhỉ. Hihi
Cho tiếng chó sủa vào hơi bị dui đó bác :v
Mình cứ nghĩ đến trường hợp chèn đoạn nhạc thật hay đoạn đầu và chèn khúc sau 1 đoạn nhạc ” thật kích thích” thì sao nhỉ
Thì đoạn nhạc sau sẽ rất cích thích chứ còn sao nữa bác.
Nếu nó đang đeo tai nghe thì nó thích, còn nếu nó đang bật loa ngoài thì nó nó sẽ bình thản thốt lên “**** ****” :v
Chào admin. Hiện nay em muốn chèn nhạc trên Opencart thì sao ạ?
Em trước giờ chưa xài thử Opencart nên cũng chưa biết, tuy nhiên bác cứ tìm file nào có chứa thẻ đóng body thì dán đoạn code như bài hướng dẫn của e vào là được.
Hay đó bác! Áp dụng cái này cài bài nhạc tết chơi cho web cũng hay đó. Cám ơn bác nhé!
Vâng, cảm ơn bác đã cảm ơn và học theo ạ :v
Này nên dùng cho mấy site truyện tranh kinh dị, chèn nhạc vào chắc phê hơn khi đọc =))
Ý tưởng hay đó bác, haha !
Vậy hả, tưởng bạn ở Buôn Ma Thuột chớ ^^
Haha, phải tự tin chứ bác. Đa phần bà con sẽ bảo là giao diện đơn điệu quá, không có gì. Bác là người đầu tiên khen nó khó đọc đấy. Em sẽ sớm bơi vào web của bác và quẩy thôi, mà web bác đổi giao diện chắc cũng 2 tháng rồi đấy nhỉ, ngày trước giao diện blog, hiện tại nó kiểu diễn đàn 😀
Haha, tự tin là tốt :D, có thời gian ghé blog mình chơi nhé.
Ồ ồ, trùng tên nhiều lắm bác, nhưng mà Tịnh Nguyễn, đẹp zai và chuẩn sói ca thì chỉ có 1 thôi bác nhé, đó chính là em :v
Ủa ủa, giao diện trang web khó đọc sao bác ? Em thấy cũng khá dễ đọc và điều hướng nội dung ấy chứ nhỉ ? 😀
Tại mình cũng có quen một bạn tên Tịnh trên BMT, mà lâu quá không gặp, tưởng blog của bạn đó, nhầm lẫn một chút ^^
Nhưng sao bạn không sửa giao diện trang web cho dễ nhìn hơn, thật sự hơi khó đọc.
Không bác, em ở Gia Lai, mà Tây Nguyên thế là gần rồi đấy bác, bạn bè trên Phây Bút của e toàn ở Sài Gòn với Hà Nội không à :v
Có vẻ như mình quen biết với chủ blog này nhỉ? Nhìn tên hơi quen 😀
Nếu bác ở Tây Nguyên thì bác thấy em quen là đúng rồi, haha ! Em ở Gia Lai mà :p