[教學] 如何在網站上嵌入 Facebook 影片?

影片上傳嵌入到網站的服務不再是YouTube獨享,Facebook現在也有提供將Facebook影片嵌入到部落格、網站、BloggerWordPress痞客邦等網站,選擇嵌入影片到Facebook時,會提供一大串的語法,通常是貼上去就好了。但現在因為大家網站都使用太多的Facebook元素,結果導致他語法貼到部落格或網站時,居然無法顯示?現在就讓我們來解決這樣的FB嵌入影片問題。

Facebook 影片要嵌入之前,請先上傳到Facebook,不過我個人還是覺得上傳到YouTube再嵌入比較好,因為YouTube的機制上比較完善,再來則是YouTube他還可以搭配觀賞影片賺錢的服務,讓分享者也可以獲得廣告營收,何樂而不為?不過有些人嵌入FB影片可能是廠商要求或者是想分享的影片就只有在Facebook上有,所以只好這樣了。

說到Facebook影片,還記得之前有介紹過「Facebook Video Downloader Pro」、「如何下載 Facebook 影片?(FB抓影片免軟體)」、「Facebook、Youtube下載工具:Free Video Downloader」等抓FB影片服務嗎?如果你本身影片分享到FB,但是想要透過YouTube賺錢,那趕快透過以上方式將影片抓下來,重新上傳到YouTube分享賺錢吧!

一、Facebook 影片嵌入:黑背景預覽版

第1步  首先找到你想要嵌入的影片。如果是在這樣的黑背景視窗、Lightbox視窗,請點選FB影片下方的【選項】→【嵌入影片】。

[教學] 如何在網站上嵌入 Facebook 影片?

第2步  接著會跳出「在外部網頁嵌入此影片」的視窗,請複製語法並貼到要顯示的網站即可。

[教學] 如何在網站上嵌入 Facebook 影片?

二、Facebook影片嵌入:一般網頁版

第1步  如果開到的Facebook 影片是這樣類型的,請點選右側「嵌入影片」。

[教學] 如何在網站上嵌入 Facebook 影片?

第2步  複製影片語法貼上即可。

[教學] 如何在網站上嵌入 Facebook 影片?

 

三、無法張貼Facebook影片在WordPress網站?解決方法!

可能有些使用者在張貼Facebook影片至WordPress網站時,可能會發現影片無法張貼,那可能造成得原因是版型已經有Facebook的一段引用代碼,或者是網站上已經有加裝Facebook外掛,可能因為語法和語法衝突,造成無法加入,因此我們要換個方式來嵌入影片。

第1步  一般預覽「在外部網頁嵌入此影片」的視窗中,後方有一個「了解更多」請點擊。

[教學] 如何在網站上嵌入 Facebook 影片?

第2步  接著,請複製要嵌入的FB影片之網頁網址。

[教學] 如何在網站上嵌入 Facebook 影片?

第3步  剛剛點「了解更多」會來到此畫面,請在上方【URL of video】輸入影片網址,右側【The pixel width of the video】則是影片寬度,預設500。輸入完畢確認下方出現影片預覽後,點選﹝Get Code﹞。

[教學] 如何在網站上嵌入 Facebook 影片?

第4步  接著會出現兩段語法,如果是WordPress用戶而且已經遇到一般的FB影片語法貼上無法呈現者,請直接複製下方「語法2」貼到你要顯示的文章中。

[教學] 如何在網站上嵌入 Facebook 影片?

第5步  貼上之前,請先將編輯器切換到「文字」模式,再把語法貼上。貼上後可以點選右上角﹝預覽﹞看看是否張貼成功?

[教學] 如何在網站上嵌入 Facebook 影片?

第6步  完成,張貼成功!

[教學] 如何在網站上嵌入 Facebook 影片?

在Google News上追蹤我們最新文章
香腸
香腸

喜歡在網路上透過文字與圖片分文章教學,默默地用鍵盤烤了9年的香腸。另外還身兼阿腸接案餬口飯吃。對了,別叫我阿腸,請叫我香腸,這樣我才知道你看我部落格長大的。

文章: 1781

9 則留言

  1. 不好意思我想請問,我這樣放在PC的web上觀看是有成功的,但是轉到mobile的web影片就出不來了,不曉得大大有沒有遇過這個問題呢!?

    • 我早上改了一下,發現好像是我之前為了要讓某個Category裡的文章在被分享到FB的時候可以是特殊的內容,所以有寫了FB的meta,結果因為只有針對那個Category去設定,所以在其他Category裡的文章meta content就都是空白,好像是因為這個導致在mobile上那個影片會出不來,但是我還是不曉得為什麼這兩者之間有什麼關聯~”~

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料