跳到主要內容

(分享)(教學)如何在Blogger裡加入Flash mp3 播放器

你是不是也常看到其它Blogger裡有一個漂亮的Flash mp3播放器呢?過去大王也曾想過在Blog裡加上mp3播放器,不過一直沒有這樣玩,因為它得要把一些檔案放在自己的網路空間裡。此外,歌曲也必需存放在自己的空間裡。所以大王就沒有把它加到自己的Blog裡囉。不過這個Flashmp3Player已經發展到3.2版囉~可以透過xml來編輯自己的音樂清單,並且音樂曲目的連結可以用站外的檔案進行連結哦!這就又讓大王想在Blogger裡加上一個音樂播放器了,馬上來玩玩看囉^^。

step1.首先你必需下載這個Flashmp3播放器:[下載連結][作者Blog]

step2.打開playlist.xml開始編輯自己的播放清單囉~歌曲可以是在網路上的任何位置

2.jpg

歌曲的搜尋可以試試Tom.com音樂搜尋引擎囉~



step3.將mp3player.swf、ufo.js、playlist.xml,三個檔案上傳到自己的網頁空間。(ex.Yahoo、Hinet、Seednet...)
記得要將檔案的連結位置記下來囉,可以在檔名上按滑鼠右鍵複製捷徑。然後把它先存在你的記事本中囉~
三個檔案的位置都要記錄下來哦^^

1.jpg

step4.打開你blogger的樣版,把下面的語法加到<head></head>之間

<script type="text/javascript" src=" 在這中間把剛才上傳的ufo.js的網址貼上來,例如http://home.kimo.com.tw/kelvinwang1977/ufo.js"></script>

3.jpg

4.jpg

step5.接著把下面的語法加到<body></body>之間。

如果你用的也是blogger的空間,那麼就把它放在<!-- Begin #sidebar -->到</body>之前,找個喜歡的位置把它佈置進去囉。語法如下:

<embed FlashVars="file=在這中間把剛才上傳的playlist.xml的網址貼上來,例如http://homelf.kimo.com.tw/kelvinwang1977/playlist.xml&repeat=true&showdigits=false&displayheight=60&
lightcolor=0xcc0000&backcolor=0x000000&frontcolor=0xFFFFFF&autoscroll=true&autostart=true"
"width="160"height="210"
src="在這中間把剛才上傳的mp3player.swf的網址貼上來,例如http://homelf.kimo.com.tw/kelvinwang1977/mp3player.swf"type="application/x-shockwave-flash"></embed>

5.jpg

這樣就搞定囉~~試試看吧^^ 

留言

  1. 這樣會不會有侵權的問題...
    這是我一直很擔心的事情..

    回覆刪除
  2. 我覺得這個播放器本身是沒有問題的,但上傳歌曲的朋友就要小心點了。大王有串一些mp3是在TOM.com找的,應該都是可以合法試聽的。例如.周杰倫的歌曲中還有他對專輯的廣告。應該是ok的吧~~但如果是存心去散佈讓其它人下載非法的音樂那當然就直接地侵權囉^^

    回覆刪除
  3. 如果我是用新版的Blogger的範本話,要怎麼加?

    回覆刪除
  4. ^^其實自從大王分享了另一種懶人的做法之後,就不太建議用自己DIY的方式來加入Flashmp3player囉~因為又得要自己找個空間來放swf檔,還得要定期更新xml並且把它「上傳」到你的網頁空間裡。
    這樣是比較麻煩的,你可以試試看大王的另一篇推薦文章「(分享)(網站)在Blogger中加入flashmp3player懶人法!」,用人家網站的服務來完成這個功能的加入。
    這樣就「更簡單」了!!

    回覆刪除
  5. 哈哈 謝謝您了.不過經過一番研究後.已經成功了.
    主要是因為用Faslh也可做images,medias...etc 自主權會比較高.

    回覆刪除
  6. 恩~~是啦~~
    大王之前一開始也是這樣想的,所以也用DIY的方式做了一次。後來實在覺得很懶~每次更新了曲目後就要把修改過的XML檔再上傳一次,所以就改成「懶人法」來做囉^^

    回覆刪除
  7. 那麼別人也會看到我的PLAYER嗎?

    回覆刪除

張貼留言

這個網誌中的熱門文章

KHS T3 前貨架安裝~

今天台北下雨,所以大王就在家把上週入手的前、後貨架裝上車囉。一開始還不知該從何下手說,也爬了一下文,確定大家都是怎麼安裝後才下手的。也整理一下大王的安裝方法,提供給大家參考囉。不過安裝的過程沒拍照,只好裝安後的樣子說明一下。 前架的左、右支架跟前剎共用機構。別怕,大膽地將固定V夾的螺絲拆下來,然後換上前架附的「比較長一點」的螺絲將貨架鎖緊。注意:別緊到連V夾都被鎖死了,因為大王一開始沒注意鎖太緊,以致V夾連動都不能動,前剎皮就一直磨到輪框。 右邊也是一樣與V夾共用機構 然後將中架用長螺絲、螺帽鎖緊 中架的螺絲、螺帽就在魔鬼沾的那個位置,一樣也是把它鎖緊 這樣就大功告成囉。 眼尖的你大概看到大王將攜車袋綁在前架上了,沒錯就是用魔鬼沾綁在這裡。L型的另一邊大王是用束線帶綁在前架上囉。這樣下面、靠車架那一側就都勞勞綁住了,讚!!

(分享)(投影片)20060926Web2.0國際研討會~投影片分享~

Web2.0 國際研討會(International Conference)一連2天在台北國際會議中心舉行,大王當然也沒錯過這場盛會~~。下面先分享大王整理的投影片資料: (點選連結前請在「 回應 」中簽個到吧~^^讓大王知道一下有多少人看過這些分享資料囉~) Web2.0國際研討會-01-TechCrunch Web2.0國際研討會-02-Flickr Web2.0國際研討會-03-salesforce.com Web2.0國際研討會-04-HeyMath Web2.0國際研討會-05-Bubbleshare Web2.0國際研討會-06-Panel Discussion Web2.0國際研討會-07-麥實創投 Web2.0國際研討會-08-智碁創投 Web2.0國際研討會-09-PChome Online Web2.0國際研討會-10-Yahoo! Web2.0國際研討會-11-無名小站 Web2.0國際研討會-12-愛情公寓 Web2.0國際研討會-13-HemiDemi Web2.0國際研討會-14-IBM Web2.0國際研討會-15-Microsoft Web2.0國際研討會-16-Panel discussion

(推薦)提姆網!最便捷的網路道覽網站!

今天大王在佳文媽媽的大力推薦下到訪「 提姆網 」。TimLiao提姆網( www.timliao.com )成立於2003年五月,創辦人與網站製作皆為Tim Liao廖庭毅。網站創立的目的在 提供所有上網用戶最便捷的網路導覽網站 ,讓用戶在最短的時間內,用最便捷的方式收尋到想要的連結站。網站目前收集了台灣 3000多個大站連結 ,都是經過仔細篩選而來。此站的最大特色在於快速收尋連結站,在首頁將滑鼠移動到各式分類底下,連結就會一一顯示,不用一頁一頁的收尋,可節省用戶不少的時間。網站提供了日常生活所必備的即時資訊,讓用戶掌握最新消息。其他像是網站中的 24小時台灣免費線上電台電視 ,讓居住在國外的朋友也能即時收聽到台灣最新消息。真是個值得推薦瀏覽的網站!