👀 貼連結到 LINE 群卻沒圖沒描述？發文前先把分享卡片看清楚

OG / Meta Tag 預覽器使用教學。把標題、描述、圖片網址填一填，就能同時看到連結分享到 Facebook、LINE、Twitter/X 和 Google 搜尋結果長什麼樣子，字數自動檢查會不會被截斷，最後一鍵複製整份 meta tags 貼進網頁。純瀏覽器本機運算，不上傳、不耗 AI 額度。

為什麼一條連結貼出去的樣子這麼重要

你花三小時寫好一篇商品頁，興沖沖把連結貼進 LINE 群組推廣，結果跳出來的是一片灰底、沒有圖、標題還是那串「首頁 - 未命名商店」。這條連結在群組裡自動廢了一半，因為沒有人會點一個看起來像垃圾訊息的東西。

分享卡片就是連結的門面。同一條網址，貼到 Facebook、LINE、Twitter/X、丟進 Google 搜尋結果，長出來的樣子完全不一樣，字數上限也各自不同。你在瀏覽器打開網頁看得好好的，不代表它被分享出去時也好看。

真正決定分享卡片長相的，是網頁裡那幾行 Open Graph 和 meta 標籤。問題是這些標籤藏在原始碼裡，改完要重新部署、清快取、再用平台的偵錯工具驗證，一輪跑下來半小時就沒了。這個工具讓你在寫進網頁之前，就先把四個平台的樣子一次看清楚。

這個工具實際上在做什麼

它做兩件事：即時預覽，加上產生 meta tags。

你在左邊填五個欄位，右邊就同步畫出分享卡片：

頁面標題（title）：分享出去最上面那行粗體字
描述（description）：標題底下那段說明文字
網址（url）：卡片顯示的網域，也會寫進 canonical
圖片網址（og:image）：卡片那張大圖的來源連結
網站名稱（og:site_name）：LINE、Facebook 卡片上顯示的來源站名

上方可以切換 Facebook、LINE、Twitter/X、Google 四個分頁，每切一個，字數檢查的上限就跟著換。標題和描述欄位旁邊會即時顯示「目前字數 / 該平台上限」加上紅綠燈：綠色代表安全，黃色代表可能被截斷，紅色代表一定超出。

各平台的實際上限差很多。標題部分，LINE 大約 50 字、Facebook 和 Google 約 60 字、Twitter/X 約 70 字；描述部分 LINE 只有約 80 字、Facebook 和 Google 約 155 字、Twitter/X 約 200 字。LINE 是最嚴格的，你在 Facebook 看起來剛好的描述，貼到 LINE 群很可能被切一半。

