YouTube embedded

 

其實 YouTube 早就把程式語法準備好讓大家盡情的分享, 如下圖, 不論你是要用 url 分享, 要分享到社群軟體, 還是想要用嵌入 (embed) 的方式放進網頁裡都不是問題…

youtube-share-link

還記得很多年前部落格開始流行內鍵音樂, 想要藉由自己喜歡的音樂讓讀者更能融入情境… 但, 由於諸多的不方便, 不想要在瀏覽網頁時被嚇到, 現在大家一般都不這麼做了… 如果有音樂還會特別提醒讀者…

所以, 同樣的道理, 為了增加吸睛度, 當大家嘗試在讀取網頁的同時自動播放影片, 就有可能會犯了上一代的錯誤… 你當然可以選擇讓他顯示縮圖就好 (現在 YouTube 內鍵的程式就是這種效果), 但是, 以效果來說, 好像還是自動播放比較容易引起興趣囉~!!

所以, 我的功課就來了… 想要在側欄自動播放茉莉的影片, 卻又不想嚇到大家, 該怎麼做呢? 非專業資工人, 小桃來交作業了!! 下面是直接嵌入語法達到效果,

想直接看效果? [WordPresss 筆記 DEMO] 嵌入 YouTube 影片/清單, 設定自動播放並靜音!

PS1. 目前只適用於電腦工作者, 手機/平板等全部都只能顯示縮圖無法自動播放喔~!!

PS2. 也可以使用外掛來達到效果喔! YouTube Channel 介紹詳見: [WordPress 外掛] YouTube Channel , 一支可以自動且靜音播放影片的外掛~!!

Note:
  • 下面分為兩部分, A 部分是只有嵌入單一影片, B 部分則是針對播份清單 (Playlist)!
  • video ID, 可以在影片網址中找到, v= 後面那一串就是 vedio ID, 在複製語法的時候記得要換成你自己的 vedio ID 喔 (ex: https://www.youtube.com/watch?v=zzBpnVQ_5ME, vedio ID 就是 zzBpnVQ_5ME)
  • playlist ID, 也可以在播放清單網址中找到, list= 後面那一串就是 playlist ID, 在複製語法的時候記得要換成你自己的 playlist ID 喔 (ex: https://www.youtube.com/playlist?list=PLA4MkHD2KfXkuYVnLoVitdgaPYpBdywfF, playlist ID 就是 PLA4MkHD2KfXkuYVnLoVitdgaPYpBdywfF)
  • 自動, 循環播放的參數是 autolay & loop!
  • 影片尺寸都可以自己設成喜歡的寬度/高度… 如果寬度太窄控制列有些按鈕繪無法顯示喔~!!

廢話很多的正文開始… 以下適用於單一影片喔~!!

A-1. 影片顯示縮圖不自動播放

YouTube 語法直接嵌入, 就是只顯示縮圖, 但不會自動播放喔~!!

youtube-embeded-thumbsnail

 

A-2. 影片自動 & 循環播放

稍微修改並增加了自動播放的參數, 現在當讀入網頁, 影片就會自動 & 循環播放了, 但很可惜還是無法靜音~!!

PS. Video ID 要填兩次喔~!!

youtube-embeded-autoplay

 

A-3. 影片自動, 循環播放 & 靜音!!!

靜音這看起來很簡單的設定, 果然還是要求助 YouTube API 啊~!!! 也謝謝 Google 這麼大方提供了這麼多參數讓我們自己調控啦~!! 以下語法參考: digital inspiration!

youtube-embeded-autoplay-mute

我的天哪我的天哪, 你有看到左下角的靜音嗎?!!!! 真是太感人了, Yoohoo~!!

單一影片的部分總算是找到最佳解了, 那麼清單的部分呢?

 

B-1. 清單顯示縮圖不自動播放

YouTube 語法直接嵌入, 一樣就是只顯示縮圖, 但不會自動播放喔~!! 影片左上角那個圖示就是清單的意思喔, 總共有 37 支影片, 現在播放第一支的意思~!!

youtube-embeded-thumbsnail

 

B-2. 清單自動 & 循環播

稍微修改並增加了自動播放的參數, 現在當讀入網頁, 影片清單就會自動 & 循環播放了, 但很可惜還是無法靜音~!!

youtube-playlist-embeded-autoplay

哈, 所以依照我的訴求: Playlist + Autoplay + Mute 可能還是得求助外掛了~!! 如果大家有更好的解法也歡迎提供給我, 救救不專業但很認真的小桃啦~!!

為了解決這個問題, 幫大家覓得了一支還不錯的外掛 – YouTube Channel, 推薦給大家~!! 介紹文詳見: [WordPress 外掛] YouTube Channel , 一支可以自動且靜音播放清單的外掛~!!

PS. 想直接看上述影片效果, 詳見: [WordPresss 筆記 DEMO] 嵌入 YouTube 影片/清單, 設定自動播放並靜音!

–> 更多 WordPress 筆記詳見: ♥ Blogging ♥

 

現居德州, 致力於在平凡的生活中尋找不平凡, 在忙碌的生活中尋找只屬於我們的小幸福... 旅行。美食。生活。牽著手的三人行... 若無特別聲明, 本站所有文章皆為作者原創, 欲轉載請註明作者 & 文章出處, 請尊重智慧財產權, 謝謝~!!