跳到內容
請注意::這篇文章的翻譯只是為了方便而提供。譯文透過翻譯軟體自動建立,可能沒有經過校對。因此,這篇文章的英文版本應該是包含最新資訊的管理版本。你可以在這裡存取這些內容。

解決社交文章中的連結預覽問題

上次更新時間: 六月 28, 2023

可与下列任何一种订阅一起使用,除非有说明:

行銷 Hub Professional, Enterprise
舊版 Marketing Hub Basic

在HubSpot中新增社交文章的連結時,系統會顯示包含特色圖片、頁面標題和頁面描述的預覽。

社交預覽是根據您頁面HTML的< head >部分中的meta標籤。 這些標籤會告訴社羣媒體網站平臺在建立共享連結的預覽時要關注什麼。 基本的meta標籤是:

  • og: title:內容的名稱。
  • og: type:內容的類型,例如影片或網頁。
  • og: image:圖片的URL來代表你的內容。
  • og: url :您的內容的唯一URL ,將用作其永久ID。
  • og :說明: 概述影像的說明。

系統會自動為部落格文章設定標題、meta說明和特色圖片。 對於登陸頁面和網站頁面,雖然標題和元描述也會自動設置,但必須手動設置特色圖像。 

請注意: LinkedIn會在預覽卡片中顯示您的特色圖片、頁面標題和網址,但不會包含您的meta說明。

文章預覽中沒有顯示特色圖片、頁面標題或頁面描述

如果您的社交文章預覽沒有顯示預期的特色圖片、頁面標題或頁面描述,您可以在HubSpot或使用外部調試工具進行疑難排解。

HubSpot中的故障排除 

如果您要連結至HubSpot託管的博客文章、登陸頁面或網站頁面,請確保在頁面文章的設定中設定了特色圖片。

您也可以手動設定og: image標籤來新增特色圖片: 

  • 在您的HubSpot帳戶中,前往您的登陸頁面或網站頁面。

  • 將遊標停留在頁面上,然後按一下「編輯」。 
  • 在內容編輯器中,按一下設定標籤,然後按一下進階選項。 
  • 在「 其他程式碼片段 」部分,將此 程式碼片段輸 入「Head HTML」欄位: 

 < meta property = "og: image" content = "IMG URL" >

< meta name = "twitter: card" content = "summary_large_image" >

  • 在右上角,按一下「發佈」或「更新」,即可即時設定變更。 

使用瀏覽器開發人員工具進行疑難排解

如果您在社交文章中分享外部頁面,您可以使用瀏覽器開發人員工具,例如Chrome開發人員工具,以確保頁面的元標籤設定正確。 查看頁面的來源,然後檢查並確認以下內容:

  • Og: image和其他meta標籤正確顯示。 
  • 每個標籤的細節都是正確的。 例如,檢查og: image標籤的特色圖像URL是否正確。
  • 每種類型的meta標籤只有一次出現。 如果同一元標籤出現多次,社羣網路可能無法在產生連結預覽時選擇正確的元標籤。
  • 您的meta標籤靠近HTML的頂部。 如果您在元標籤之前有額外的代碼或標記,社交網絡爬蟲可能無法找到這些標籤。 

ogimageconsole


使用Social Network Debugging Tools

如果您看到社交預覽和元標籤之間的差異,社交網絡可能需要重新爬取該頁面。 為每個社交網絡使用以下驗證工具來顯示任何錯誤或觸發頁面重新抓取:

  • Facebook Sharing Debugger : Facebook每24小時自動回收分享內容。 若要手動觸發重新爬網,請在「共用調試程式」中按一下「再次刮取」。
  • Twitter Card Validator : Twitter在發佈帖子後將內容緩存7天。 按一下「卡片驗證程式」中的「預覽卡片」,即可觸發內容的重新抓取。
  • LinkedIn Post Inspector : LinkedIn在發佈帖子後將內容緩存7天。 在文章檢查器中按一下檢查以觸發內容的重新抓取。

一般而言,在重新檢索頁面之前發佈的任何文章仍然會保留不正確的圖片。 如果尚未為頁面設置og: image標籤,社交網絡將掃描該頁面以找到最適合包含在社交帖子中的圖像,這通常是它找到的第一個圖像。 如果使用robots.txt檔案或安全軟體來防止頁面爬取,則連結預覽影像可能根本不會出現。

特色圖片顯示問題 

如果您的社交帖子預覽顯示預期的特色圖像,但圖像顯示不正確,您可以檢查以下內容。 

圖片大小或比例不正確

如果您的社交預覽中沒有正確顯示特色圖片(例如,圖片被剪切或比例不正確) ,您可能需要編輯圖片,以便它具有您發佈的社交網絡的正確尺寸,然後重新發佈頁面。 

建議在每個網絡上進行特色圖像優化時使用以下尺寸:

  • Facebook : 1.91: 1
  • Twitter :照片帖子為16 : 9 ,連結帖子中的特色圖像為1.91 : 1
  • Instagram (正方形) : 1 : 1
  • Instagram (肖像) : 4 : 5
  • Instagram (橫向) : 1.91 : 1
  • LinkedIn (橫向) : 1.91 : 1

確保您的社交帖子中包含的任何媒體都遵循每個網絡的檔案大小指南。 如果HubSpot確定某個檔案太大,無法張貼到某個網路,則在建立社交文章時會顯示警告。 以下是每個社交網絡的最大檔案大小:

  • Facebook : 8MB ( PNG檔案建議小於1MB以避免像素化)
  • Instagram : 8MB
  • Twitter : 5MB ( GIF爲15MB )
  • LinkedIn : 10MB

影像顏色的差異

嵌入的顏色配置文件可能會影響您的特色圖片在社交文章中的出現方式。 不同的系統以不同的方式處理不常見的顏色配置文件,這就是為什麼在檔案管理器中預覽影像時顏色可能會有所不同的原因。

您可以透過外部工具執行影像URL ,以查看它是否使用罕見的顏色設定檔。 如有必要,您可以在Photoshop等外部照片編輯工具中刪除幹擾的顏色配置文件,然後在發佈社交文章之前重新發佈該頁面。

影像清晰度的差異

HubSpot的檔案管理員在JPEG和PNG上使用影像壓縮,以幫助優化HubSpot託管內容的加載速度。 社交媒體網絡也在文章中使用圖像壓縮,這可能與您在HubSpot中看到的質量不同。

因此,建議對每個網絡使用相對高分辨率的圖像。 如果您的圖片不符合社羣網路的要求, HubSpot的社羣發佈工具會顯示警告,協助您相應調整圖片。

這篇文章有幫助嗎?
此表單僅供記載意見回饋。了解如何取得 HubSpot 的協助