2013-11-09 101 views
0

我在網頁上有一個Facebook Like/Share按鈕。當您點擊分享按鈕時,會彈出一個窗口,讓您分享有關該網站的消息。彈出窗口中還有一張照片,它來自按鈕所在的網頁。你可以在Facebook分享按鈕彈出窗口中更改照片嗎?

問題是,網頁顯示的是合成照片,圖像位於另一張圖像的頂部,而不是顯示整個合成圖像,彈出窗口會顯示其中的一部分。

有沒有辦法在Facebook的彈出窗口中完全使用不同的圖片,某些特定的圖片不存在於網頁上?我曾經認爲og:image meta標籤可以做到這一點,但它似乎不起作用。

謝謝。 馬克

回答

1

明白了。我的問題是,我需要從Facebook開發者頁面獲得的信息不完整,或者沒有以我能理解的方式呈現。因此,爲他人在我的船好處:

  1. 這是不夠的,加贊/共享按鈕JavaScript代碼和div標籤(在您想要的按鈕來顯示)。您還需要在html頁面的<head>部分添加一組元標記。 (請注意,在Facebook開發人員的「Like Tag」頁面中,不會出現短語「元標記」。)元標記格式爲:<meta property="og:type" content="website">

  2. 添加這些元標記和Facebook之間顯然存在延遲找到他們。有人說這是因爲Facebook緩存內容的方式。無論如何,你可以通過使用Facebook調試器來繞過這個延遲https://developers.facebook.com/tools/debug/你用按鈕輸入頁面的URL,它告訴你代碼中缺少的東西 - 同時它現在可以識別任何新的增加,比如新的元標記。

  3. 原來,我需要meta標籤的og:url,og:title,og:image,og:site_name,og:type和og:description。我還發現,og:image標籤需要一個絕對url。

  4. 我發現了未從Facebook,但在這裏有很多這樣的:http://davidwalsh.name/facebook-meta-tags

  5. 調試器現在告訴我,我還需要FB:管理員和FB:APP_ID標籤。爲了讓那些我顯然必須創建一個Facebook應用程序,我寧願不做。我希望這不是必要的。

現在我已經添加了這些元標記並通過調試器運行我的頁面,現在我正在獲取要在共享窗口中顯示的圖像。

相關問題