當您在 HubSpot 中加入社交文章的連結時,將會顯示預覽,包括特色圖片、頁面標題和頁面描述。
社交預覽是基於頁面 HTML<head>
部分的meta 標籤。這些標籤會告訴社交媒體網站平台,在建立分享連結的預覽時,應該著重哪些內容。基本的元標籤有
標題、元描述和特色圖片會自動設定為部落格文章。對於登陸頁面和網站頁面,標題和元描述會自動設定,但特色圖片必須手動設定。
請注意:LinkedIn 會在預覽卡片中顯示您的特色圖片、頁面標題和 URL,但不會包含您的元描述。
如果您的社交文章預覽沒有顯示預期的特色圖片、頁面標題或頁面描述,您可以在 HubSpot 或使用外部除錯工具排除故障。
如果您要連結至 HubSpot 網站託管的部落格文章、登陸頁面或網站頁面,請確定頁面或文章的設定中已設定特色圖片。
您也可以手動設定 og:image
標籤來新增特色圖片:
導覽到您的內容:
<meta property="og:image" content="IMG URL">
<meta name="twitter:card" content="summary_large_image">
如果您在社交文章中分享外部頁面,您可以使用瀏覽器開發工具,例如Chrome 開發工具 ,以確保頁面的 meta 標籤設定正確。查看頁面來源,然後檢查並確認以下內容:
og:image
和其他元標籤已正確顯示。og:image
標籤是否正確。如果您看到社交預覽與 meta 標籤之間有差異,社交網路可能需要重新抓取該頁面。針對每個社交網路使用下列驗證工具,以顯示任何錯誤或觸發網頁重新抓取:
一般而言,在重新抓取頁面前發表的任何文章仍會保留不正確的圖片。如果未為頁面設定og:image
標籤,社交網路會掃描頁面,找出最適合包含在社交文章中的圖片,這通常是它找到的第一張圖片。如果使用 robots.txt 檔案或安全軟體防止頁面抓取,連結預覽圖片可能完全不會顯示。
如果您的社交文章預覽顯示預期的特色圖片,但圖片顯示不正確,您可以檢查下列情況。
如果專題圖片無法正確顯示在社交預覽中(例如,圖片被切掉或比例不正確),您可能需要編輯圖片,使其具有適合您發佈到的社交網路的正確尺寸,然後再重新發佈頁面。
以下是每個網路的特色圖片最佳化建議尺寸:
確保社交文章中包含的任何媒體遵循每個網路的檔案大小指引。如果 HubSpot 判定檔案過大,無法發佈到特定網路,則在建立社群文章時會出現警告。以下是每個社交網路的最大檔案大小:
內嵌的色彩配置文件可能會影響您的特色圖片在社交文章中的顯示效果。不同的系統以不同的方式處理不常用的色彩設定檔,這就是為什麼在檔案管理員中預覽圖片時,色彩看起來可能會有所不同。
您可以透過外部工具 執行您的圖片 URL,看看它是否使用不常用的色彩設定檔。如有必要,您可以在外部照片編輯工具(如 Photoshop)中移除干擾的色彩設定檔,然後在發表社交文章之前重新發表頁面。
HubSpot 的檔案管理員 對 JPEG 和 PNG 使用影像壓縮,以協助優化 HubSpot 架設內容的載入速度。社交媒體網路也會在文章中使用圖片壓縮,這可能與您在 HubSpot 中看到的品質不同。
因此,建議每個網路使用相對高解析度的圖片。如果您的圖片不符合社交網路的要求,HubSpot 的社交發布工具中會出現警告,以幫助相應調整您的圖片。