• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

免費資源網路社群

免費資源指南,每日網路資訊與科技新知

  • 免費軟體
    • APP
      • iOS
      • Android
    • Mac
    • 瀏覽器外掛
      • Chrome
      • Firefox
    • 防毒軟體
    • 系統工具
    • 圖片處理
    • 文字編輯
  • 線上工具
    • 雲端掃毒
    • 線上翻譯
    • 線上轉檔
    • 配色工具
    • 縮網址
    • 產生器
  • 免費空間
    • 網路硬碟
    • 圖片空間
    • 影片空間
    • 網站空間
  • 熱門主題
    • Facebook
    • VPN
    • YouTube
    • 編輯精選
    • 字型下載
    • 免費圖庫
  • 網路科技
    • 個人服務
    • 電子信箱
    • 實用教學
    • 資料查詢
    • 音樂音效
  • 架站教學
    • DNS
    • WordPress
    • 搜尋引擎最佳化
    • 素材模版
    • 免費圖示
    • 網站監測

PodSnack 線上製作 HTML5 音樂播放器,把喜愛的音樂分享到 Facebook

Last updated 7 years ago by Pseric

2013 06 10 1138

PodSnack 是一款音樂播放器製作工具,能讓你把自己喜愛的音樂在線上製作成播放器,只需要簡單三步驟:加入歌曲、自訂播放器,然後產生分享鏈結,也可以透過原始碼把播放器內嵌到你的網站、社交網路或是下載回電腦裡。

PodSnack 提供的播放器樣式很多,有能顯示歌曲名稱和歌手的一般播放器,也有類似於蘋果 iTunes Cover Flow 將音樂封面都排列起來的,或者你不想要佔用太多版面,非常精簡的播放器樣式等等。支援的音樂來源包括從電腦上傳(需要升級為 Premium)、從 YouTube 選曲、連結到 Dropbox 和線上錄音四種。

這項服務的免費版會有一些限制,例如播放器裡有歌曲數量和長度限制,也會加上浮水印等等,有些功能也需要付費才能開啟,如果你真的覺得 PodSnack 很好用,那也可以考慮付費來升級 Premium ,它是以點數來計算,升級一個播放清單需要 8 Points ,大約 $10 美元左右。

網站名稱:PodSnack
網站鏈結:http://www.podsnack.com/ (推薦鏈結)
範例網址:http://snack.to/atmfwj9k

在 PodSnack 建立播放清單

開啟 PodSnack 網站後,點擊首頁的 Build a Playlist 按鈕來建立新的播放器。

2013 06 10 1149

接著會來到登入帳戶的提示畫面,如果你之前有使用過 FileSnack 的話,他們是出自同一家公司,可以直接以原本的帳戶登入。

2013 06 10 1140

設定一下要使用的播放清單名稱,然後從底下加入曲目,除了從電腦上傳音樂需要付費才能使用以外,其他的功能應該都不需要。推薦直接從 YouTube 搜尋,然後把喜歡的音樂加進來 PodSnack 播放清單。

2013 06 10 1152

使用方法真的很簡單,輸入要搜尋的關鍵字,然後點擊搜尋結果後方的 + 號,即可把該音樂加入你的播放清單。完成後按右上角的 Next 跳到下一個步驟。

2013 06 10 1153

第二步驟是選擇要使用的播放器樣式,從上面那排樣式中選取,下面的 Preview 預覽會出現播放器套用在你播放清單的樣子。

2013 06 10 1156

可以調整的選項很多,包括寬度、高度、尺寸、播放模式、音量以及配色等等。

2013 06 10 1159

類似於 Cover Flow 樣式的播放器相當有特色。

2013 06 10 1157

或者是這種只有一條播放器的簡潔感也是我很喜歡的樣式。

2013 06 10 1158

選好播放器的樣式後按下 Finish,就會看到播放清單的分享鏈結,可以在這裡快速分想到自己的 Facebook 塗鴉牆、Twitter 或是以 Email 寄給好友,此外右邊的 Embed 可以產生內嵌到網站裡的原始碼。

2013 06 10 1200

往後可以從 My PodSnack 來編輯你建立的播放清單,或是重新取得分享鏈結和原始碼。PodSnack 會顯示每個播放器的使用狀態,以圖表方式呈現。

2013 06 10 1203

本文使用推薦鏈結,如不想這麼做,可以直接連結:http://www.podsnack.com/ 。

分享文章

  • 按一下以分享至 Facebook(在新視窗中開啟)
  • 分享到 Twitter(在新視窗中開啟)
  • 分享到 LinkedIn(在新視窗中開啟)
  • 分享到 Pinterest(在新視窗中開啟)

分類: 產生器類標籤: Dropbox, YouTube, 內嵌, 播放器, 播放清單, 產生器, 網誌工具, 網誌物件, 線上工具, 音樂分享, 音樂播放, 音樂播放器

關於 Pseric

學生時代成立網站以來堅持每日更新,在挖掘資料的過程中慢慢找出自己經營網站的方法,最開心的是有一群一起長大的讀者。

Primary Sidebar

使用電子郵件訂閱網站

輸入你的電子郵件地址訂閱網站新文章,使用電子郵件接收通知。

站內搜尋

追蹤更新

