開放圖預覽工作室

開啟圖形預覽工具

正在載入工作區...

如何從任何 URL 預覽 OG 標籤

貼上絕對 https URL,運行“獲取元資料”,然後查看合併的標題、描述、圖像和目標 URL。展開診斷以確認狀態碼、重新導向後的最終 URL 以及內容類型。

如何選擇 Open Graph、Twitter Card 和後備元標記

對於 Facebook 和 LinkedIn 風格的預覽,我們更喜歡 Open Graph 標籤,然後在 og:image 丟失時回退到標題標籤、元描述、規範 URL 和第一個合適的正文圖像。對於 X/Twitter 風格的預覽,我們更喜歡 twitter:title、twitter:description 和 twitter:image(如果存在),否則我們會回退到 Open Graph,然後使用相同的通用後備。

常見元資料問題以及解決方法

缺少 og:image 是最常見的共享品質問題 - 添加方形或橫向圖像 URL。重複或衝突的標籤、沒有正確基礎的相對圖像 URL 以及被截斷的長標題也很常見。在發布之前使用編輯器測試修復。

如何匯出 HTML 元標記或 JSON

成功提取後(或手動填寫必填欄位後),使用複製 HTML 或複製 JSON,或下載 .html 和 .json 檔案。 HTML 程式碼段中的值會轉義,JSON 包含每個支援欄位的來源狀態。

從公共 URL 獲取 Open Graph 和 Twitter 卡片元數據,預覽 Facebook、X/Twitter 和 LinkedIn 風格的卡片,覆蓋本地字段,以及導出 HTML 元標記或 JSON。

常見問題解答

為什麼 Facebook、X 和 LinkedIn 之間的預覽會有所不同?

每個平台以稍微不同的順序讀取標籤,應用自己的裁剪規則,並且可能快取頁面的舊版本。工作室顯示來自合併元資料的一致的本機模板,以便您可以驗證結構和複製,而不是像素完美的網路渲染。

這個工具會改變我的即時網站嗎?

不會。僅針對目前請求解析所取得的 HTML。編輯和匯出保留在您的瀏覽器中(帶有用於可共享覆蓋的可選 URL 查詢參數)。沒有任何內容寫回您的網站。

如果我的頁面阻止自動提取怎麼辦?

某些網站向非瀏覽器用戶端傳回 403/401。此 MVP 僅支援無需身份驗證即可公開取得的 HTML。如果您控制伺服器,請嘗試暫存 URL 或暫時放寬機器人規則。