Windows 上的 Open Graph 產生器可在瀏覽器中建立必要的 4 項 Open Graph 屬性，並提供僅包含通訊_protocol 的區塊，供您複製到正規頁面的 head 中。

此工具支援選填的描述、網站名稱與語系，但不會擷取您提交的 URL、建立 Twitter Card 標籤，也無法保證社交平台會如何顯示頁面。

open graph generator on windows
Windows 上的 Open Graph 產生器：建立及安裝標籤

Windows 工作流程會建立哪些內容

此表單涵蓋可分享圖形物件所需的頁面欄位：標題、物件類型、正規頁面 URL，以及代表圖片 URL。您也可以加入描述、較大的網站名稱與語系。Open Graph Protocol 將 4 項基本屬性列為必要項目，而產生器一律會先輸出這些屬性。

屬性 狀態 用途
og:title 必要 指定分享物件的名稱。
og:type 必要 在此產生器中，將物件分類為網站或文章。
og:image 必要 提供代表視覺內容的 URL。
og:url 必要 識別永久性的正規物件。
og:description 選填 摘要說明物件。
og:site_name 選填 指定較大的網站名稱。
og:locale 選填 採用 language_TERRITORY 格式，例如 en_US。

輸出會使用屬性語法，例如 <meta property="og:title" content="...">，而非名稱語法。產生器會維持穩定的屬性順序、修剪輸入的文字、套用長度限制、拒絕控制字元，並逸出屬性值。因此，和號、引號與角括號不會破壞產生的元素。該區塊僅包含 Open Graph 屬性，不包含 Twitter Card 標籤。

在 Windows 瀏覽器中產生 Open Graph 標籤

  1. 在您的 Windows PC 瀏覽器中開啟 Open Graph 產生器。所有表單處理與產生作業都在瀏覽器中進行，因此此工作流程會從一般網頁開始，而非桌面版安裝程序。
  2. 輸入可準確描述頁面的標題，然後選擇 website 或 article 作為物件類型。表單僅支援這 2 種類型，因為更豐富的通訊_protocol 類型需要各自額外的結構化屬性。
  3. 將正規頁面 URL 與代表圖片 URL 加為預定可公開存取的絕對 HTTP 或 HTTPS 位址。不要加入認證資訊或 #section 之類的片段。瀏覽器的 URL 解析器會將接受的位址正規化，但工具本身不會擷取這些位址。
  4. 選擇性輸入描述、網站名稱與語系。語系採用 language_TERRITORY 格式，例如 en_US；驗證器會接受由 2 個字母的語言代碼與 2 個字母的地區代碼組成的保守格式。替代語系與文字子標籤不在此精簡表單的支援範圍內。
  5. 產生中繼資料。如果缺少任何必要值，工具會阻止輸出，而不會產生不完整的區塊。輸入有效時，請複製僅包含通訊_protocol 的區塊；必要屬性會先出現，接著是您提供的任何選填欄位。
  6. 在您的 Windows 編輯器或發布系統中開啟控制正規頁面的來源，然後將區塊貼到 HTML <head> 中。儲存變更，並使用您平常的網站工作流程發布或部署。
  7. 部署後檢查實際提供的頁面原始碼，然後針對每個目標社交服務使用目前的預覽除錯工具。請遵循下列驗證步驟，因為成功產生並不能證明爬蟲可存取該頁面或預覽已重新整理。

將區塊放在正規頁面的 head 中

Open Graph 中繼資料應放在由 og:url 識別之頁面的 HTML head 中。HTML meta 元素規格 會說明這些元素為何應放在文件的中繼資料中，而非可見的 body 內容中。請依產生的樣貌貼上元素：不要再次編碼整個區塊，也不要將其顯示為頁面文字。

