網站嵌入YouTube影片無法播放?提供三大解決方案 - 天矽科技
文章推薦指數: 80 %
大概意思是,只要在嵌入影片時加入「靜音」參數,還是可以自動播放影音內容,想要音樂內容播放就要透過使用者點擊。
也可透過YouTube IFrame Player API,嵌入Youtube ...
天矽部落格最新的網路趨勢資訊
網站設計趨勢
All
客製化網頁設計
RWD網頁設計
上市上櫃詳細說
網路趨勢
資源分享
網站建置與SEO
數位轉型案例分享
天矽科技專欄
網站嵌入YouTube影片無法播放?提供三大解決方案
近期在網頁設計專案中,工程團隊遇到客戶詢問「嵌入Youtube影片卻一片黑?」「嵌入影片無法自動播放」等,針對這幾個問題統整出幾點問答,提供給想在網站內嵌影片的你:
為什麼我的影片無法播放?
1.可能是影片HTML代碼錯誤
於網頁加入Youtube影片時,需在編輯器內貼上Youtube提供的HTML代碼,先檢查無法顯示是否為代碼複製錯誤、代碼複製成影片連結等等。
※但貼影片連結就設定Youtube播放器,這功能還是能透過客製化後台達成喔!
天矽科技提供的客製化網站服務,除了編輯器擁有Youtube影片嵌入功能(下圖1),也能在頁面設計添加不同的影片顯示區塊(下圖2),自己決定影片版面,無論首頁、內頁、產品頁的影片介紹都可以漂亮排版。
2.頻道影片限制嵌入
如果想要嵌入網站的影片,是來自別人的Youtube頻道,對方是有權限可以限制不讓網站嵌入影片的喔!如遇到這種狀況,無論怎麼調整數值,都是沒辦法顯示影片的。
除非發訊息與對方聯繫,請對方授權才有機會,或建議換素材。
3.觀賞權限問題
影片是自己的Youtube頻道素材,卻沒辦法顯示在網頁上播放,那麼可以檢查後台「影片權限」區域,影片權限設定為私人就無法播放,權限改為公開即可正常使用。
為什麼我的影片無法「自動」播放??
1.瀏覽器阻擋
Chrome在2018年4月加入影片自動播放限制,也有許多瀏覽器跟進,iOS及Android系統也限制自動播放,所以在手機上是不會自動播放影片的。
無論強制或是非強制,許多瀏覽器已提供相關功能,也是目前的趨勢。
2.用戶自行設定
如上一點所述,眾家瀏覽器官方提供相關禁止功能,更延伸許多瀏覽器外掛插件加強相關功能,像是DisableHTML5Autoplay、AutoplayStopper等,不只是影片音樂,連影片播放都會自動暫停。
不過安裝外掛可能有風險,或產生網頁載入變慢等問題,在安裝前記得先查閱相關資訊。
3.解決方法
拿最多人使用的Chrome瀏覽器來作為例子,在Google的AutoplayPolicyChanges文內提到:
大概意思是,只要在嵌入影片時加入「靜音」參數,還是可以自動播放影音內容,想要音樂內容播放就要透過使用者點擊。
也可透過YouTubeIFramePlayerAPI,嵌入Youtube影片時會有更多參數可設定,但自動播放影片也是有限制,一個頁面只能有一個影片自動播放,甚至有大小的限制,千萬別漏看規則。
以上有關網頁影片嵌入的小眉角你都記起來了嗎?
《延伸閱讀》
分享連結到社群後,資訊出不來怎麼辦?
Facebookmessenger如何嵌入網站呢?
回上一頁
Share
文章標籤
API
Google
Youtube
影音
更多網路趨勢文章
圖片格式WebP是什麼?圖檔降45%、提高網頁速度|天矽科技客製化網頁設計
語法href是什麼?href基礎應用與解說|天矽科技客製化網頁設計
API是什麼?淺談API概念與運用案例|天矽科技客製化網頁設計
信箱
客服
Line@
延伸文章資訊
- 1Youtube Iframe API 常用功能- Google - Let's Write
Youtube 的影片我們可以用API 來知道目前是:準備好的、初次載入的、播放的、暫停的、播完的、緩衝中,這六種狀態。
- 2如何嵌入YouTube 影片到網站或部落格(含自動播放和重播)
而YouTube 也提供很方便的方式,只要複製貼上HTML 代碼就能完成嵌入YouTube 影片,另外也提供很多進階的設定,只要在嵌入影片網址加上簡單的參數,就 ...
- 3YouTube Embedded Players and Player Parameters - Google ...
The <iframe> tag below would load a 640x360px player that would play the YouTube video M7lc1UVf-V...
- 4video - Youtube iFrame API参数 - IT工具网
原文 标签 video iframe youtube youtube-api embed ... 要隐藏视频名称,请使用 showinfo=0 参数。最后,要自动隐藏控件是 autohide=1...
- 5嵌入影片與播放清單- YouTube說明
在電腦上前往要嵌入的YouTube 影片或播放清單頁面。 · 按一下「分享」圖示 · 按一下「分享」選項清單中的[嵌入]。 · 複製方塊中的HTML 程式碼。 · 將程式碼貼到網站的HTML 中。