填完之後，工具會自動組好一整份 meta tags，包含 </code>、<code class="px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono">description</code>、canonical、Open Graph 那一組（Facebook 和 LINE 共用）、還有 Twitter Card 那一組，按一下就複製，直接貼進網頁的 <code class="px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono"><head></code> 就好。全程在你瀏覽器裡跑，沒有上傳、沒有呼叫 AI。</p><div class="my-8 p-5 rounded-2xl border border-accent/30 bg-accent/5"><p class="font-bold text-sm mb-2">想要實際操作看看？</p><div class="flex flex-wrap gap-2"><a class="inline-flex items-center gap-1.5 text-sm px-4 py-2 rounded-full bg-accent text-white hover:bg-accent-light transition font-medium" href="/title-scorer">試試 商品標題 SEO 評分器 →</a><a class="inline-flex items-center gap-1.5 text-sm px-4 py-2 rounded-full bg-accent text-white hover:bg-accent-light transition font-medium" href="/social-post">試試 社群貼文產生器 →</a><a class="inline-flex items-center gap-1.5 text-sm px-4 py-2 rounded-full bg-accent text-white hover:bg-accent-light transition font-medium" href="/link-tracker">試試 短連結追蹤器 →</a></div></div></section><section id="step-by-step"><h2 class="text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50">三步驟做出一張不漏氣的分享卡片</h2><h3 class="font-bold text-text-primary dark:text-text-dark-primary mt-6 mb-2">步驟 1：填標題和描述，四個平台都切一輪</h3><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">先填標題和描述。填的時候不要只看一個平台，把上方四個分頁都點一遍，看紅綠燈的變化。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">重點看 LINE。因為 LINE 的字數上限最短，只要你的東西主要靠 LINE 群或 LINE 官方帳號推，就以 LINE 的綠燈為準來寫。把最重要的賣點、數字、活動關鍵字塞在標題前 20 個字，就算被截斷也還讀得懂。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">不知道怎麼下手可以先點右上角「載入範例」，它會帶入一組手作蠟燭的完整資料，照著改成你自己的最快。</p><h3 class="font-bold text-text-primary dark:text-text-dark-primary mt-6 mb-2">步驟 2：補上圖片網址、網址、網站名稱</h3><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">og:image 是分享卡片最搶眼的部分。填一個已經上線、公開可存取的圖片網址，建議 1200 × 630 的比例，太小或比例不對，平台會裁切或乾脆不顯示。圖片還沒做好的話，範例裡那串 <code class="px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono">ecom.atmarketing.tw/api/og</code> 的網址就是一個動態生成 OG 圖的做法，可以參考。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">網址填商品頁或活動頁的完整網址，網站名稱填你的品牌名，這兩個會讓卡片看起來更像正規來源，而不是可疑連結。</p><h3 class="font-bold text-text-primary dark:text-text-dark-primary mt-6 mb-2">步驟 3：確認預覽、複製 meta tags 貼進網頁</h3><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">右邊四個平台的卡片都確認過、標題描述都是綠燈之後，找到 meta tags 那一區，按複製，貼進你網頁的 <code class="px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono"><head></code> 裡（如果是 Shopify、Shopline 這類平台，就貼進後台的 SEO 或自訂 header 欄位）。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">貼完部署上線後，用各平台的官方偵錯工具強制刷新一次快取（Facebook 分享偵錯工具、LINE 也有類似的），因為平台會把舊的卡片存起來，不刷新它會一直顯示舊樣子。</p></section><section id="tips"><h2 class="text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50">幾個讓卡片點擊率更高的細節</h2><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary"><strong class="text-text-primary dark:text-text-dark-primary font-semibold">標題把品牌名放後面。</strong> 「有機手作蠟燭 | 溫暖生活」比「溫暖生活 | 有機手作蠟燭」好，因為被截斷時，前面的商品關鍵字比品牌名重要，也對 Google 搜尋結果的點擊更有利。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary"><strong class="text-text-primary dark:text-text-dark-primary font-semibold">描述不要重複標題。</strong> 標題已經講過的東西，描述就別再說一次。描述拿來補上標題塞不下的資訊：規格、活動、限時優惠、或一句勾起好奇的話。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary"><strong class="text-text-primary dark:text-text-dark-primary font-semibold">以 LINE 為底線寫，其他平台自然過關。</strong> 因為 LINE 字數最短，只要標題描述在 LINE 是綠燈，貼到 Facebook、Twitter/X 幾乎一定安全。反過來以 Twitter 為準寫就會在 LINE 爆掉。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary"><strong class="text-text-primary dark:text-text-dark-primary font-semibold">og:image 一定要是絕對網址。</strong> 要用 <code class="px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono">https://</code> 開頭的完整網址，不能用 <code class="px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono">/images/xxx.jpg</code> 這種相對路徑，平台抓不到相對路徑，卡片就沒圖。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary"><strong class="text-text-primary dark:text-text-dark-primary font-semibold">同一張圖在不同平台會有不同裁切。</strong> Twitter 的 summary_large_image 和 Facebook 的比例略有差異，重要文字和主體不要壓在圖的最邊緣，留一點安全邊界，四個平台看起來才都完整。</p></section><section id="use-cases"><h2 class="text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50">三個實際用得到的情境</h2><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary"><strong class="text-text-primary dark:text-text-dark-primary font-semibold">情境 A：新商品上架前先驗一次分享卡片</strong></p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">商品頁做好、還沒開始推之前，把標題、描述、商品主圖網址填進來，切到 LINE 分頁確認描述沒被切、切到 Facebook 確認圖有出來。全綠再複製 meta tags 貼進商品頁。這樣第一批貼到社群的連結就是漂亮的，不會白白浪費第一波觸及。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary"><strong class="text-text-primary dark:text-text-dark-primary font-semibold">情境 B：檔期活動頁，同一條連結要發四個平台</strong></p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">雙 11 活動頁要同時發 FB 貼文、LINE 群、Twitter/X。用這個工具把四個平台的卡片一次看完，確認每個平台的活動關鍵字（例如「全館 5 折」）都在被截斷之前就出現。一條連結四個平台都好看，省下各平台分開測的時間。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary"><strong class="text-text-primary dark:text-text-dark-primary font-semibold">情境 C：舊頁面分享出去很醜，來抓問題</strong></p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">有人回報你的連結貼到 LINE 沒有圖。把那個頁面現有的標題、描述、圖片網址填進來重現一次，通常會發現兩種問題之一：og:image 填的是相對路徑（換成絕對網址就好），或是描述在 LINE 上限之內卻在別的地方被截。用預覽對照就能快速定位，改完再複製新的 meta tags 覆蓋上去。</p></section><section id="next-steps"><h2 class="text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50">卡片做好之後，接著做這些</h2><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">分享卡片是連結的門面，但門面只負責讓人願意點。點進去之後能不能轉換、點擊有沒有被追蹤到，是另外兩件事。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">標題還想再打磨的話，把它丟進<a href="/title-scorer" class="text-accent hover:underline">商品標題 SEO 評分器</a>，看關鍵字布局和字數結構在搜尋端有沒有加分空間，跟這裡的分享卡片相輔相成，一個顧搜尋、一個顧社群。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">四個平台的貼文本體還沒寫的話，用<a href="/social-post" class="text-accent hover:underline">社群貼文產生器</a>一次生出四平台版本，貼文配上這裡調好的分享卡片，整套推廣素材就齊了。</p><p class="my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary">連結發出去之後想知道哪個平台帶來的點擊最多，把網址先過一次<a href="/link-tracker" class="text-accent hover:underline">短連結追蹤器</a>再發，就能看到即時點擊統計，回頭驗證哪個平台的卡片真的比較會被點。</p></section></div><section class="mt-12" id="faq"><h2 class="text-xl font-bold mb-6 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50">常見問題</h2><div class="space-y-4"><details class="group rounded-2xl border border-border dark:border-border-dark overflow-hidden"><summary class="cursor-pointer p-5 font-medium text-text-primary dark:text-text-dark-primary hover:bg-surface-alt dark:hover:bg-surface-dark-alt transition flex items-center justify-between"><span>Q: 這個工具會消耗 AI 額度或上傳我的資料嗎？</span><svg class="w-5 h-5 text-text-secondary dark:text-text-dark-secondary flex-shrink-0 transition-transform group-open:rotate-180" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></summary><div class="px-5 pb-5 text-text-secondary dark:text-text-dark-secondary leading-relaxed">不會。標題、描述、圖片網址、預覽全部在你的瀏覽器本機即時運算，不上傳到任何伺服器、不呼叫 AI、不消耗額度，免費無限次使用。你填的內容關掉分頁就沒了，不會被儲存。</div></details><details class="group rounded-2xl border border-border dark:border-border-dark overflow-hidden"><summary class="cursor-pointer p-5 font-medium text-text-primary dark:text-text-dark-primary hover:bg-surface-alt dark:hover:bg-surface-dark-alt transition flex items-center justify-between"><span>Q: 為什麼同一段描述在 Facebook 顯示正常，在 LINE 卻被切掉？</span><svg class="w-5 h-5 text-text-secondary dark:text-text-dark-secondary flex-shrink-0 transition-transform group-open:rotate-180" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></summary><div class="px-5 pb-5 text-text-secondary dark:text-text-dark-secondary leading-relaxed">因為各平台的字數上限不同。LINE 的描述上限最短（約 80 字），Facebook 和 Google 約 155 字。所以你在 Facebook 看剛好的描述，貼到 LINE 就可能超出被截斷。切到工具的 LINE 分頁看紅綠燈，以 LINE 為底線寫最保險。</div></details><details class="group rounded-2xl border border-border dark:border-border-dark overflow-hidden"><summary class="cursor-pointer p-5 font-medium text-text-primary dark:text-text-dark-primary hover:bg-surface-alt dark:hover:bg-surface-dark-alt transition flex items-center justify-between"><span>Q: 我複製了 meta tags 貼進網頁，為什麼分享出來還是舊的樣子？</span><svg class="w-5 h-5 text-text-secondary dark:text-text-dark-secondary flex-shrink-0 transition-transform group-open:rotate-180" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></summary><div class="px-5 pb-5 text-text-secondary dark:text-text-dark-secondary leading-relaxed">平台會把分享卡片快取起來，改完標籤後它可能還顯示舊版。要用各平台的官方偵錯工具（例如 Facebook 分享偵錯工具）強制重新抓取一次，快取刷新後就會顯示新卡片。這一步跟工具本身無關，是平台快取機制。</div></details><details class="group rounded-2xl border border-border dark:border-border-dark overflow-hidden"><summary class="cursor-pointer p-5 font-medium text-text-primary dark:text-text-dark-primary hover:bg-surface-alt dark:hover:bg-surface-dark-alt transition flex items-center justify-between"><span>Q: og:image 該用多大的圖？填了為什麼卡片沒出現圖片？</span><svg class="w-5 h-5 text-text-secondary dark:text-text-dark-secondary flex-shrink-0 transition-transform group-open:rotate-180" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></summary><div class="px-5 pb-5 text-text-secondary dark:text-text-dark-secondary leading-relaxed">建議用 1200 × 630 像素、比例 1.91:1 的圖，太小或比例不對會被裁切或不顯示。沒出圖最常見的兩個原因：一是填了相對路徑（要用 https:// 開頭的絕對完整網址），二是圖片網址沒有公開、平台抓不到。兩者排除通常就會正常。</div></details></div></section><div class="mt-12 p-8 rounded-2xl bg-gradient-to-r from-brand to-brand-light text-white text-center"><h3 class="text-xl font-bold mb-2">立即免費使用電商營運工具箱</h3><p class="text-white/80 text-sm mb-4">201 個 AI 驅動的電商工具，解決你每天最痛的營運問題</p><a class="inline-block px-8 py-3 rounded-full bg-white text-brand font-bold hover:bg-white/90 transition" href="/">開始使用 →</a></div><section class="mt-12"><h3 class="font-bold text-lg mb-4 text-text-primary dark:text-text-dark-primary">延伸閱讀</h3><div class="grid grid-cols-1 md:grid-cols-3 gap-4"><a class="group p-5 rounded-2xl border border-border dark:border-border-dark hover:border-accent/50 transition" href="/blog/how-to-use-image-alt-batch"><span class="text-xs px-2 py-0.5 rounded-full font-medium bg-teal-100 text-teal-700 dark:bg-teal-900/30 dark:text-teal-300">轉換優化</span><h4 class="font-bold text-sm mt-2 group-hover:text-accent transition line-clamp-2">🖼️ 商品圖沒補 alt 文字，等於把 Google 圖片搜尋的流量丟在門外</h4><p class="text-xs text-text-secondary dark:text-text-dark-secondary mt-1 line-clamp-2">AI 圖像 Alt 批次產生使用教學。輸入商品名、描述與 1 到 10 張圖的場景，一次產出符合 Google 圖片 SEO 規範的 alt 文字表格，同時給 Product Schema、無障礙檢查與檔名優化建議，直接複製貼回 Shopify、SHOPLINE、商店街後台。</p></a><a class="group p-5 rounded-2xl border border-border dark:border-border-dark hover:border-accent/50 transition" href="/blog/how-to-use-og-image-maker"><span class="text-xs px-2 py-0.5 rounded-full font-medium bg-pink-100 text-pink-700 dark:bg-pink-900/30 dark:text-pink-300">轉換優化</span><h4 class="font-bold text-sm mt-2 group-hover:text-accent transition line-clamp-2">🖼️ 貼文沒圖沒人點，開 Canva 又要十分鐘，這裡輸入標題就有分享圖</h4><p class="text-xs text-text-secondary dark:text-text-dark-secondary mt-1 line-clamp-2">社群封面圖產生器使用教學。輸入主標題、副標題與品牌名，選一組風格配色，瀏覽器直接畫出 1200×630 的社群分享圖並下載 PNG，全程不上傳不耗 AI 額度。內含中文不爆版的字數抓法、六種配色怎麼挑，以及開團、活動、部落格三種實際用法。</p></a><a class="group p-5 rounded-2xl border border-border dark:border-border-dark hover:border-accent/50 transition" href="/blog/how-to-use-social-cover-maker"><span class="text-xs px-2 py-0.5 rounded-full font-medium bg-pink-100 text-pink-700 dark:bg-pink-900/30 dark:text-pink-300">轉換優化</span><h4 class="font-bold text-sm mt-2 group-hover:text-accent transition line-clamp-2">🖼️ 一張封面圖同時搞定六個平台，不用再開六個檔案對尺寸</h4><p class="text-xs text-text-secondary dark:text-text-dark-secondary mt-1 line-clamp-2">社群封面製作器使用教學。一次支援 Facebook、LinkedIn、YouTube、X、IG、Threads 六大平台的正確尺寸，內建 8 款範本、安全區輔助線、AI 生成背景，直接在瀏覽器上排字換色，下載 PNG/WebP/JPEG，附三個實際情境與各平台安全區技巧。</p></a></div></section></article><aside class="hidden lg:block w-72 flex-shrink-0"><div class="sticky top-24"><nav class="p-5 rounded-2xl border border-border dark:border-border-dark"><h3 class="font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary">目錄</h3><ul class="space-y-2"><li><a href="#why" class="text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug">為什麼一條連結貼出去的樣子這麼重要</a></li><li><a href="#how-it-works" class="text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug">這個工具實際上在做什麼</a></li><li><a href="#step-by-step" class="text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug">三步驟做出一張不漏氣的分享卡片</a></li><li><a href="#tips" class="text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug">幾個讓卡片點擊率更高的細節</a></li><li><a href="#use-cases" class="text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug">三個實際用得到的情境</a></li><li><a href="#next-steps" class="text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug">卡片做好之後，接著做這些</a></li><li><a href="#faq" class="text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5">常見問題</a></li></ul></nav><div class="mt-4 p-5 rounded-2xl border border-accent/20 bg-accent/5"><h3 class="font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary">相關工具</h3><ul class="space-y-2"><li><a class="text-sm text-accent hover:underline transition block py-0.5" href="/title-scorer">商品標題 SEO 評分器 →</a></li><li><a class="text-sm text-accent hover:underline transition block py-0.5" href="/social-post">社群貼文產生器 →</a></li><li><a class="text-sm text-accent hover:underline transition block py-0.5" href="/link-tracker">短連結追蹤器 →</a></li></ul></div></div></aside></div></div></main><footer class="mt-16 border-t border-border bg-surface-secondary dark:bg-surface-dark-secondary"><div class="max-w-6xl mx-auto px-4 py-10"><div class="grid grid-cols-1 md:grid-cols-3 gap-8"><div><h3 class="font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary">🌐 圭話行銷站群</h3><ul class="space-y-2"><li><a href="https://ai101.atmarketing.tw/?utm_source=ecom&utm_medium=footer" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors flex items-start gap-2"><span>🚀</span><span><span class="font-medium block">AI101 挑戰</span><span class="text-text-muted text-[11px]">101 天 AI 工具開發挑戰</span></span></a></li><li><a href="https://marketing-lab.atmarketing.tw/?utm_source=ecom&utm_medium=footer" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors flex items-start gap-2"><span>🧪</span><span><span class="font-medium block">行銷研究室</span><span class="text-text-muted text-[11px]">六大 AI 工作站</span></span></a></li><li><a href="https://atmarketing.tw/teacher-tools?utm_source=ecom&utm_medium=footer" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors flex items-start gap-2"><span>👨‍🏫</span><span><span class="font-medium block">講師 AI 工具箱</span><span class="text-text-muted text-[11px]">16 款講師專用工具</span></span></a></li><li><a href="https://atmarketing.tw/?utm_source=ecom&utm_medium=footer" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors flex items-start gap-2"><span>✍️</span><span><span class="font-medium block">圭話行銷</span><span class="text-text-muted text-[11px]">何佳勳的行銷洞察</span></span></a></li></ul></div><div><h3 class="font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary">🔥 AI101 熱門工具</h3><ul class="space-y-1.5"><li><a href="https://ai101.atmarketing.tw/tools/day-1-ai?utm_source=ecom&utm_medium=footer_highlight" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors block">→ 免費 AI 提示詞模板</a></li><li><a href="https://ai101.atmarketing.tw/tools/day-2-2026?utm_source=ecom&utm_medium=footer_highlight" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors block">→ 2026 行銷年度行事曆</a></li><li><a href="https://ai101.atmarketing.tw/workflow?utm_source=ecom&utm_medium=footer_highlight" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors block">→ AI 工作流程拆解</a></li><li><a href="https://ai101.atmarketing.tw/contract?utm_source=ecom&utm_medium=footer_highlight" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors block">→ 合約風險快篩</a></li><li class="pt-1"><a href="https://ai101.atmarketing.tw/?utm_source=ecom&utm_medium=footer_more" class="text-xs text-brand hover:underline font-medium">看全部 101 個 AI 工具 →</a></li></ul></div><div><h3 class="font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary">📦 電商營運工具箱</h3><p class="text-xs text-text-secondary dark:text-text-dark-secondary leading-relaxed mb-3">201 個 AI 驅動的免費電商營運工具，由何佳勳製作，給每位台灣電商人。</p><ul class="space-y-1 text-xs"><li><a class="text-text-muted hover:text-brand" href="/terms">服務條款</a></li><li><a class="text-text-muted hover:text-brand" href="/privacy">隱私權政策</a></li><li><a class="text-text-muted hover:text-brand" href="/refund">退款政策</a></li><li><a class="text-text-muted hover:text-brand" href="/support">客服支援</a></li><li><a class="text-text-muted hover:text-brand" href="/feedback">💬 回報問題</a></li><li><a class="text-text-muted hover:text-brand" href="/about">關於</a></li></ul></div></div><div class="mt-6 pt-6 border-t border-border"><h3 class="font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary">🔗 主站熱門主題（存起來對照）</h3><div class="grid grid-cols-2 md:grid-cols-3 gap-2"><a href="https://atmarketing.tw/hub/ai-agent/?utm_source=ecom&utm_medium=footer_hub" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors">→ AI Agent 完整指南 <span class="text-text-muted">(15 篇)</span></a><a href="https://atmarketing.tw/hub/dtc-brands/?utm_source=ecom&utm_medium=footer_hub" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors">→ DTC 品牌完整指南 <span class="text-text-muted">(10 篇)</span></a><a href="https://atmarketing.tw/hub/ai-coding/?utm_source=ecom&utm_medium=footer_hub" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors">→ AI Coding 工具指南 <span class="text-text-muted">(10 篇)</span></a><a href="https://atmarketing.tw/hub/subscription-model/?utm_source=ecom&utm_medium=footer_hub" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors">→ 訂閱制商業模式 <span class="text-text-muted">(6 篇)</span></a><a href="https://atmarketing.tw/hub/brand-rise-fall/?utm_source=ecom&utm_medium=footer_hub" class="text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors">→ 品牌興衰案例 <span class="text-text-muted">(5 篇)</span></a><a href="https://atmarketing.tw/articles/?utm_source=ecom&utm_medium=footer_hub" class="text-xs text-brand hover:underline font-medium">全部 250+ 篇專欄 →</a></div></div><div class="mt-8 pt-6 border-t border-border text-center"><p class="text-xs text-text-muted">© 2026 圭話行銷 · 由 <a href="https://atmarketing.tw/?utm_source=ecom&utm_medium=footer_copyright" class="hover:text-brand">何佳勳</a> 主理 · 找工具請看 <a href="https://ai101.atmarketing.tw/?utm_source=ecom&utm_medium=footer_copyright" class="text-brand hover:underline">AI101 挑戰</a></p></div></div></footer><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><div aria-live="polite" aria-atomic="true" class="sr-only"></div><script src="/_next/static/chunks/1ih9z_l56apxx.js" id="_R_" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n8:I[563491,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\",\"/_next/static/chunks/132u9sdi5nqmf.js\"],\"default\"]\n:HL[\"/_next/static/chunks/39hg78l-l1d11.css\",\"style\"]\n:HL[\"/_next/static/chunks/2nb_0e-0-b1-z.css\",\"style\"]\n:HL[\"/_next/static/media/fb4edce8a3cbfef3-s.p.3ep0ejxd-rul1.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n2:T483,\n if ('serviceWorker' in navigator) {\n window.addEventListener('load', () =\u003e {\n navigator.serviceWorker.register('/sw.js').then(reg =\u003e {\n // 偵測新版本可用\n reg.addEventListener('updatefound', () =\u003e {\n const nw = reg.installing;\n if (!nw) return;\n nw.addEventListener('statechange', () =\u003e {\n if (nw.state === 'installed' \u0026\u0026 navigator.serviceWorker.controller) {\n // 有新 SW 等待中\n window.dispatchEvent(new CustomEvent('sw-update-ready'));\n }\n });\n });\n // 每 30 分鐘檢查一次更新\n setInterval(() =\u003e reg.update().catch(() =\u003e {}), 30 * 60 * 1000);\n }).catch(() =\u003e {})\n\n navigator.serviceWorker.addEventListener('message', (e) =\u003e {\n if (e.data?.type === 'SW_UPDATED') {\n window.dispatchEvent(new CustomEvent('sw-version-changed', { detail: e.data }));\n }\n });\n })\n }\n 0:{\"P\":null,\"c\":[\"\",\"blog\",\"how-to-use-og-preview\"],\"q\":\"\",\"i\":false,\"f\":[[[\"\",{\"children\":[\"blog\",{\"children\":[[\"slug\",\"how-to-use-og-preview\",\"d\",[\"articles\"]],{\"children\":[\"__PAGE__\",{},\"$undefined\",\"$undefined\",4608]},\"$undefined\",\"$undefined\",4608]},\"$undefined\",\"$undefined\",4608]},\"$undefined\",\"$undefined\",4624],[[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/39hg78l-l1d11.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/2nb_0e-0-b1-z.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/2mp2egrhlx07g.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/chunks/08-6tju2xqt77.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-2\",{\"src\":\"/_next/static/chunks/3fj3c32j4byqm.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-3\",{\"src\":\"/_next/static/chunks/02hskp1zrtqx4.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-4\",{\"src\":\"/_next/static/chunks/0015b3va-_e6a.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"zh-TW\",\"suppressHydrationWarning\":true,\"className\":\"noto_sans_tc_514e9619-module__Bek09q__className\",\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"script\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"$2\"}}],[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@type\\\":\\\"Organization\\\",\\\"@id\\\":\\\"https://ecom.atmarketing.tw/#organization\\\",\\\"name\\\":\\\"電商營運工具箱\\\",\\\"alternateName\\\":[\\\"ecom toolkit\\\",\\\"圭話行銷電商工具箱\\\"],\\\"url\\\":\\\"https://ecom.atmarketing.tw\\\",\\\"logo\\\":{\\\"@type\\\":\\\"ImageObject\\\",\\\"url\\\":\\\"https://ecom.atmarketing.tw/apple-touch-icon.png\\\",\\\"width\\\":180,\\\"height\\\":180},\\\"description\\\":\\\"台灣電商人的免費 AI 工具站，收錄 201 個工具，涵蓋文案、廣告、會員經營、法規檢查與營運計算。由圭話行銷何佳勳製作。\\\",\\\"inLanguage\\\":\\\"zh-TW\\\",\\\"sameAs\\\":[\\\"https://atmarketing.tw\\\",\\\"https://ai.atmarketing.tw\\\",\\\"https://ai101.atmarketing.tw\\\",\\\"https://www.threads.net/@chia.hsun301\\\"],\\\"founder\\\":{\\\"@type\\\":\\\"Person\\\",\\\"@id\\\":\\\"https://atmarketing.tw/#founder\\\",\\\"name\\\":\\\"何佳勳\\\",\\\"alternateName\\\":\\\"Chia-Hsun Ho\\\",\\\"jobTitle\\\":\\\"行銷顧問 / 講師\\\",\\\"worksFor\\\":{\\\"@id\\\":\\\"https://ecom.atmarketing.tw/#organization\\\"},\\\"sameAs\\\":[\\\"https://atmarketing.tw\\\",\\\"https://www.threads.net/@chia.hsun301\\\"]},\\\"knowsAbout\\\":[\\\"電子商務\\\",\\\"數位行銷\\\",\\\"會員經營\\\",\\\"RFM 分析\\\",\\\"Meta 廣告投放\\\",\\\"Google Ads\\\",\\\"蝦皮經營\\\",\\\"LINE 官方帳號\\\",\\\"AI 行銷工具\\\",\\\"電商法規\\\"],\\\"areaServed\\\":{\\\"@type\\\":\\\"Country\\\",\\\"name\\\":\\\"台灣\\\"}}\"}}],[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@type\\\":\\\"WebSite\\\",\\\"name\\\":\\\"電商營運工具箱\\\",\\\"description\\\":\\\"201 個 AI 驅動的免費電商營運工具：文案產生、廣告分析、客服回覆、利潤計算、法規檢查、KOL 報價、會員 RFM 分析、直播腳本等。台灣電商人的最佳副駕駛。\\\",\\\"url\\\":\\\"https://ecom.atmarketing.tw\\\",\\\"inLanguage\\\":\\\"zh-TW\\\",\\\"publisher\\\":{\\\"@id\\\":\\\"https://ecom.atmarketing.tw/#organization\\\"},\\\"potentialAction\\\":{\\\"@type\\\":\\\"SearchAction\\\",\\\"target\\\":{\\\"@type\\\":\\\"EntryPoint\\\",\\\"urlTemplate\\\":\\\"https://ecom.atmarketing.tw/?q={search_term_string}\\\"},\\\"query-input\\\":\\\"required name=search_term_string\\\"}}\"}}]]}],\"$L3\"]}]]}],{\"children\":[\"$L4\",{\"children\":[\"$L5\",{\"children\":[\"$L6\",{},null,false,null]},null,false,null]},null,false,null]},null,false,null],\"$L7\",false]],\"m\":\"$undefined\",\"G\":[\"$8\",[\"$L9\",\"$La\"]],\"S\":true,\"h\":null,\"r\":\"$undefined\",\"s\":\"$undefined\",\"a\":\"$undefined\",\"l\":\"$undefined\",\"p\":\"$undefined\",\"d\":\"$undefined\",\"b\":\"phEwUz4NToubFl1yeroKk\"}\nb:I[59919,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"ThemeProvider\"]\nc:I[713144,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"RecurProvider\"]\nd:I[390464,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"AuthProvider\"]\ne:I[845678,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"Navbar\"]\nf:I[869612,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"FounderBanner\"]\n10:I[339756,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"default\"]\n11:I[758298,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\",\"/_next/static/chunks/2-1tyzyymn-jj.js\"],\"default\"]\n12:I[837457,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"default\"]\n13:I[329306,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\",\"/_next/static/chunks/2_nufbzvyha7e.js\"],\"default\"]\n14:I[772859,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"default\"]\n1f:I[897367,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"OutletBoundary\"]\n20:\"$Sreact.suspense\"\n22:I[897367,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"ViewportBoundary\"]\n24:I[897367,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"MetadataBoundary\"]\n3:[\"$\",\"body\",null,{\"className\":\"bg-surface text-text-primary dark:bg-surface-dark dark:text-text-dark-primary min-h-screen\",\"children\":[[\"$\",\"a\",null,{\"href\":\"#main-content\",\"className\":\"sr-only focus:not-sr-only focus:fixed focus:top-2 focus:left-2 focus:z-50 focus:px-4 focus:py-2 focus:bg-brand focus:text-white focus:rounded-lg focus:text-sm\",\"children\":\"跳到主要內容\"}],[\"$\",\"$Lb\",null,{\"children\":[\"$\",\"$Lc\",null,{\"children\":[\"$\",\"$Ld\",null,{\"children\":[[\"$\",\"$Le\",null,{}],[\"$\",\"$Lf\",null,{}],[\"$\",\"main\",null,{\"id\":\"main-content\",\"children\":[\"$\",\"$L10\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$11\",\"errorStyles\":[],\"errorScripts\":[[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/2-1tyzyymn-jj.js\",\"async\":true}]],\"template\":[\"$\",\"$L12\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[\"$\",\"$L13\",null,{}],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}],[\"$\",\"$L14\",null,{}],[\"$\",\"footer\",null,{\"className\":\"mt-16 border-t border-border bg-surface-secondary dark:bg-surface-dark-secondary\",\"children\":[\"$\",\"div\",null,{\"className\":\"max-w-6xl mx-auto px-4 py-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid grid-cols-1 md:grid-cols-3 gap-8\",\"children\":[[\"$\",\"div\",null,{\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary\",\"children\":\"🌐 圭話行銷站群\"}],[\"$\",\"ul\",null,{\"className\":\"space-y-2\",\"children\":[[\"$\",\"li\",\"https://ai101.atmarketing.tw/?utm_source=ecom\u0026utm_medium=footer\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://ai101.atmarketing.tw/?utm_source=ecom\u0026utm_medium=footer\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors flex items-start gap-2\",\"children\":[[\"$\",\"span\",null,{\"children\":\"🚀\"}],[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"font-medium block\",\"children\":\"AI101 挑戰\"}],[\"$\",\"span\",null,{\"className\":\"text-text-muted text-[11px]\",\"children\":\"101 天 AI 工具開發挑戰\"}]]}]]}]}],[\"$\",\"li\",\"https://marketing-lab.atmarketing.tw/?utm_source=ecom\u0026utm_medium=footer\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://marketing-lab.atmarketing.tw/?utm_source=ecom\u0026utm_medium=footer\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors flex items-start gap-2\",\"children\":[[\"$\",\"span\",null,{\"children\":\"🧪\"}],[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"font-medium block\",\"children\":\"行銷研究室\"}],[\"$\",\"span\",null,{\"className\":\"text-text-muted text-[11px]\",\"children\":\"六大 AI 工作站\"}]]}]]}]}],[\"$\",\"li\",\"https://atmarketing.tw/teacher-tools?utm_source=ecom\u0026utm_medium=footer\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://atmarketing.tw/teacher-tools?utm_source=ecom\u0026utm_medium=footer\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors flex items-start gap-2\",\"children\":[[\"$\",\"span\",null,{\"children\":\"👨‍🏫\"}],[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"font-medium block\",\"children\":\"講師 AI 工具箱\"}],[\"$\",\"span\",null,{\"className\":\"text-text-muted text-[11px]\",\"children\":\"16 款講師專用工具\"}]]}]]}]}],[\"$\",\"li\",\"https://atmarketing.tw/?utm_source=ecom\u0026utm_medium=footer\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://atmarketing.tw/?utm_source=ecom\u0026utm_medium=footer\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors flex items-start gap-2\",\"children\":[[\"$\",\"span\",null,{\"children\":\"✍️\"}],[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"font-medium block\",\"children\":\"圭話行銷\"}],[\"$\",\"span\",null,{\"className\":\"text-text-muted text-[11px]\",\"children\":\"何佳勳的行銷洞察\"}]]}]]}]}]]}]]}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary\",\"children\":\"🔥 AI101 熱門工具\"}],[\"$\",\"ul\",null,{\"className\":\"space-y-1.5\",\"children\":[[[\"$\",\"li\",\"https://ai101.atmarketing.tw/tools/day-1-ai?utm_source=ecom\u0026utm_medium=footer_highlight\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://ai101.atmarketing.tw/tools/day-1-ai?utm_source=ecom\u0026utm_medium=footer_highlight\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors block\",\"children\":[\"→ \",\"免費 AI 提示詞模板\"]}]}],\"$L15\",\"$L16\",\"$L17\"],\"$L18\"]}]]}],\"$L19\"]}],\"$L1a\",\"$L1b\"]}]}],\"$L1c\"]}]}]}],\"$L1d\"]}]\n4:[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L10\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L12\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]\n5:[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L10\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L12\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]\n6:[\"$\",\"$1\",\"c\",{\"children\":[\"$L1e\",null,[\"$\",\"$L1f\",null,{\"children\":[\"$\",\"$20\",null,{\"name\":\"Next.MetadataOutlet\",\"children\":\"$@21\"}]}]]}]\n7:[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$L22\",null,{\"children\":\"$L23\"}],[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$L24\",null,{\"children\":[\"$\",\"$20\",null,{\"name\":\"Next.Metadata\",\"children\":\"$L25\"}]}]}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}]\n9:[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/39hg78l-l1d11.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]\na:[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/2nb_0e-0-b1-z.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]\n26:I[522016,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"\"]\n27:I[712404,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"DeferredGlobals\"]\n28:I[476301,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"TrackingScripts\"]\n15:[\"$\",\"li\",\"https://ai101.atmarketing.tw/tools/day-2-2026?utm_source=ecom\u0026utm_medium=footer_highlight\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://ai101.atmarketing.tw/tools/day-2-2026?utm_source=ecom\u0026utm_medium=footer_highlight\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors block\",\"children\":[\"→ \",\"2026 行銷年度行事曆\"]}]}]\n16:[\"$\",\"li\",\"https://ai101.atmarketing.tw/workflow?utm_source=ecom\u0026utm_medium=footer_highlight\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://ai101.atmarketing.tw/workflow?utm_source=ecom\u0026utm_medium=footer_highlight\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors block\",\"children\":[\"→ \",\"AI 工作流程拆解\"]}]}]\n17:[\"$\",\"li\",\"https://ai101.atmarketing.tw/contract?utm_source=ecom\u0026utm_medium=footer_highlight\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://ai101.atmarketing.tw/contract?utm_source=ecom\u0026utm_medium=footer_highlight\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors block\",\"children\":[\"→ \",\"合約風險快篩\"]}]}]\n18:[\"$\",\"li\",null,{\"className\":\"pt-1\",\"children\":[\"$\",\"a\",null,{\"href\":\"https://ai101.atmarketing.tw/?utm_source=ecom\u0026utm_medium=footer_more\",\"className\":\"text-xs text-brand hover:underline font-medium\",\"children\":\"看全部 101 個 AI 工具 →\"}]}]\n19:[\"$\",\"div\",null,{\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary\",\"children\":\"📦 電商營運工具箱\"}],[\"$\",\"p\",null,{\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary leading-relaxed mb-3\",\"children\":[201,\" 個 AI 驅動的免費電商營運工具，由何佳勳製作，給每位台灣電商人。\"]}],[\"$\",\"ul\",null,{\"className\":\"space-y-1 text-xs\",\"children\":[[\"$\",\"li\",null,{\"children\":[\"$\",\"$L26\",null,{\"href\":\"/terms\",\"className\":\"text-text-muted hover:text-brand\",\"children\":\"服務條款\"}]}],[\"$\",\"li\",null,{\"children\":[\"$\",\"$L26\",null,{\"href\":\"/privacy\",\"className\":\"text-text-muted hover:text-brand\",\"children\":\"隱私權政策\"}]}],[\"$\",\"li\",null,{\"children\":[\"$\",\"$L26\",null,{\"href\":\"/refund\",\"className\":\"text-text-muted hover:text-brand\",\"children\":\"退款政策\"}]}],[\"$\",\"li\",null,{\"children\":[\"$\",\"$L26\",null,{\"href\":\"/support\",\"className\":\"text-text-muted hover:text-brand\",\"children\":\"客服支援\"}]}],[\"$\",\"li\",null,{\"children\":[\"$\",\"$L26\",null,{\"href\":\"/feedback\",\"className\":\"text-text-muted hover:text-brand\",\"children\":\"💬 回報問題\"}]}],[\"$\",\"li\",null,{\"children\":[\"$\",\"$L26\",null,{\"href\":\"/about\",\"className\":\"text-text-muted hover:text-brand\",\"children\":\"關於\"}]}]]}]]}]\n1a:[\"$\",\"div\",null,{\"className\":\"mt-6 pt-6 border-t border-border\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary\",\"children\":\"🔗 主站熱門主題（存起來對照）\"}],[\"$\",\"div\",null,{\"className\":\"grid grid-cols-2 md:grid-cols-3 gap-2\",\"children\":[[[\"$\",\"a\",\"https://atmarketing.tw/hub/ai-agent/?utm_source=ecom\u0026utm_medium=footer_hub\",{\"href\":\"https://atmarketing.tw/hub/ai-agent/?utm_source=ecom\u0026utm_medium=footer_hub\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors\",\"children\":[\"→ \",\"AI Agent 完整指南\",\" \",[\"$\",\"span\",null,{\"className\":\"text-text-muted\",\"children\":[\"(\",\"15 篇\",\")\"]}]]}],[\"$\",\"a\",\"https://atmarketing.tw/hub/dtc-brands/?utm_source=ecom\u0026utm_medium=footer_hub\",{\"href\":\"https://atmarketing.tw/hub/dtc-brands/?utm_source=ecom\u0026utm_medium=footer_hub\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors\",\"children\":[\"→ \",\"DTC 品牌完整指南\",\" \",[\"$\",\"span\",null,{\"className\":\"text-text-muted\",\"children\":[\"(\",\"10 篇\",\")\"]}]]}],[\"$\",\"a\",\"https://atmarketing.tw/hub/ai-coding/?utm_source=ecom\u0026utm_medium=footer_hub\",{\"href\":\"https://atmarketing.tw/hub/ai-coding/?utm_source=ecom\u0026utm_medium=footer_hub\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors\",\"children\":[\"→ \",\"AI Coding 工具指南\",\" \",[\"$\",\"span\",null,{\"className\":\"text-text-muted\",\"children\":[\"(\",\"10 篇\",\")\"]}]]}],[\"$\",\"a\",\"https://atmarketing.tw/hub/subscription-model/?utm_source=ecom\u0026utm_medium=footer_hub\",{\"href\":\"https://atmarketing.tw/hub/subscription-model/?utm_source=ecom\u0026utm_medium=footer_hub\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors\",\"children\":[\"→ \",\"訂閱制商業模式\",\" \",[\"$\",\"span\",null,{\"className\":\"text-text-muted\",\"children\":[\"(\",\"6 篇\",\")\"]}]]}],[\"$\",\"a\",\"https://atmarketing.tw/hub/brand-rise-fall/?utm_source=ecom\u0026utm_medium=footer_hub\",{\"href\":\"https://atmarketing.tw/hub/brand-rise-fall/?utm_source=ecom\u0026utm_medium=footer_hub\",\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary hover:text-brand transition-colors\",\"children\":[\"→ \",\"品牌興衰案例\",\" \",[\"$\",\"span\",null,{\"className\":\"text-text-muted\",\"children\":[\"(\",\"5 篇\",\")\"]}]]}]],[\"$\",\"a\",null,{\"href\":\"https://atmarketing.tw/articles/?utm_source=ecom\u0026utm_medium=footer_hub\",\"className\":\"text-xs text-brand hover:underline font-medium\",\"children\":\"全部 250+ 篇專欄 →\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"1b:[\"$\",\"div\",null,{\"className\":\"mt-8 pt-6 border-t border-border text-center\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-xs text-text-muted\",\"children\":[\"© 2026 圭話行銷 · 由 \",[\"$\",\"a\",null,{\"href\":\"https://atmarketing.tw/?utm_source=ecom\u0026utm_medium=footer_copyright\",\"className\":\"hover:text-brand\",\"children\":\"何佳勳\"}],\" 主理 · 找工具請看 \",[\"$\",\"a\",null,{\"href\":\"https://ai101.atmarketing.tw/?utm_source=ecom\u0026utm_medium=footer_copyright\",\"className\":\"text-brand hover:underline\",\"children\":\"AI101 挑戰\"}]]}]}]\n1c:[\"$\",\"$L27\",null,{}]\n1d:[\"$\",\"$L28\",null,{}]\n29:T268d,{\"@context\":\"https://schema.org\",\"@type\":\"Article\",\"@id\":\"https://ecom.atmarketing.tw/blog/how-to-use-og-preview\",\"headline\":\"貼連結到 LINE 群卻沒圖沒描述？發文前先把分享卡片看清楚\",\"description\":\"OG / Meta Tag 預覽器使用教學。把標題、描述、圖片網址填一填，就能同時看到連結分享到 Facebook、LINE、Twitter/X 和 Google 搜尋結果長什麼樣子，字數自動檢查會不會被截斷，最後一鍵複製整份 meta tags 貼進網頁。純瀏覽器本機運算，不上傳、不耗 AI 額度。\",\"datePublished\":\"2026-07-25\",\"dateModified\":\"2026-07-25\",\"about\":{\"@id\":\"https://ecom.atmarketing.tw/title-scorer#software\"},\"mentions\":[{\"@type\":\"SoftwareApplication\",\"@id\":\"https://ecom.atmarketing.tw/title-scorer#software\",\"name\":\"商品標題 SEO 評分器\",\"url\":\"https://ecom.atmarketing.tw/title-scorer\"},{\"@type\":\"SoftwareApplication\",\"@id\":\"https://ecom.atmarketing.tw/social-post#software\",\"name\":\"社群貼文產生器\",\"url\":\"https://ecom.atmarketing.tw/social-post\"},{\"@type\":\"SoftwareApplication\",\"@id\":\"https://ecom.atmarketing.tw/link-tracker#software\",\"name\":\"短連結追蹤器\",\"url\":\"https://ecom.atmarketing.tw/link-tracker\"}],\"author\":{\"@type\":\"Person\",\"name\":\"何佳勳\",\"url\":\"https://ai.atmarketing.tw\",\"jobTitle\":\"電商行銷顧問\",\"sameAs\":[\"https://atmarketing.tw\",\"https://www.threads.net/@chia.hsun301\"]},\"publisher\":{\"@type\":\"Organization\",\"name\":\"電商營運工具箱\",\"url\":\"https://ecom.atmarketing.tw\"},\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://ecom.atmarketing.tw/blog/how-to-use-og-preview\"},\"image\":\"https://ecom.atmarketing.tw/api/og?title=%E8%B2%BC%E9%80%A3%E7%B5%90%E5%88%B0%20LINE%20%E7%BE%A4%E5%8D%BB%E6%B2%92%E5%9C%96%E6%B2%92%E6%8F%8F%E8%BF%B0%EF%BC%9F%E7%99%BC%E6%96%87%E5%89%8D%E5%85%88%E6%8A%8A%E5%88%86%E4%BA%AB%E5%8D%A1%E7%89%87%E7%9C%8B%E6%B8%85%E6%A5%9A\u0026icon=%F0%9F%91%80\",\"articleBody\":\"你花三小時寫好一篇商品頁，興沖沖把連結貼進 LINE 群組推廣，結果跳出來的是一片灰底、沒有圖、標題還是那串「首頁 - 未命名商店」。這條連結在群組裡自動廢了一半，因為沒有人會點一個看起來像垃圾訊息的東西。\\n分享卡片就是連結的門面。同一條網址，貼到 Facebook、LINE、Twitter/X、丟進 Google 搜尋結果，長出來的樣子完全不一樣，字數上限也各自不同。你在瀏覽器打開網頁看得好好的，不代表它被分享出去時也好看。\\n真正決定分享卡片長相的，是網頁 \u003chead\u003e 裡那幾行 Open Graph 和 meta 標籤。問題是這些標籤藏在原始碼裡，改完要重新部署、清快取、再用平台的偵錯工具驗證，一輪跑下來半小時就沒了。這個工具讓你在寫進網頁之前，就先把四個平台的樣子一次看清楚。\\n它做兩件事：即時預覽，加上產生 meta tags。\\n你在左邊填五個欄位，右邊就同步畫出分享卡片：\\n頁面標題（title）：分享出去最上面那行粗體字\\n描述（description）：標題底下那段說明文字\\n網址（url）：卡片顯示的網域，也會寫進 canonical\\n圖片網址（og:image）：卡片那張大圖的來源連結\\n網站名稱（og:site_name）：LINE、Facebook 卡片上顯示的來源站名\\n上方可以切換 Facebook、LINE、Twitter/X、Google 四個分頁，每切一個，字數檢查的上限就跟著換。標題和描述欄位旁邊會即時顯示「目前字數 / 該平台上限」加上紅綠燈：綠色代表安全，黃色代表可能被截斷，紅色代表一定超出。\\n各平台的實際上限差很多。標題部分，LINE 大約 50 字、Facebook 和 Google 約 60 字、Twitter/X 約 70 字；描述部分 LINE 只有約 80 字、Facebook 和 Google 約 155 字、Twitter/X 約 200 字。LINE 是最嚴格的，你在 Facebook 看起來剛好的描述，貼到 LINE 群很可能被切一半。\\n填完之後，工具會自動組好一整份 meta tags，包含 \u003ctitle\u003e、description、canonical、Open Graph 那一組（Facebook 和 LINE 共用）、還有 Twitter Card 那一組，按一下就複製，直接貼進網頁的 \u003chead\u003e 就好。全程在你瀏覽器裡跑，沒有上傳、沒有呼叫 AI。\\n步驟 1：填標題和描述，四個平台都切一輪\\n先填標題和描述。填的時候不要只看一個平台，把上方四個分頁都點一遍，看紅綠燈的變化。\\n重點看 LINE。因為 LINE 的字數上限最短，只要你的東西主要靠 LINE 群或 LINE 官方帳號推，就以 LINE 的綠燈為準來寫。把最重要的賣點、數字、活動關鍵字塞在標題前 20 個字，就算被截斷也還讀得懂。\\n不知道怎麼下手可以先點右上角「載入範例」，它會帶入一組手作蠟燭的完整資料，照著改成你自己的最快。\\n步驟 2：補上圖片網址、網址、網站名稱\\nog:image 是分享卡片最搶眼的部分。填一個已經上線、公開可存取的圖片網址，建議 1200 × 630 的比例，太小或比例不對，平台會裁切或乾脆不顯示。圖片還沒做好的話，範例裡那串 ecom.atmarketing.tw/api/og 的網址就是一個動態生成 OG 圖的做法，可以參考。\\n網址填商品頁或活動頁的完整網址，網站名稱填你的品牌名，這兩個會讓卡片看起來更像正規來源，而不是可疑連結。\\n步驟 3：確認預覽、複製 meta tags 貼進網頁\\n右邊四個平台的卡片都確認過、標題描述都是綠燈之後，找到 meta tags 那一區，按複製，貼進你網頁的 \u003chead\u003e 裡（如果是 Shopify、Shopline 這類平台，就貼進後台的 SEO 或自訂 header 欄位）。\\n貼完部署上線後，用各平台的官方偵錯工具強制刷新一次快取（Facebook 分享偵錯工具、LINE 也有類似的），因為平台會把舊的卡片存起來，不刷新它會一直顯示舊樣子。\\n標題把品牌名放後面。「有機手作蠟燭溫暖生活」比「溫暖生活有機手作蠟燭」好，因為被截斷時，前面的商品關鍵字比品牌名重要，也對 Google 搜尋結果的點擊更有利。\\n描述不要重複標題。標題已經講過的東西，描述就別再說一次。描述拿來補上標題塞不下的資訊：規格、活動、限時優惠、或一句勾起好奇的話。\\n以 LINE 為底線寫，其他平台自然過關。因為 LINE 字數最短，只要標題描述在 LINE 是綠燈，貼到 Facebook、Twitter/X 幾乎一定安全。反過來以 Twitter 為準寫就會在 LINE 爆掉。\\nog:image 一定要是絕對網址。要用 https:// 開頭的完整網址，不能用 /images/xxx.jpg 這種相對路徑，平台抓不到相對路徑，卡片就沒圖。\\n同一張圖在不同平台會有不同裁切。 Twitter 的 summary_large_image 和 Facebook 的比例略有差異，重要文字和主體不要壓在圖的最邊緣，留一點安全邊界，四個平台看起來才都完整。\\n情境 A：新商品上架前先驗一次分享卡片\\n商品頁做好、還沒開始推之前，把標題、描述、商品主圖網址填進來，切到 LINE 分頁確認描述沒被切、切到 Facebook 確認圖有出來。全綠再複製 meta tags 貼進商品頁。這樣第一批貼到社群的連結就是漂亮的，不會白白浪費第一波觸及。\\n情境 B：檔期活動頁，同一條連結要發四個平台\\n雙 11 活動頁要同時發 FB 貼文、LINE 群、Twitter/X。用這個工具把四個平台的卡片一次看完，確認每個平台的活動關鍵字（例如「全館 5 折」）都在被截斷之前就出現。一條連結四個平台都好看，省下各平台分開測的時間。\\n情境 C：舊頁面分享出去很醜，來抓問題\\n有人回報你的連結貼到 LINE 沒有圖。把那個頁面現有的標題、描述、圖片網址填進來重現一次，通常會發現兩種問題之一：og:image 填的是相對路徑（換成絕對網址就好），或是描述在 LINE 上限之內卻在別的地方被截。用預覽對照就能快速定位，改完再複製新的 meta tags 覆蓋上去。\\n分享卡片是連結的門面，但門面只負責讓人願意點。點進去之後能不能轉換、點擊有沒有被追蹤到，是另外兩件事。\\n標題還想再打磨的話，把它丟進商品標題 SEO 評分器，看關鍵字布局和字數結構在搜尋端有沒有加分空間，跟這裡的分享卡片相輔相成，一個顧搜尋、一個顧社群。\\n四個平台的貼文本體還沒寫的話，用社群貼文產生器一次生出四平台版本，貼文配上這裡調好的分享卡片，整套推廣素材就齊了。\\n連結發出去之後想知道哪個平台帶來的點擊最多，把網址先過一次短連結追蹤器再發，就能看到即時點擊統計，回頭驗證哪個平台的卡片真的比較會被點。\",\"wordCount\":2831,\"inLanguage\":\"zh-TW\",\"speakable\":{\"@type\":\"SpeakableSpecification\",\"cssSelector\":[\".article-headline\",\".article-description\"]},\"hasPart\":[{\"@type\":\"WebPageElement\",\"name\":\"為什麼一條連結貼出去的樣子這麼重要\",\"url\":\"https://ecom.atmarketing.tw/blog/how-to-use-og-preview#why\"},{\"@type\":\"WebPageElement\",\"name\":\"這個工具實際上在做什麼\",\"url\":\"https://ecom.atmarketing.tw/blog/how-to-use-og-preview#how-it-works\"},{\"@type\":\"WebPageElement\",\"name\":\"三步驟做出一張不漏氣的分享卡片\",\"url\":\"https://ecom.atmarketing.tw/blog/how-to-use-og-preview#step-by-step\"},{\"@type\":\"WebPageElement\",\"name\":\"幾個讓卡片點擊率更高的細節\",\"url\":\"https://ecom.atmarketing.tw/blog/how-to-use-og-preview#tips\"},{\"@type\":\"WebPageElement\",\"name\":\"三個實際用得到的情境\",\"url\":\"https://ecom.atmarketing.tw/blog/how-to-use-og-preview#use-cases\"},{\"@type\":\"WebPageElement\",\"name\":\"卡片做好之後，接著做這些\",\"url\":\"https://ecom.atmarketing.tw/blog/how-to-use-og-preview#next-steps\"}]}3c:I[27201,[\"/_next/static/chunks/2mp2egrhlx07g.js\",\"/_next/static/chunks/08-6tju2xqt77.js\",\"/_next/static/chunks/3fj3c32j4byqm.js\",\"/_next/static/chunks/02hskp1zrtqx4.js\",\"/_next/static/chunks/0015b3va-_e6a.js\"],\"IconMark\"]\n1e:[[[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"$29\"}}],\"$L2a\",\"$L2b\"],\"$L2c\"]\n2a:[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@type\\\":\\\"FAQPage\\\",\\\"mainEntity\\\":[{\\\"@type\\\":\\\"Question\\\",\\\"name\\\":\\\"這個工具會消耗 AI 額度或上傳我的資料嗎？\\\",\\\"acceptedAnswer\\\":{\\\"@type\\\":\\\"Answer\\\",\\\"text\\\":\\\"不會。標題、描述、圖片網址、預覽全部在你的瀏覽器本機即時運算，不上傳到任何伺服器、不呼叫 AI、不消耗額度，免費無限次使用。你填的內容關掉分頁就沒了，不會被儲存。\\\"}},{\\\"@type\\\":\\\"Question\\\",\\\"name\\\":\\\"為什麼同一段描述在 Facebook 顯示正常，在 LINE 卻被切掉？\\\",\\\"acceptedAnswer\\\":{\\\"@type\\\":\\\"Answer\\\",\\\"text\\\":\\\"因為各平台的字數上限不同。LINE 的描述上限最短（約 80 字），Facebook 和 Google 約 155 字。所以你在 Facebook 看剛好的描述，貼到 LINE 就可能超出被截斷。切到工具的 LINE 分頁看紅綠燈，以 LINE 為底線寫最保險。\\\"}},{\\\"@type\\\":\\\"Question\\\",\\\"name\\\":\\\"我複製了 meta tags 貼進網頁，為什麼分享出來還是舊的樣子？\\\",\\\"acceptedAnswer\\\":{\\\"@type\\\":\\\"Answer\\\",\\\"text\\\":\\\"平台會把分享卡片快取起來，改完標籤後它可能還顯示舊版。要用各平台的官方偵錯工具（例如 Facebook 分享偵錯工具）強制重新抓取一次，快取刷新後就會顯示新卡片。這一步跟工具本身無關，是平台快取機制。\\\"}},{\\\"@type\\\":\\\"Question\\\",\\\"name\\\":\\\"og:image 該用多大的圖？填了為什麼卡片沒出現圖片？\\\",\\\"acceptedAnswer\\\":{\\\"@type\\\":\\\"Answer\\\",\\\"text\\\":\\\"建議用 1200 × 630 像素、比例 1.91:1 的圖，太小或比例不對會被裁切或不顯示。沒出圖最常見的兩個原因：一是填了相對路徑（要用 https:// 開頭的絕對完整網址），二是圖片網址沒有公開、平台抓不到。兩者排除通常就會正常。\\\"}}]}\"}}]\n2b:[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@type\\\":\\\"BreadcrumbList\\\",\\\"itemListElement\\\":[{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":1,\\\"name\\\":\\\"首頁\\\",\\\"item\\\":\\\"https://ecom.atmarketing.tw\\\"},{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":2,\\\"name\\\":\\\"知識庫\\\",\\\"item\\\":\\\"https://ecom.atmarketing.tw/blog\\\"},{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":3,\\\"name\\\":\\\"貼連結到 LINE 群卻沒圖沒描述？發文前先把分享卡片看清楚\\\",\\\"item\\\":\\\"https://ecom.atmarketing.tw/blog/how-to-use-og-preview\\\"}]}\"}}]\n2c:[\"$\",\"div\",null,{\"className\":\"max-w-7xl mx-auto px-4 py-8\",\"children\":[[\"$\",\"nav\",null,{\"className\":\"mb-6 text-sm text-text-secondary dark:text-text-dark-secondary\",\"children\":[[\"$\",\"$L26\",null,{\"href\":\"/\",\"className\":\"hover:text-accent transition\",\"children\":\"首頁\"}],[\"$\",\"span\",null,{\"className\":\"mx-2\",\"children\":\"/\"}],[\"$\",\"$L26\",null,{\"href\":\"/blog\",\"className\":\"hover:text-accent transition\",\"children\":\"知識庫\"}],[\"$\",\"span\",null,{\"className\":\"mx-2\",\"children\":\"/\"}],[\"$\",\"span\",null,{\"className\":\"text-text-primary dark:text-text-dark-primary\",\"children\":\"貼連結到 LINE 群卻沒圖沒描述？發文前先把分享卡片看清楚\"}]]}],[\"$\",\"div\",null,{\"className\":\"flex flex-col lg:flex-row gap-8\",\"children\":[[\"$\",\"article\",null,{\"className\":\"flex-1 min-w-0\",\"children\":[[\"$\",\"header\",null,{\"className\":\"mb-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center gap-3 mb-4 flex-wrap\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-xs px-2.5 py-1 rounded-full font-medium bg-cyan-100 text-cyan-700 dark:bg-cyan-900/30 dark:text-cyan-300\",\"children\":\"轉換優化\"}],[\"$\",\"time\",null,{\"className\":\"text-sm text-text-secondary dark:text-text-dark-secondary\",\"dateTime\":\"2026-07-25\",\"children\":\"2026-07-25\"}],\"$undefined\",[\"$\",\"span\",null,{\"className\":\"text-sm text-text-secondary dark:text-text-dark-secondary\",\"children\":\"6 分鐘\"}]]}],[\"$\",\"div\",null,{\"className\":\"flex items-center gap-2 mb-4 text-sm text-text-secondary dark:text-text-dark-secondary\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"✍️\"}],[\"$\",\"span\",null,{\"children\":[\"作者:\",[\"$\",\"a\",null,{\"href\":\"https://ai.atmarketing.tw\",\"target\":\"_blank\",\"rel\":\"noopener\",\"className\":\"font-medium text-text-primary dark:text-text-dark-primary hover:text-accent transition\",\"children\":\"何佳勳\"}],[\"$\",\"span\",null,{\"className\":\"mx-1\",\"children\":\"·\"}],\"電商行銷顧問,十多年電商操盤與 AI 工具實戰\"]}]]}],[\"$\",\"h1\",null,{\"className\":\"article-headline text-2xl md:text-3xl font-bold leading-tight text-text-primary dark:text-text-dark-primary\",\"children\":[\"👀\",\" \",\"貼連結到 LINE 群卻沒圖沒描述？發文前先把分享卡片看清楚\"]}],[\"$\",\"p\",null,{\"className\":\"article-description mt-3 text-text-secondary dark:text-text-dark-secondary leading-relaxed\",\"children\":\"OG / Meta Tag 預覽器使用教學。把標題、描述、圖片網址填一填，就能同時看到連結分享到 Facebook、LINE、Twitter/X 和 Google 搜尋結果長什麼樣子，字數自動檢查會不會被截斷，最後一鍵複製整份 meta tags 貼進網頁。純瀏覽器本機運算，不上傳、不耗 AI 額度。\"}]]}],[\"$\",\"div\",null,{\"className\":\"space-y-0\",\"children\":[[\"$\",\"section\",\"why\",{\"id\":\"why\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50\",\"children\":\"為什麼一條連結貼出去的樣子這麼重要\"}],[[\"$\",\"p\",\"p-0\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"你花三小時寫好一篇商品頁，興沖沖把連結貼進 LINE 群組推廣，結果跳出來的是一片灰底、沒有圖、標題還是那串「首頁 - 未命名商店」。這條連結在群組裡自動廢了一半，因為沒有人會點一個看起來像垃圾訊息的東西。\"}}],[\"$\",\"p\",\"p-1\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"分享卡片就是連結的門面。同一條網址，貼到 Facebook、LINE、Twitter/X、丟進 Google 搜尋結果，長出來的樣子完全不一樣，字數上限也各自不同。你在瀏覽器打開網頁看得好好的，不代表它被分享出去時也好看。\"}}],[\"$\",\"p\",\"p-2\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"真正決定分享卡片長相的，是網頁 \u003ccode class=\\\"px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono\\\"\u003e\u003chead\u003e\u003c/code\u003e 裡那幾行 Open Graph 和 meta 標籤。問題是這些標籤藏在原始碼裡，改完要重新部署、清快取、再用平台的偵錯工具驗證，一輪跑下來半小時就沒了。這個工具讓你在寫進網頁之前，就先把四個平台的樣子一次看清楚。\"}}]],false]}],[\"$\",\"section\",\"how-it-works\",{\"id\":\"how-it-works\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50\",\"children\":\"這個工具實際上在做什麼\"}],[[\"$\",\"p\",\"p-0\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"它做兩件事：即時預覽，加上產生 meta tags。\"}}],[\"$\",\"p\",\"p-1\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"你在左邊填五個欄位，右邊就同步畫出分享卡片：\"}}],\"$L2d\",\"$L2e\",\"$L2f\",\"$L30\"],\"$L31\"]}],\"$L32\",\"$L33\",\"$L34\",\"$L35\"]}],\"$L36\",\"$L37\",\"$L38\"]}],\"$L39\"]}]]}]\n"])</script><script>self.__next_f.push([1,"2d:[\"$\",\"ul\",\"list-2\",{\"className\":\"list-disc pl-6 space-y-1.5 my-4 text-text-secondary dark:text-text-dark-secondary\",\"children\":[[\"$\",\"li\",\"0\",{\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e頁面標題（title）\u003c/strong\u003e：分享出去最上面那行粗體字\"}}],[\"$\",\"li\",\"1\",{\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e描述（description）\u003c/strong\u003e：標題底下那段說明文字\"}}],[\"$\",\"li\",\"2\",{\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e網址（url）\u003c/strong\u003e：卡片顯示的網域，也會寫進 canonical\"}}],[\"$\",\"li\",\"3\",{\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e圖片網址（og:image）\u003c/strong\u003e：卡片那張大圖的來源連結\"}}],[\"$\",\"li\",\"4\",{\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e網站名稱（og:site_name）\u003c/strong\u003e：LINE、Facebook 卡片上顯示的來源站名\"}}]]}]\n2e:[\"$\",\"p\",\"p-3\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"上方可以切換 Facebook、LINE、Twitter/X、Google 四個分頁，每切一個，字數檢查的上限就跟著換。標題和描述欄位旁邊會即時顯示「目前字數 / 該平台上限」加上紅綠燈：綠色代表安全，黃色代表可能被截斷，紅色代表一定超出。\"}}]\n2f:[\"$\",\"p\",\"p-4\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"各平台的實際上限差很多。標題部分，LINE 大約 50 字、Facebook 和 Google 約 60 字、Twitter/X 約 70 字；描述部分 LINE 只有約 80 字、Facebook 和 Google 約 155 字、Twitter/X 約 200 字。LINE 是最嚴格的，你在 Facebook 看起來剛好的描述，貼到 LINE 群很可能被切一半。\"}}]\n30:[\"$\",\"p\",\"p-5\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"填完之後，工具會自動組好一整份 meta tags，包含 \u003ccode class=\\\"px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono\\\"\u003e\u003ctitle\u003e\u003c/code\u003e、\u003ccode class=\\\"px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono\\\"\u003edescription\u003c/code\u003e、canonical、Open Graph 那一組（Facebook 和 LINE 共用）、還有 Twitter Card 那一組，按一下就複製，直接貼進網頁的 \u003ccode class=\\\"px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono\\\"\u003e\u003chead\u003e\u003c/code\u003e 就好。全程在你瀏覽器裡跑，沒有上傳、沒有呼叫 AI。\"}}]\n31:[\"$\",\"div\",null,{\"className\":\"my-8 p-5 rounded-2xl border border-accent/30 bg-accent/5\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-bold text-sm mb-2\",\"children\":\"想要實際操作看看？\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-wrap gap-2\",\"children\":[[\"$\",\"$L26\",\"title-scorer\",{\"href\":\"/title-scorer\",\"className\":\"inline-flex items-center gap-1.5 text-sm px-4 py-2 rounded-full bg-accent text-white hover:bg-accent-light transition font-medium\",\"children\":[\"試試 \",\"商品標題 SEO 評分器\",\" →\"]}],[\"$\",\"$L26\",\"social-post\",{\"href\":\"/social-post\",\"className\":\"inline-flex items-center gap-1.5 text-sm px-4 py-2 rounded-full bg-accent text-white hover:bg-accent-light transition font-medium\",\"children\":[\"試試 \",\"社群貼文產生器\",\" →\"]}],[\"$\",\"$L26\",\"link-tracker\",{\"href\":\"/link-tracker\",\"className\":\"inline-flex items-center gap-1.5 text-sm px-4 py-2 rounded-full bg-accent text-white hover:bg-accent-light transition font-medium\",\"children\":[\"試試 \",\"短連結追蹤器\",\" →\"]}]]}]]}]\n32:[\"$\",\"section\",\"step-by-step\",{\"id\":\"step-by-step\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50\",\"children\":\"三步驟做出一張不漏氣的分享卡片\"}],[[\"$\",\"h3\",\"h4-0\",{\"className\":\"font-bold text-text-primary dark:text-text-dark-primary mt-6 mb-2\",\"children\":\"步驟 1：填標題和描述，四個平台都切一輪\"}],[\"$\",\"p\",\"p-1\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"先填標題和描述。填的時候不要只看一個平台，把上方四個分頁都點一遍，看紅綠燈的變化。\"}}],[\"$\",\"p\",\"p-2\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"重點看 LINE。因為 LINE 的字數上限最短，只要你的東西主要靠 LINE 群或 LINE 官方帳號推，就以 LINE 的綠燈為準來寫。把最重要的賣點、數字、活動關鍵字塞在標題前 20 個字，就算被截斷也還讀得懂。\"}}],[\"$\",\"p\",\"p-3\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"不知道怎麼下手可以先點右上角「載入範例」，它會帶入一組手作蠟燭的完整資料，照著改成你自己的最快。\"}}],[\"$\",\"h3\",\"h4-4\",{\"className\":\"font-bold text-text-primary dark:text-text-dark-primary mt-6 mb-2\",\"children\":\"步驟 2：補上圖片網址、網址、網站名稱\"}],[\"$\",\"p\",\"p-5\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"og:image 是分享卡片最搶眼的部分。填一個已經上線、公開可存取的圖片網址，建議 1200 × 630 的比例，太小或比例不對，平台會裁切或乾脆不顯示。圖片還沒做好的話，範例裡那串 \u003ccode class=\\\"px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono\\\"\u003eecom.atmarketing.tw/api/og\u003c/code\u003e 的網址就是一個動態生成 OG 圖的做法，可以參考。\"}}],[\"$\",\"p\",\"p-6\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"網址填商品頁或活動頁的完整網址，網站名稱填你的品牌名，這兩個會讓卡片看起來更像正規來源，而不是可疑連結。\"}}],[\"$\",\"h3\",\"h4-7\",{\"className\":\"font-bold text-text-primary dark:text-text-dark-primary mt-6 mb-2\",\"children\":\"步驟 3：確認預覽、複製 meta tags 貼進網頁\"}],[\"$\",\"p\",\"p-8\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"右邊四個平台的卡片都確認過、標題描述都是綠燈之後，找到 meta tags 那一區，按複製，貼進你網頁的 \u003ccode class=\\\"px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono\\\"\u003e\u003chead\u003e\u003c/code\u003e 裡（如果是 Shopify、Shopline 這類平台，就貼進後台的 SEO 或自訂 header 欄位）。\"}}],[\"$\",\"p\",\"p-9\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"貼完部署上線後，用各平台的官方偵錯工具強制刷新一次快取（Facebook 分享偵錯工具、LINE 也有類似的），因為平台會把舊的卡片存起來，不刷新它會一直顯示舊樣子。\"}}]],false]}]\n33:[\"$\",\"section\",\"tips\",{\"id\":\"tips\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50\",\"children\":\"幾個讓卡片點擊率更高的細節\"}],[[\"$\",\"p\",\"p-0\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e標題把品牌名放後面。\u003c/strong\u003e 「有機手作蠟燭 | 溫暖生活」比「溫暖生活 | 有機手作蠟燭」好，因為被截斷時，前面的商品關鍵字比品牌名重要，也對 Google 搜尋結果的點擊更有利。\"}}],[\"$\",\"p\",\"p-1\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e描述不要重複標題。\u003c/strong\u003e 標題已經講過的東西，描述就別再說一次。描述拿來補上標題塞不下的資訊：規格、活動、限時優惠、或一句勾起好奇的話。\"}}],[\"$\",\"p\",\"p-2\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e以 LINE 為底線寫，其他平台自然過關。\u003c/strong\u003e 因為 LINE 字數最短，只要標題描述在 LINE 是綠燈，貼到 Facebook、Twitter/X 幾乎一定安全。反過來以 Twitter 為準寫就會在 LINE 爆掉。\"}}],[\"$\",\"p\",\"p-3\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003eog:image 一定要是絕對網址。\u003c/strong\u003e 要用 \u003ccode class=\\\"px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono\\\"\u003ehttps://\u003c/code\u003e 開頭的完整網址，不能用 \u003ccode class=\\\"px-1.5 py-0.5 rounded bg-surface-alt dark:bg-surface-dark-alt text-accent text-sm font-mono\\\"\u003e/images/xxx.jpg\u003c/code\u003e 這種相對路徑，平台抓不到相對路徑，卡片就沒圖。\"}}],[\"$\",\"p\",\"p-4\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e同一張圖在不同平台會有不同裁切。\u003c/strong\u003e Twitter 的 summary_large_image 和 Facebook 的比例略有差異，重要文字和主體不要壓在圖的最邊緣，留一點安全邊界，四個平台看起來才都完整。\"}}]],false]}]\n34:[\"$\",\"section\",\"use-cases\",{\"id\":\"use-cases\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50\",\"children\":\"三個實際用得到的情境\"}],[[\"$\",\"p\",\"p-0\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e情境 A：新商品上架前先驗一次分享卡片\u003c/strong\u003e\"}}],[\"$\",\"p\",\"p-1\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"商品頁做好、還沒開始推之前，把標題、描述、商品主圖網址填進來，切到 LINE 分頁確認描述沒被切、切到 Facebook 確認圖有出來。全綠再複製 meta tags 貼進商品頁。這樣第一批貼到社群的連結就是漂亮的，不會白白浪費第一波觸及。\"}}],[\"$\",\"p\",\"p-2\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e情境 B：檔期活動頁，同一條連結要發四個平台\u003c/strong\u003e\"}}],[\"$\",\"p\",\"p-3\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"雙 11 活動頁要同時發 FB 貼文、LINE 群、Twitter/X。用這個工具把四個平台的卡片一次看完，確認每個平台的活動關鍵字（例如「全館 5 折」）都在被截斷之前就出現。一條連結四個平台都好看，省下各平台分開測的時間。\"}}],[\"$\",\"p\",\"p-4\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"\u003cstrong class=\\\"text-text-primary dark:text-text-dark-primary font-semibold\\\"\u003e情境 C：舊頁面分享出去很醜，來抓問題\u003c/strong\u003e\"}}],[\"$\",\"p\",\"p-5\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"有人回報你的連結貼到 LINE 沒有圖。把那個頁面現有的標題、描述、圖片網址填進來重現一次，通常會發現兩種問題之一：og:image 填的是相對路徑（換成絕對網址就好），或是描述在 LINE 上限之內卻在別的地方被截。用預覽對照就能快速定位，改完再複製新的 meta tags 覆蓋上去。\"}}]],false]}]\n35:[\"$\",\"section\",\"next-steps\",{\"id\":\"next-steps\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-xl font-bold mt-10 mb-4 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50\",\"children\":\"卡片做好之後，接著做這些\"}],[[\"$\",\"p\",\"p-0\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"分享卡片是連結的門面，但門面只負責讓人願意點。點進去之後能不能轉換、點擊有沒有被追蹤到，是另外兩件事。\"}}],[\"$\",\"p\",\"p-1\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"標題還想再打磨的話，把它丟進\u003ca href=\\\"/title-scorer\\\" class=\\\"text-accent hover:underline\\\"\u003e商品標題 SEO 評分器\u003c/a\u003e，看關鍵字布局和字數結構在搜尋端有沒有加分空間，跟這裡的分享卡片相輔相成，一個顧搜尋、一個顧社群。\"}}],[\"$\",\"p\",\"p-2\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"四個平台的貼文本體還沒寫的話，用\u003ca href=\\\"/social-post\\\" class=\\\"text-accent hover:underline\\\"\u003e社群貼文產生器\u003c/a\u003e一次生出四平台版本，貼文配上這裡調好的分享卡片，整套推廣素材就齊了。\"}}],[\"$\",\"p\",\"p-3\",{\"className\":\"my-4 leading-relaxed text-text-secondary dark:text-text-dark-secondary\",\"dangerouslySetInnerHTML\":{\"__html\":\"連結發出去之後想知道哪個平台帶來的點擊最多，把網址先過一次\u003ca href=\\\"/link-tracker\\\" class=\\\"text-accent hover:underline\\\"\u003e短連結追蹤器\u003c/a\u003e再發，就能看到即時點擊統計，回頭驗證哪個平台的卡片真的比較會被點。\"}}]],false]}]\n36:[\"$\",\"section\",null,{\"className\":\"mt-12\",\"id\":\"faq\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-xl font-bold mb-6 text-text-primary dark:text-text-dark-primary pb-2 border-b border-border/50 dark:border-border-dark/50\",\"children\":\"常見問題\"}],[\"$\",\"div\",null,{\"className\":\"space-y-4\",\"children\":[[\"$\",\"details\",\"0\",{\"className\":\"group rounded-2xl border border-border dark:border-border-dark overflow-hidden\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"cursor-pointer p-5 font-medium text-text-primary dark:text-text-dark-primary hover:bg-surface-alt dark:hover:bg-surface-dark-alt transition flex items-center justify-between\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"Q: \",\"這個工具會消耗 AI 額度或上傳我的資料嗎？\"]}],[\"$\",\"svg\",null,{\"className\":\"w-5 h-5 text-text-secondary dark:text-text-dark-secondary flex-shrink-0 transition-transform group-open:rotate-180\",\"fill\":\"none\",\"viewBox\":\"0 0 24 24\",\"stroke\":\"currentColor\",\"children\":[\"$\",\"path\",null,{\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"strokeWidth\":2,\"d\":\"M19 9l-7 7-7-7\"}]}]]}],[\"$\",\"div\",null,{\"className\":\"px-5 pb-5 text-text-secondary dark:text-text-dark-secondary leading-relaxed\",\"children\":\"不會。標題、描述、圖片網址、預覽全部在你的瀏覽器本機即時運算，不上傳到任何伺服器、不呼叫 AI、不消耗額度，免費無限次使用。你填的內容關掉分頁就沒了，不會被儲存。\"}]]}],[\"$\",\"details\",\"1\",{\"className\":\"group rounded-2xl border border-border dark:border-border-dark overflow-hidden\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"cursor-pointer p-5 font-medium text-text-primary dark:text-text-dark-primary hover:bg-surface-alt dark:hover:bg-surface-dark-alt transition flex items-center justify-between\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"Q: \",\"為什麼同一段描述在 Facebook 顯示正常，在 LINE 卻被切掉？\"]}],[\"$\",\"svg\",null,{\"className\":\"w-5 h-5 text-text-secondary dark:text-text-dark-secondary flex-shrink-0 transition-transform group-open:rotate-180\",\"fill\":\"none\",\"viewBox\":\"0 0 24 24\",\"stroke\":\"currentColor\",\"children\":[\"$\",\"path\",null,{\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"strokeWidth\":2,\"d\":\"M19 9l-7 7-7-7\"}]}]]}],[\"$\",\"div\",null,{\"className\":\"px-5 pb-5 text-text-secondary dark:text-text-dark-secondary leading-relaxed\",\"children\":\"因為各平台的字數上限不同。LINE 的描述上限最短（約 80 字），Facebook 和 Google 約 155 字。所以你在 Facebook 看剛好的描述，貼到 LINE 就可能超出被截斷。切到工具的 LINE 分頁看紅綠燈，以 LINE 為底線寫最保險。\"}]]}],[\"$\",\"details\",\"2\",{\"className\":\"group rounded-2xl border border-border dark:border-border-dark overflow-hidden\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"cursor-pointer p-5 font-medium text-text-primary dark:text-text-dark-primary hover:bg-surface-alt dark:hover:bg-surface-dark-alt transition flex items-center justify-between\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"Q: \",\"我複製了 meta tags 貼進網頁，為什麼分享出來還是舊的樣子？\"]}],[\"$\",\"svg\",null,{\"className\":\"w-5 h-5 text-text-secondary dark:text-text-dark-secondary flex-shrink-0 transition-transform group-open:rotate-180\",\"fill\":\"none\",\"viewBox\":\"0 0 24 24\",\"stroke\":\"currentColor\",\"children\":[\"$\",\"path\",null,{\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"strokeWidth\":2,\"d\":\"M19 9l-7 7-7-7\"}]}]]}],[\"$\",\"div\",null,{\"className\":\"px-5 pb-5 text-text-secondary dark:text-text-dark-secondary leading-relaxed\",\"children\":\"平台會把分享卡片快取起來，改完標籤後它可能還顯示舊版。要用各平台的官方偵錯工具（例如 Facebook 分享偵錯工具）強制重新抓取一次，快取刷新後就會顯示新卡片。這一步跟工具本身無關，是平台快取機制。\"}]]}],[\"$\",\"details\",\"3\",{\"className\":\"group rounded-2xl border border-border dark:border-border-dark overflow-hidden\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"cursor-pointer p-5 font-medium text-text-primary dark:text-text-dark-primary hover:bg-surface-alt dark:hover:bg-surface-dark-alt transition flex items-center justify-between\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"Q: \",\"og:image 該用多大的圖？填了為什麼卡片沒出現圖片？\"]}],[\"$\",\"svg\",null,{\"className\":\"w-5 h-5 text-text-secondary dark:text-text-dark-secondary flex-shrink-0 transition-transform group-open:rotate-180\",\"fill\":\"none\",\"viewBox\":\"0 0 24 24\",\"stroke\":\"currentColor\",\"children\":\"$L3a\"}]]}],\"$L3b\"]}]]}]]}]\n"])</script><script>self.__next_f.push([1,"37:[\"$\",\"div\",null,{\"className\":\"mt-12 p-8 rounded-2xl bg-gradient-to-r from-brand to-brand-light text-white text-center\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-xl font-bold mb-2\",\"children\":\"立即免費使用電商營運工具箱\"}],[\"$\",\"p\",null,{\"className\":\"text-white/80 text-sm mb-4\",\"children\":[201,\" 個 AI 驅動的電商工具，解決你每天最痛的營運問題\"]}],[\"$\",\"$L26\",null,{\"href\":\"/\",\"className\":\"inline-block px-8 py-3 rounded-full bg-white text-brand font-bold hover:bg-white/90 transition\",\"children\":\"開始使用 →\"}]]}]\n38:[\"$\",\"section\",null,{\"className\":\"mt-12\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-bold text-lg mb-4 text-text-primary dark:text-text-dark-primary\",\"children\":\"延伸閱讀\"}],[\"$\",\"div\",null,{\"className\":\"grid grid-cols-1 md:grid-cols-3 gap-4\",\"children\":[[\"$\",\"$L26\",\"how-to-use-image-alt-batch\",{\"href\":\"/blog/how-to-use-image-alt-batch\",\"className\":\"group p-5 rounded-2xl border border-border dark:border-border-dark hover:border-accent/50 transition\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-xs px-2 py-0.5 rounded-full font-medium bg-teal-100 text-teal-700 dark:bg-teal-900/30 dark:text-teal-300\",\"children\":\"轉換優化\"}],[\"$\",\"h4\",null,{\"className\":\"font-bold text-sm mt-2 group-hover:text-accent transition line-clamp-2\",\"children\":[\"🖼️\",\" \",\"商品圖沒補 alt 文字，等於把 Google 圖片搜尋的流量丟在門外\"]}],[\"$\",\"p\",null,{\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary mt-1 line-clamp-2\",\"children\":\"AI 圖像 Alt 批次產生使用教學。輸入商品名、描述與 1 到 10 張圖的場景，一次產出符合 Google 圖片 SEO 規範的 alt 文字表格，同時給 Product Schema、無障礙檢查與檔名優化建議，直接複製貼回 Shopify、SHOPLINE、商店街後台。\"}]]}],[\"$\",\"$L26\",\"how-to-use-og-image-maker\",{\"href\":\"/blog/how-to-use-og-image-maker\",\"className\":\"group p-5 rounded-2xl border border-border dark:border-border-dark hover:border-accent/50 transition\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-xs px-2 py-0.5 rounded-full font-medium bg-pink-100 text-pink-700 dark:bg-pink-900/30 dark:text-pink-300\",\"children\":\"轉換優化\"}],[\"$\",\"h4\",null,{\"className\":\"font-bold text-sm mt-2 group-hover:text-accent transition line-clamp-2\",\"children\":[\"🖼️\",\" \",\"貼文沒圖沒人點，開 Canva 又要十分鐘，這裡輸入標題就有分享圖\"]}],[\"$\",\"p\",null,{\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary mt-1 line-clamp-2\",\"children\":\"社群封面圖產生器使用教學。輸入主標題、副標題與品牌名，選一組風格配色，瀏覽器直接畫出 1200×630 的社群分享圖並下載 PNG，全程不上傳不耗 AI 額度。內含中文不爆版的字數抓法、六種配色怎麼挑，以及開團、活動、部落格三種實際用法。\"}]]}],[\"$\",\"$L26\",\"how-to-use-social-cover-maker\",{\"href\":\"/blog/how-to-use-social-cover-maker\",\"className\":\"group p-5 rounded-2xl border border-border dark:border-border-dark hover:border-accent/50 transition\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-xs px-2 py-0.5 rounded-full font-medium bg-pink-100 text-pink-700 dark:bg-pink-900/30 dark:text-pink-300\",\"children\":\"轉換優化\"}],[\"$\",\"h4\",null,{\"className\":\"font-bold text-sm mt-2 group-hover:text-accent transition line-clamp-2\",\"children\":[\"🖼️\",\" \",\"一張封面圖同時搞定六個平台，不用再開六個檔案對尺寸\"]}],[\"$\",\"p\",null,{\"className\":\"text-xs text-text-secondary dark:text-text-dark-secondary mt-1 line-clamp-2\",\"children\":\"社群封面製作器使用教學。一次支援 Facebook、LinkedIn、YouTube、X、IG、Threads 六大平台的正確尺寸，內建 8 款範本、安全區輔助線、AI 生成背景，直接在瀏覽器上排字換色，下載 PNG/WebP/JPEG，附三個實際情境與各平台安全區技巧。\"}]]}]]}]]}]\n39:[\"$\",\"aside\",null,{\"className\":\"hidden lg:block w-72 flex-shrink-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"sticky top-24\",\"children\":[[\"$\",\"nav\",null,{\"className\":\"p-5 rounded-2xl border border-border dark:border-border-dark\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary\",\"children\":\"目錄\"}],[\"$\",\"ul\",null,{\"className\":\"space-y-2\",\"children\":[[[\"$\",\"li\",\"why\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#why\",\"className\":\"text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug\",\"children\":\"為什麼一條連結貼出去的樣子這麼重要\"}]}],[\"$\",\"li\",\"how-it-works\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#how-it-works\",\"className\":\"text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug\",\"children\":\"這個工具實際上在做什麼\"}]}],[\"$\",\"li\",\"step-by-step\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#step-by-step\",\"className\":\"text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug\",\"children\":\"三步驟做出一張不漏氣的分享卡片\"}]}],[\"$\",\"li\",\"tips\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#tips\",\"className\":\"text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug\",\"children\":\"幾個讓卡片點擊率更高的細節\"}]}],[\"$\",\"li\",\"use-cases\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#use-cases\",\"className\":\"text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug\",\"children\":\"三個實際用得到的情境\"}]}],[\"$\",\"li\",\"next-steps\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#next-steps\",\"className\":\"text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5 leading-snug\",\"children\":\"卡片做好之後，接著做這些\"}]}]],[\"$\",\"li\",null,{\"children\":[\"$\",\"a\",null,{\"href\":\"#faq\",\"className\":\"text-sm text-text-secondary dark:text-text-dark-secondary hover:text-accent transition block py-0.5\",\"children\":\"常見問題\"}]}]]}]]}],[\"$\",\"div\",null,{\"className\":\"mt-4 p-5 rounded-2xl border border-accent/20 bg-accent/5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-bold text-sm mb-3 text-text-primary dark:text-text-dark-primary\",\"children\":\"相關工具\"}],[\"$\",\"ul\",null,{\"className\":\"space-y-2\",\"children\":[[\"$\",\"li\",\"title-scorer\",{\"children\":[\"$\",\"$L26\",null,{\"href\":\"/title-scorer\",\"className\":\"text-sm text-accent hover:underline transition block py-0.5\",\"children\":[\"商品標題 SEO 評分器\",\" →\"]}]}],[\"$\",\"li\",\"social-post\",{\"children\":[\"$\",\"$L26\",null,{\"href\":\"/social-post\",\"className\":\"text-sm text-accent hover:underline transition block py-0.5\",\"children\":[\"社群貼文產生器\",\" →\"]}]}],[\"$\",\"li\",\"link-tracker\",{\"children\":[\"$\",\"$L26\",null,{\"href\":\"/link-tracker\",\"className\":\"text-sm text-accent hover:underline transition block py-0.5\",\"children\":[\"短連結追蹤器\",\" →\"]}]}]]}]]}]]}]}]\n3a:[\"$\",\"path\",null,{\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"strokeWidth\":2,\"d\":\"M19 9l-7 7-7-7\"}]\n3b:[\"$\",\"div\",null,{\"className\":\"px-5 pb-5 text-text-secondary dark:text-text-dark-secondary leading-relaxed\",\"children\":\"建議用 1200 × 630 像素、比例 1.91:1 的圖，太小或比例不對會被裁切或不顯示。沒出圖最常見的兩個原因：一是填了相對路徑（要用 https:// 開頭的絕對完整網址），二是圖片網址沒有公開、平台抓不到。兩者排除通常就會正常。\"}]\n23:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"2\",{\"name\":\"theme-color\",\"content\":\"#1e3a5f\"}]]\n21:null\n25:[[\"$\",\"title\",\"0\",{\"children\":\"貼連結到 LINE 群卻沒圖沒描述？發文前先把分享卡片看清楚 | 電商營運工具箱\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"OG / Meta Tag 預覽器使用教學。把標題、描述、圖片網址填一填，就能同時看到連結分享到 Facebook、LINE、Twitter/X 和 Google 搜尋結果長什麼樣子，字數自動檢查會不會被截斷，最後一鍵複製整份 meta tags 貼進網頁。純瀏覽器本機運算，不上傳、不耗 AI 額度。\"}],[\"$\",\"link\",\"2\",{\"rel\":\"manifest\",\"href\":\"/manifest.webmanifest\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"meta\",\"3\",{\"name\":\"keywords\",\"content\":\"AI 電商工具,電商文案產生器,ROAS 計算器,電商利潤計算,蝦皮工具,momo 工具,電商法規檢查,KOL 報價,會員 RFM 分析,電商營運,免費電商工具\"}],[\"$\",\"meta\",\"4\",{\"name\":\"robots\",\"content\":\"index, follow\"}],[\"$\",\"link\",\"5\",{\"rel\":\"canonical\",\"href\":\"https://ecom.atmarketing.tw/learn/og-preview\"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:title\",\"content\":\"貼連結到 LINE 群卻沒圖沒描述？發文前先把分享卡片看清楚\"}],[\"$\",\"meta\",\"7\",{\"property\":\"og:description\",\"content\":\"OG / Meta Tag 預覽器使用教學。把標題、描述、圖片網址填一填，就能同時看到連結分享到 Facebook、LINE、Twitter/X 和 Google 搜尋結果長什麼樣子，字數自動檢查會不會被截斷，最後一鍵複製整份 meta tags 貼進網頁。純瀏覽器本機運算，不上傳、不耗 AI 額度。\"}],[\"$\",\"meta\",\"8\",{\"property\":\"og:url\",\"content\":\"https://ecom.atmarketing.tw/learn/og-preview\"}],[\"$\",\"meta\",\"9\",{\"property\":\"og:site_name\",\"content\":\"電商營運工具箱\"}],[\"$\",\"meta\",\"10\",{\"property\":\"og:locale\",\"content\":\"zh_TW\"}],[\"$\",\"meta\",\"11\",{\"property\":\"og:image\",\"content\":\"https://ecom.atmarketing.tw/api/og?title=%E8%B2%BC%E9%80%A3%E7%B5%90%E5%88%B0%20LINE%20%E7%BE%A4%E5%8D%BB%E6%B2%92%E5%9C%96%E6%B2%92%E6%8F%8F%E8%BF%B0%EF%BC%9F%E7%99%BC%E6%96%87%E5%89%8D%E5%85%88%E6%8A%8A%E5%88%86%E4%BA%AB%E5%8D%A1%E7%89%87%E7%9C%8B%E6%B8%85%E6%A5%9A\u0026icon=%F0%9F%91%80\u0026tagline=OG%20%2F%20Meta%20Tag%20%E9%A0%90%E8%A6%BD%E5%99%A8%E4%BD%BF%E7%94%A8%E6%95%99%E5%AD%B8%E3%80%82%E6%8A%8A%E6%A8%99%E9%A1%8C%E3%80%81%E6%8F%8F%E8%BF%B0%E3%80%81%E5%9C%96%E7%89%87%E7%B6%B2%E5%9D%80%E5%A1%AB%E4%B8%80%E5%A1%AB%EF%BC%8C%E5%B0%B1%E8%83%BD%E5%90%8C%E6%99%82%E7%9C%8B%E5%88%B0%E9%80%A3%E7%B5%90%E5%88%86%E4%BA%AB%E5%88%B0%20Facebook%E3%80%81LI\"}],[\"$\",\"meta\",\"12\",{\"property\":\"og:type\",\"content\":\"article\"}],[\"$\",\"meta\",\"13\",{\"property\":\"article:published_time\",\"content\":\"2026-07-25\"}],[\"$\",\"meta\",\"14\",{\"property\":\"article:author\",\"content\":\"電商營運工具箱\"}],[\"$\",\"meta\",\"15\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"16\",{\"name\":\"twitter:title\",\"content\":\"貼連結到 LINE 群卻沒圖沒描述？發文前先把分享卡片看清楚\"}],[\"$\",\"meta\",\"17\",{\"name\":\"twitter:description\",\"content\":\"OG / Meta Tag 預覽器使用教學。把標題、描述、圖片網址填一填，就能同時看到連結分享到 Facebook、LINE、Twitter/X 和 Google 搜尋結果長什麼樣子，字數自動檢查會不會被截斷，最後一鍵複製整份 meta tags 貼進網頁。純瀏覽器本機運算，不上傳、不耗 AI 額度。\"}],[\"$\",\"meta\",\"18\",{\"name\":\"twitter:image\",\"content\":\"https://ecom.atmarketing.tw/api/og?title=%E8%B2%BC%E9%80%A3%E7%B5%90%E5%88%B0%20LINE%20%E7%BE%A4%E5%8D%BB%E6%B2%92%E5%9C%96%E6%B2%92%E6%8F%8F%E8%BF%B0%EF%BC%9F%E7%99%BC%E6%96%87%E5%89%8D%E5%85%88%E6%8A%8A%E5%88%86%E4%BA%AB%E5%8D%A1%E7%89%87%E7%9C%8B%E6%B8%85%E6%A5%9A\u0026icon=%F0%9F%91%80\u0026tagline=OG%20%2F%20Meta%20Tag%20%E9%A0%90%E8%A6%BD%E5%99%A8%E4%BD%BF%E7%94%A8%E6%95%99%E5%AD%B8%E3%80%82%E6%8A%8A%E6%A8%99%E9%A1%8C%E3%80%81%E6%8F%8F%E8%BF%B0%E3%80%81%E5%9C%96%E7%89%87%E7%B6%B2%E5%9D%80%E5%A1%AB%E4%B8%80%E5%A1%AB%EF%BC%8C%E5%B0%B1%E8%83%BD%E5%90%8C%E6%99%82%E7%9C%8B%E5%88%B0%E9%80%A3%E7%B5%90%E5%88%86%E4%BA%AB%E5%88%B0%20Facebook%E3%80%81LI\"}],[\"$\",\"link\",\"19\",{\"rel\":\"icon\",\"href\":\"/favicon.svg\",\"type\":\"image/svg+xml\"}],[\"$\",\"link\",\"20\",{\"rel\":\"icon\",\"href\":\"/favicon.ico\",\"sizes\":\"32x32\"}],[\"$\",\"link\",\"21\",{\"rel\":\"apple-touch-icon\",\"href\":\"/apple-touch-icon.png\"}],[\"$\",\"$L3c\",\"22\",{}]]\n"])</script></body></html>