天矽部落格最新的網路趨勢資訊

部落格

網站嵌入YouTube影片無法播放?提供三大解決方案

部落格:網站嵌入YouTube影片無法播放?提供三大解決方案

 

近期在網頁設計專案中,工程團隊遇到客戶詢問「嵌入Youtube影片卻一片黑?」「嵌入影片無法自動播放」等,針對這幾個問題統整出幾點問答,提供給想在網站內嵌影片的你:

為什麼我的影片無法播放?

1. 可能是影片HTML代碼錯誤
於網頁加入Youtube影片時,需在編輯器內貼上Youtube提供的HTML代碼,先檢查無法顯示是否為代碼複製錯誤、代碼複製成影片連結等等。




※ 但貼影片連結就設定Youtube播放器,這功能還是能透過客製化後台達成喔!
天矽科技提供的客製化網站服務,除了編輯器擁有Youtube影片嵌入功能(下圖1),也能在頁面設計添加不同的影片顯示區塊(下圖2),自己決定影片版面,無論首頁、內頁、產品頁的影片介紹都可以漂亮排版。





2. 頻道影片限制嵌入
如果想要嵌入網站的影片,是來自別人的Youtube頻道,對方是有權限可以限制不讓網站嵌入影片的喔!如遇到這種狀況,無論怎麼調整數值,都是沒辦法顯示影片的。除非發訊息與對方聯繫,請對方授權才有機會,或建議換素材。

3. 觀賞權限問題
影片是自己的Youtube頻道素材,卻沒辦法顯示在網頁上播放,那麼可以檢查後台「影片權限」區域,影片權限設定為私人就無法播放,權限改為公開即可正常使用。
 

為什麼我的影片無法「自動」播放??

1. 瀏覽器阻擋
Chrome在2018年4月加入影片自動播放限制,也有許多瀏覽器跟進,iOS及Android系統也限制自動播放,所以在手機上是不會自動播放影片的。無論強制或是非強制,許多瀏覽器已提供相關功能,也是目前的趨勢。

2. 用戶自行設定
如上一點所述,眾家瀏覽器官方提供相關禁止功能,更延伸許多瀏覽器外掛插件加強相關功能,像是Disable HTML5 Autoplay、AutoplayStopper等,不只是影片音樂,連影片播放都會自動暫停。不過安裝外掛可能有風險,或產生網頁載入變慢等問題,在安裝前記得先查閱相關資訊。

3. 解決方法
拿最多人使用的Chrome瀏覽器來作為例子,在Google的Autoplay Policy Changes文內提到:



大概意思是,只要在嵌入影片時加入「靜音」參數,還是可以自動播放影音內容,想要音樂內容播放就要透過使用者點擊。也可透過YouTube IFrame Player API,嵌入Youtube影片時會有更多參數可設定,但自動播放影片也是有限制,一個頁面只能有一個影片自動播放,甚至有大小的限制,千萬別漏看規則。

以上有關網頁影片嵌入的小眉角你都記起來了嗎?

《延伸閱讀》
分享連結到社群後,資訊出不來怎麼辦?
Facebook messenger 如何嵌入網站呢?

回上一頁
聯絡我們
聯絡客服