Meta 標籤產生器

寫出哪些標籤

一個頁面需要標題、描述、標準網址、Open Graph 標籤和一張 X 卡片。這一頁寫出這些標籤，並統計標題和描述的字元數。

怎麼用

1. 填寫標題和描述。字元數在每個欄位旁邊，在輸入時立即更新。
2. 標準網址、圖片網址、圖片替代文字、網站名稱、og:type、og:locale、X 卡片和 X 網站都可以不填。og:type 一開始是 website。X 卡片一開始是 summary_large_image。
3. 轉換重新整理這些標籤。顯示範例把標題設為 Ada Lovelace notes，描述設為 Short notes on the analytical engine, with a portrait and a canonical page，標準網址和 og 圖片設為 https://example.com/ada 和 https://example.com/ada.jpg，替代文字設為 Portrait of Ada，網站設為 Example，og:type 設為 article，og:locale 設為 en_US，卡片設為 summary_large_image，X 網站設為 @example。
4. 這份結果含有 title 元素、name="description"、rel="canonical"、og:title、og:description、og:url、og:image、og:image:alt、og:site_name、og:type content="article"、og:locale content="en_US"、twitter:card content="summary_large_image"、twitter:title、twitter:description、twitter:image，以及 twitter:site content="@example"。
5. 全部清除清空這些欄位，把 og:type 設回 website，把卡片設回 summary_large_image。複製結果複製這些標籤。

字元數和空欄位

標題字元數和描述字元數一直顯示。標題超過 60 個字元會警告。描述超過 160 個字元會警告。標籤仍會寫出。

沒填的可選欄位會省掉。文字裡的引號會轉義。og:type 的選項是 website 或 article。X 卡片的選項是 summary 或 summary_large_image。

用在哪

• 給一篇文章起草 head 標籤。
• 發布前看出標題已經超過 60 個字元。
• 在 summary 和 summary_large_image 之間切換卡片。

常見問題