OG／Meta Tag 預覽器：連結貼進 LINE 群之前，先看 FB、LINE、X、Google 會把它長成什麼樣｜AI101 Day 187
活動頁做好，連結往 LINE 群一貼，跳出來的預覽圖是空白、標題被切一半、描述抓到頁尾的版權宣告，訊息已經出去了，收回也來不及。OG／Meta Tag 預覽器讓你把頁面標題、描述、頁面網址、OG 圖片網址、網站名稱填進去，同一組設定在 FB、LINE、Twitter/X、Google 四個平台的呈現並排給你看，標題與描述超過字數當場標出來，確認沒問題後一鍵複製 meta tags 貼回 head。
不瞞你說，這支工具是我自己被雷到才做的。去年底發一堂課的報名連結到學員群，我興沖沖貼上去，LINE 跳出來的預覽卡片是一塊灰色空白，標題只顯示「圭話行銷」四個字，描述那一行抓到的是頁尾的「版權所有」。群裡安靜了快十分鐘，才有一個學員私訊問我：「老師，這連結是對的嗎？」
問題不在網頁本身，網頁打開是好的。問題是 og:image 那張圖我放的是一張三千多像素的 PNG，LINE 抓取超時直接放棄；標題沒有另外寫 og:title，所以它抓到瀏覽器分頁名稱；描述根本沒寫，它就自己往頁面裡撈了一句。三個洞，每一個都是在發出去之前花一分鐘就能看到的。
後來我養成一個習慣：任何連結要貼進群組或粉專之前，先跑一次預覽。這就是 OG／Meta Tag 預覽器要做的事。
這個工具能做什麼
輸入欄位有六個：頁面標題（title）、描述（description）、頁面網址（url）、OG 圖片網址（建議 1200×630）、網站名稱，還有一個「類型」可以選 website、article、product、video，也就是網站、文章、商品、影片。填的時候標題旁邊會即時顯示「幾字 / 60」，描述顯示「幾字 / 155」，超過範圍就會標出來。OG 圖片那欄直接寫了建議尺寸，這是 FB 慣用的規格，也是多數平台最不會出錯的起點。
填完之後下面有四個分頁：FB、LINE、Twitter/X、Google，點過去就看到同一組資料在各平台會長成什麼樣。差異比你想像的大。FB 標題建議 60 字內，LINE 建議 50 字內就會開始截；LINE 的縮圖會裁成接近方形，所以 1200×630 的圖如果把重點文字放在左右兩側，在 LINE 上就會被切掉；Google 那個分頁則是搜尋結果的樣子，標題與描述的顯示長度又跟社群不一樣。
確認每個平台都看得過去，按「複製全部」會把完整的 meta tags 一次複製，包含 og:image、og:type、og:locale 和 twitter:card 這些常被漏掉的標籤，貼回網頁的 head 區塊就好。如果你用的是 SHOPLINE、Cyberbiz 這類開店平台，沒有原始碼可以改，就把標題、描述、圖片網址分別填進後台的 SEO 或社群分享設定欄位，效果一樣。
這裡順便講一個很多人分不清的事：網頁的 title 是瀏覽器分頁上那行字，og:title 才是分享出去時卡片上的標題，兩個可以不一樣，而且多半應該不一樣，分頁名要讓人在十幾個分頁裡認得出來，卡片標題要讓人想點。描述沒寫的話平台就自己撈，撈到什麼看運氣。工具把這幾個欄位拆開讓你分別填，就是要你一次把它們想清楚。
這支是純計算工具，不需要登入也不消耗 AI 額度，你可以一個下午把手上所有活動頁逐一過一遍。
為什麼這件事值得做好
我覺得分享連結是整個行銷漏斗裡最被忽略的一環。大家花兩週做活動頁、花預算投廣告，最後把連結貼進 LINE 群的那一秒，卻完全沒有人管那張卡片長什麼樣。偏偏在 LINE 與 FB 上，使用者決定點不點，看的就是那張卡片，不是你的網頁。預覽卡片就是你的廣告素材，只是沒有人把它當素材在做，也沒有人在發出去之前先看過一眼。
而且這是一次性的。訊息發出去，預覽就定了，LINE 還會快取，你事後補改 meta tag，群裡那則訊息還是空白的那張。FB 可以用官方的分享偵錯工具強制重抓，LINE 多半要換一個帶參數的網址才會更新，所以「改完再發一次」在實務上等於要再發一則，群組的人會覺得你在洗版。
另一個常見狀況是只調一個平台。有人為了 FB 把圖做成 1200×630，標題寫滿 60 字，結果 LINE 上標題被切、圖被裁成只剩半張臉。四個平台分開看就是為了避免這種顧此失彼，你會發現有時候要稍微犧牲 FB 的滿版效果，換 LINE 上一張乾淨的縮圖，因為台灣的活動流量多半從 LINE 來。
我自己也還是會偷懶。前兩個月有一次趕著發，沒跑預覽，結果描述那欄忘了改，還是上一檔活動的文案。所以這件事不是懂了就不會錯，是要變成動作，像出門前摸一下口袋確認鑰匙那樣，不用思考就會做。我現在的做法是把預覽器加進瀏覽器書籤列，連結複製之後第一個開的就是它，大概改掉了八成的失誤，剩下兩成是真的太趕。
幾個實際建議
第一，標題在 50 字內寫完，描述控制在 110 字上下，不要寫滿。工具顯示的 60 與 155 是上限不是目標，LINE 的截斷更早，而且手機上實際能顯示的行數有限，留一點餘裕最安全。
第二，OG 圖的重點內容放在中間六成的區域。1200×630 的圖在 FB 是滿版，在 LINE 會被裁成近方形，左右各切掉一截。活動名稱、日期、價格這些字放中間，兩邊都活得下來。檔案大小也壓一下，我的經驗是太大的圖 LINE 常常抓不到，寧可畫質稍微犧牲一點。我那張灰色空白卡片就是圖太大造成的，後來所有分享圖一律先壓過再上傳，再也沒有出現過空白。
第三，每一檔活動用新的網址或加參數，不要重複用同一個頁面改內容。平台快取是以網址為單位，你把雙 11 的頁面改成雙 12 繼續用，LINE 上跑出來的還是雙 11 的圖。這也是順便把流量分開算的好機會，在網址後面帶 utm 參數，LINE 群一組、粉專一組、EDM 一組，月底看報表就知道哪個管道真的有人點。工具的頁面網址欄位填的就是這個最終網址，預覽時順便確認參數沒打錯。
第四，類型不要每次都選網站。賣東西的頁面選商品、文章選文章、影片選影片，部分平台會依類型調整卡片的版型，Google 也會參考這個判斷頁面性質。這是一秒鐘的事，但多數人從來沒點開過那個下拉選單。
小結
連結只有一次第一印象。把頁面標題、描述、OG 圖片網址填進預覽器，四個平台看一輪，字數超標的改一改，複製全部 meta tags 貼回去，整個流程一分鐘，省下的是一則發出去就收不回的空白卡片，和之後那則尷尬的「補充說明」。