facebook分享自己網站影片語法

作者: fase 日期: 2013-11-12 09:53

字體大小: 小中大

在facebook上要分享自己網站的影片
需要在該網頁的<head></head>加上給facebook抓的meta標籤
如果只是連結作分享，只需要基本的meta標籤
如果需要直接在facebook播放的話
則需自帶播放器(這似乎是PC上才需要這樣)

在<head></head>裏給facebook抓的基本標籤
<meta property="og:site_name" content="xxx" />
<meta property="og:title" content="xxx" />
<meta property="og:description" content="xxx" />
<meta property="og:url" content="xxx" />

再來是類別
<meta property="og:type" content="video.movie" />

影片總要有一張圖片讓人點選播放
<meta property="og:image" content="http://xxx.xxx/xxx.jpg" />
<meta property="og:image:width" content="640" />
<meta property="og:image:height" content="360" />

影片的部分
<meta property="og:video" content="http://xxx.com/flowplayer.swf?config=%7b%27clip%27%3a%7b%27url%27%3a%27http%3a%2f%2fxxx.mp4%27%7d%7d" />
<meta property="og:video:secure_url" content="https://xxx.com/flowplayer.swf?config=%7b%27clip%27%3a%7b%27url%27%3a%27https%3a%2f%2fxxx.mp4%27%7d%7d" />
這2個項目是影片連結並自帶播放器，這2個項目差異是http和https
由於facebook都改用https，如果只給http，在facebook會無法播放
而我播放器部分是使用flowplayer，當然也可以用別的，但參數則看播放器了
flowplayer去下載後，只要將flowplayer.swf和flowplayer.controls.swf複製進來
config後面的參數要用url encode去編碼過
翻成白話為
{'clip':{'url':'http://xxx.mp4'}}

影片的其它部分
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:width" content="640" />
<meta property="og:video:height" content="360" />

以上部分完成後，其實在facebook上並不能播放
我搜尋到的網站都只寫到這樣
最後是從Youtube的網頁原始碼看到一個項目
加上去就可以了，我猜大概是facebook改變政策
導致之前的文章在那時是可以
但目前就不行了
只要加上
<meta property="fb:app_id" content="1111111111111111" />
這app_id是從facebook申請的
這部分請自行搜尋其它人的文章參考
我這邊就不再說明了