facebook sharer 使用詳解是本部落格的人氣文章
謝謝各位的支持
若各下新接觸facebook sharer(後稱sharer) 的話
您在跟著本文實作時或會遇到一些困難,
這時不妨先到上述連結了解一下sharer是怎樣運作
今天繼續說明如何設定sharer其他重要的屬性
og:description
設定方法為 <meta name="og:description" content="blar blar blar" />
sharer 會先看看html裡有沒有設這個meta
有:用這個meta 裡的content 屬性
沒有:在html 裡找第一個多於120字(不包括120)的 <p>
兩個都找不到的話, 那description就會設為空白
這就是為甚麼通常share 出去的description 怪怪的原因
og:image
設定方法為 <meta name="og:image" content="http://absolute.image.path"/>
可設多張, 多copy一次就可
圖的url一定要absolute path 而且是published url
聽起來好像好簡單，那你就錯了
不要相信debugger裡og:image的結果, 那是騙你的
用來參考倒是可以的, 一切要以真正sharer 的結果為準
用來參考倒是可以的, 一切要以真正sharer 的結果為準
長氣點說多次, 若遇上甚麼問題, 請參閱facebook sharer 使用詳解
這裡sharer 會這樣做:
先看HTML裡有沒有設og:image
有:圖片是否大過200x200? (不包括200)
是:sharer會用這個圖
否:sharer不會使用這圖片, 請繼續看下去
否: 忽略此圖片, 並找找網頁裡有哪些 *有夠大 的<img>,
如有: 放入thumbnail list 讓用家選擇
沒有: 這個分享不會顯示任何thumbnail
* : 夠大的定義目前還未測試出來, 總之是大圖片
其他由HTML extract出來的暫時都未太清楚甚麼size才會當做thumbnail,
簡單來說夠大的都會有機會
簡單來說夠大的都會有機會
測試所得, sharer會比較喜歡找放在開頭的圖
og:title
這個是最簡單最正常的屬性
設法為<meta name="og:title" content="bi li ba la"/>
sharer 會先看有沒有設og:title
有:用這個為title
沒有:
sharer會找<title>當title
若<title>都沒有的話就會直接把網址當成title
文章如能幫到各下的話, 請留個comment讓小弟知道
謝謝
沒有:
sharer會找<title>當title
若<title>都沒有的話就會直接把網址當成title
文章如能幫到各下的話, 請留個comment讓小弟知道
謝謝