儲存前，請檢查您的網站如何產生最終的 head。框架、範本、外掛或部署指令碼可能已經加入 Open Graph 元素。避免同時透過外掛與手動編輯的範本維護相同標籤。重複的標籤可能使回應中留下互相衝突的值，而建置步驟可能會重新排列或覆寫您貼上的內容。

  • 為正規頁面保留 1 個產生的 Open Graph 區塊。
  • 確保標題、描述與圖片符合可見內容，以免預覽錯誤呈現目的地的資訊。
  • 檢查實際提供的 HTML，不要假設編輯器預覽能反映正式環境。
  • 如果頁面移動或身分變更，請同時更新中繼資料、圖片與頁面的呈現方式。

驗證實際提供的原始碼與平台預覽

發布後，請檢查爬蟲收到的回應，確認所有 4 項必要屬性都各出現 1 次，且也包含預定要提供的選填屬性。產生器會驗證提供給它的值，但無法回報建置流程產生的最終 HTML。

  1. 將實際提供的原始碼與複製的區塊進行比對。檢查是否有遺漏的元素、重複的屬性、被改寫的 URL，或後續與產生值衝突的標籤。
  2. 確認目標服務的爬蟲可以存取正規頁面，且圖片 URL 指向可公開存取的圖片。發布後請維持此存取方式的穩定性。
  3. 分別檢查擷取到的圖片回應與平台需求。產生器不會測試 HTTP 狀態、MIME 類型、尺寸、位元組大小、寬高比、重新導向、robots 控制或驗證機制。
  4. 開啟每個目標平台目前的除錯工具或分享檢查器，然後使用已發布的 URL 請求預覽。
  5. 如果預覽顯示舊資訊，請考慮該平台的快取重新整理行為並再次測試。即使區塊有效，仍可能產生過時的卡片。
  6. 將原始碼、擷取到的圖片與平台上的即時預覽一起比較。頁面或圖片有任何變更時，請一致地更新所有呈現方式。

即使中繼資料有效，社交服務仍可能裁切圖片、截斷文字、忽略欄位、顯示快取資料或套用帳號層級政策。每個服務目前的除錯工具才是相關的檢查方式；產生器無法保證特定的卡片版面配置。

瞭解驗證範圍

此產生器的功能刻意有所限制。它會為 2 種物件類型建立符合通訊_protocol 格式的 Open Graph 區塊，而不是通用的社交中繼資料套件。以下比較會區分工具驗證的內容，以及發布者仍必須確認的事項。

領域 產生器行為 發布者檢查
物件類型 接受 website 或 article，並在產生時再次檢查選擇項目。 對於更豐富的類型，請使用專門的實作方式。
URL 要求絕對 HTTP 或 HTTPS 值，不得含認證資訊或片段，並將接受的值正規化。 檢查可存取性、爬蟲存取、重新導向與圖片回應。
文字 修剪輸入、限制長度、拒絕控制字元，並逸出 HTML 屬性。 確認內容與可見頁面及平台限制相符。
語系 接受 1 個保守格式的 language_TERRITORY 值。 透過更廣泛的通訊_protocol 作業與編輯決策加入替代語系或文字子標籤。
輸出 先以穩定的屬性語法輸出必要屬性。 確認建置流程未修改或重複該區塊。
預覽 僅產生通訊_protocol 中繼資料。 驗證平台快取、算繪結果與各服務專屬的標籤。

由於不會擷取任一 URL，成功產生並不能證明 2 項資源皆可使用。如果社交爬蟲無法取得頁面或圖片，即使標記有效，預覽仍可能失敗。如果頁面需要音樂、影片、個人資料或其他更豐富的物件類型，請使用能收集該類型所需額外欄位的實作方式。

Open Graph 也無法與每個平台的原生格式互換使用。部分服務可將 Open Graph 屬性作為備援，但 Twitter Card 中繼資料與其他服務專屬規則仍各自獨立。將這些標籤與產生的 Open Graph 區塊分開，可讓每種通訊_protocol 都能獨立稽核，也能避免將服務專屬欄位呈現為通用需求。

如果您正在評估選項，在 Windows 中從 Sitemap 擷取 URL：XML 轉 URL 清單 對此有詳細說明。

如果您正在評估選項，我該如何判斷是否需要產生正規化標籤？ 對此有詳細說明。