最新文章

  • Uppbeat 提供影片創作者免費音樂素材,每月 10 次下載需標示出處
  • 使用 Mac 內建「系統移轉輔助程式」快速將資料移轉到新電腦
  • No More WhatsApp 提供更直覺的 WhatsApp 對話記錄備份瀏覽工具
  • 將 Telegram 介紹語言設定為繁體中文,手機或電腦版適用
  • 在 M1 版 Mac 安裝 iPhone、iPad 應用程式,使用 iMazing 匯出 IPA 檔案
  • PDF Unshare 免費 PDF 版權保護軟體,可設定文件失效日限單一裝置開啟
  • 無難度!Crello 線上自製超專業平面素材,每月五張免費額度下載
  • Mock Magic 為擷圖畫面加上外框,支援 iPhone、MacBook 等裝置模型

精選主題

  • 思源黑體:Adobe 與 Google 合作開發開放原始碼中文字型
  • 思源宋體 Noto Serif CJK 字型免費下載!Google、Adobe 再次攜手推出開放原始碼字體
  • Apple Music 登陸台灣!免費三個月試用音樂串流服務,不聽音樂要幹嘛?
  • [下載] WinRAR 解壓縮軟體正式推出中文免費版,別再用盜版破解版了!
  • Mipony 白馬下載器:網路下載必裝!支援數百免空可突破下載限制
  • Outline 來自 Google 全自動自架 VPN 安裝工具,突破中國網路封鎖限制
  • Spotify 免費聆聽 4000 萬首歌,音樂串流應用 iOS、Android 版下載
  • Peggo 終止服務!5 個 YouTube 轉檔下載替代方案推薦
  • 日本亞馬遜 AmazonGlobal 線上購物直送台灣,免消費稅免找代購
  • 中華郵政 i郵箱初體驗,24 小時自助郵局寄件取件超方便
  • YouTube Music 免費音樂串流服務正式登場,升級 Premium 零廣告體驗
  • Microsoft Edge 正式版免費下載!以 Chromium 重新打造微軟瀏覽器
  • 使用 eMask 線上預購口罩,健保卡或自然人憑證驗證可信用卡繳費
  • 口罩實名制 2.0 健保卡身分認證教學,以健保快易通 APP 線上預約口罩
  • Photopea 免費圖片編輯器,堪稱 Photoshop 線上版支援 PSD 等常見格式
  • 財政部統一發票兌獎 APP 掃描發票存手機,自動記帳主動對獎超方便
  • 使用健保卡+戶號線上查詢勞保勞退年資、應繳欠繳保費和退休金核發試算
  • 跨平台 Brave 瀏覽器免費下載!兼具速度與隱私相容 Chrome 擴充功能
  • YouTube Kids 兒童專用影音頻道,手機平板應用程式免費下載

贊助商連結

實用教學

  • 46個免費圖庫網站總彙整
  • 15個免費下載高解析度圖片最佳圖庫
  • 下載高畫質相片素材的13個免費圖庫資源精選
  • 12個你應該知道的中英文假字、文章產生器
  • 20個免費下載創用 CC 授權音樂的網站彙整
  • 40個設計師必備免費資源超推懶人包
  • Google 商家被留負評該檢舉刪除?或許業主更該做的是回應疑慮
  • Facebook 全新下載資料副本功能,一次備份所有臉書記錄匯出
  • Instagram 資料下載讓使用者完整備份相片影片、留言、訊息等個人記錄
  • 7 個線上接收手機簡訊驗證碼的免費網路服務整理
  • 如何重灌 Mac 電腦?重新安裝 macOS 自動更新為最新版本教學
  • PayPal 兩步驟驗證設定教學,以手機簡訊或應用程式降低被盜用風險
  • 以 YubiKey 實體安全金鑰設定 Google 兩步驟驗證教學

WordPress 架站資源

  • 搬家自架 WordPress 推薦的五個虛擬主機服務
  • 架站更上一層樓,我推薦的五個虛擬專屬主機(VPS)服務
  • WordPress Hosting 架站空間精選,最多人推薦的五個國外虛擬主機方案
  • 如何挑選一個適合你的虛擬主機服務?我參考的七個比較項目
  • 自架 WordPress 虛擬主機租用教學,將網誌備份匯出、匯入到新家
  • 在 WordPress 設定 HTTPS,強制使用 SSL 安全加密協定教學
  • 殺手級 WordPress 體檢項目:101 個建立新網站的超簡易捷徑!
  • Cloudflare 架站者必備免費 CDN、DNS 託管服務設定教學
  • 台灣用戶也能在 Google Domains 註冊購買網域名稱,詳細申請設定教學
  • 16 個免費網站速度測試工具推薦!網頁效能評比,搜尋引擎最佳化必備
  • 亞馬遜 VPS 服務 Amazon Lightsail 搭配 ServerPilot 快速架設 WordPress 教學
  • 165 個 WordPress 官方開發佈景主題設計 Jetpack 使用者免費下載
  • 使用 Google Cloud Platform 雲端主機免費版架設 WordPress 教學
  • 使用 Cloudways 架設 WordPress 網站教學,快速部屬最佳化環境
  • RunCloud 佈署最佳化主機環境,整合 DigitalOcean 架設 WordPress 教學
  • 使用 SiteGround 虛擬主機一鍵快速安裝 WordPress 教學
  • Cloudflare 變身域名註冊商,以最低價續費含免費 SSL、WHOIS 隱藏功能
  • FastComet 評價極高的虛擬主機推薦,一鍵安裝 WordPress 教學
  • VaultPress 完整備份你的 WordPress 網站,無痛搬家或回復特定時間點

贊助商連結

Managed WordPress Hosting
We Love Jetpack!
Stock Photos, Vectors and Royalty Free Images from 123RF

使用 WordPress 建置,最高級的語意化個人出版平台・關於本站・文章彙整・隱私權政策