如何在網頁中插入自動播放的音樂？使用於任何網頁

來自專欄 LY客棧

網站功能不用太多，自己需要的就好了，自己的博客慢慢的完善，一個一個功能的增加，都是自己需要而且實用的，自己動手才會珍惜！

這音樂的功能很簡單，一段代碼而已：

<audio controls autoplay="autoplay" loop="loop"><source src="test.mp3" type="audio/mpeg" /> 如果不播放，說明你的瀏覽器不支持！</audio>

加上去之後會有這麼一個播放器顯示

相信誰都能理解，但是幾點注意，我後面為什麼還要多加一個「loop」？這不是和「autoplay」重複了么？

是的，重複，但是不矛盾，我自己的網站如果不加「loop」，是不會自動播放的。

為了美觀我還會加上hidden，隱藏播放器，達到點進去網頁就播放

只有很少數而特殊的網頁我才會用上音樂！

接下來就把代碼寫到模板頁面，然後後台編輯文章頁面添加一個文本框，進行方便輸入音樂地址。

這樣就很方便的在添加文章的時候隨意了，當然要在特殊的模板中，不然的話，每一個頁面都要載入一個播放器，不是讓網站變的很臃腫么？所以複製新建一個模板頁面，在需要添加音樂的時候就選擇那個模板頁面就好了！

改版完成，我只在「生活日記」欄目添加了音樂功能，模版的代碼改成：

<audio controls autoplay="autoplay" loop="loop" stylex="display:none;"><source src="{dede:field.shorttitle/}" type="audio/mpeg" /> 如果不播放，說明你的瀏覽器不支持！</audio>

需要注意的是要在欄目哪裡修改文章內容模板！

推薦閱讀：