2015-08-20 45 views
0

如何在我的網站上添加縮略圖,以便用戶分享到Twitter或Facebook的鏈接時,它會顯示HTML和Javascript中圖像的鏈接? 所以我真正想要的是,當用戶在任何社交媒體上共享我的網站的鏈接時,縮略圖圖像就會出現在旁邊。如何向我的網站添加縮略圖,以便在Twitter或Facebook上有人分享鏈接時顯示圖像和鏈接?

我已經把下面我想要的一個鏈接。

https://twitter.com/Medium/status/634152899132592128

+0

顯示你的代碼到目前爲止你已經嘗試過了嗎? –

+0

對不起,我不知道從哪裏開始。 – Ahan

回答

1

這些被稱爲微博卡,基本上,你添加<meta>標籤到你的網頁告訴Twitter什麼顯示在他們身上。

我認爲你正在尋找卡的類型是這個: https://dev.twitter.com/cards/types/summary-large-image

這裏是一個例子片段它如何工作(從文檔拍攝):

<meta name="twitter:card" content="summary_large_image"> 
<meta name="twitter:site" content="@nytimes"> 
<meta name="twitter:creator" content="@SarahMaslinNir"> 
<meta name="twitter:title" content="Parade of Fans for Houston’s Funeral"> 
<meta name="twitter:description" content="NEWARK - The guest list and parade of limousines with celebrities emerging from them seemed more suited to a red carpet event in Hollywood or New York than than a gritty stretch of Sussex Avenue near the former site of the James M. Baxter Terrace public housing project here."> 
<meta name="twitter:image" content="http://graphics8.nytimes.com/images/2012/02/19/us/19whitney-span/19whitney-span-articleLarge.jpg"> 

他們甚至爲您提供的服務來驗證和預覽卡:
https://cards-dev.twitter.com/validator


對於Facebook而言,<meta>標籤是不同的,也很好這裏記載: https://developers.facebook.com/docs/sharing/best-practices#tags

由於與Twitter,它們還提供了一個頁面,您可以驗證並預覽: https://developers.facebook.com/tools/debug/

希望幫助!

+0

它說「警告:未列入白名單」。我該如何解決? – Ahan

+0

@ user3675276看起來像視頻需要在工作之前加入白名單。這應該有助於您獲得批准:https://dev.twitter.com/cards/troubleshooting#approval – vitorbal

0

Facebook將尋找

<meta property="og:image" content="http://weekendtrails.com/screenshot.png" /> 

U可以使用這個元標記爲Facebook。我希望它可以與其他網站一起工作

相關問題