WordPress 加 LINE 浮動按鈕教學：用 Chaty 外掛讓客戶一鍵聯絡你
想在 WordPress 加一顆會跟人走的 LINE 浮動按鈕，最快的方法是裝免費外掛 Chaty：先到 LINE Developers 申請 Messaging API 頻道拿到…
想在 WordPress 加一顆會跟人走的 LINE 浮動按鈕，最快的方法是裝免費外掛 Chaty：先到 LINE Developers 申請 Messaging API 頻道拿到 Bot basic ID，回網站裝好 Chaty、把 line.me/ti/p/你的ID 貼進管道欄位，再決定按鈕出現的時機與版位就能上線。根據 Chaty 官方方案說明，免費版可支援超過 20 個通訊管道、每月約可接觸 500 位用戶，按鈕能不能發揮作用，關鍵在於你有沒有先把 ID 拿到手、再設對出現時機。
重點先看：LINE 浮動按鈕裝得對，詢問門檻會明顯下降；依 Chaty 官方方案說明，免費版每月約可接觸 500 位用戶，行動版搭配離開意圖觸發比進站即彈更不被反感。追蹤點擊數並對照 LINE 後台進線量，才知道按鈕是幫你接單還是掛好看。
為什麼 WordPress 網站需要一顆 LINE 聯絡按鈕
多數訪客不會主動找聯絡表單，他們看完美商品頁就關掉視窗。一顆固定在角落、會跟著捲動的 LINE 按鈕，能把詢問門檻降到最低，特別是對形象網站與電商這類需要即時溝通的站點。LINE 是多數人日常通訊工具，點一下就能私訊，摩擦力比填表單低很多，這也是為什麼 企業形象網站的價值 常被低估的原因之一，訪客要的其實是更快被聯絡到，而不是再多看幾頁資訊。
浮動按鈕固定在視窗邊緣，捲動時仍在畫面上，曝光不中斷。對需要報價、預約、客服回覆的網站類型來說，這顆按鈕等於把聯絡入口直接推到訪客眼前，不必等對方翻到 Contact Form 7 免費聯絡表單教學 裡那張表。自己站到顯眼的位置，比期待訪客主動找你更實際。
不過我得承認，按鈕並非萬靈丹。如果網站本身的 Landing Page 轉換率優化 沒做好、商品頁寫不清楚，再怎麼浮動的按鈕也救不回失去的信任。按鈕解決的是「被找到」的問題，「被信任」的問題它管不著。電商站可以把它當成 WooCommerce 購物網站架設流程 裡的最後一哩聯絡保險，讓網站變成 24 小時自動接單機器 的關鍵常常就差這一顆。
再從通路結構看，LINE 在台灣幾乎是人手一個的通訊工具，把聯絡入口做在 LINE 上面，等於把詢問環節搬進訪客最習慣的對話場域。對習慣用訊息溝通而非打電話、寄信的年輕客群來說，LINE 按鈕的存在直接決定他們要不要開口問。這也是為什麼把聯絡入口做在 LINE 上，對本地市場的轉換幫助特別明顯。WordPress 目前佔全球所有網站的 41.5%，在內容管理系統已知網站中更高達 59.2% [來源：〈W3Techs — Usage Statistics and Market Share of WordPress〉〈https://w3techs.com/technologies/details/cm-wordpress〉〈2026-06-29〉]，絕大多數 WordPress 站長都能用同一套外掛邏輯把 LINE 按鈕裝上去，這也是本篇以 Chaty 為主軸的原因。
- LINE 是日常通訊工具，點一下就能私訊，比填表單摩擦力低。
- 浮動按鈕固定在視窗邊緣，捲動時仍在畫面上，曝光不中斷。
- 適合需要報價、預約、客服回覆的站點，例如 WordPress 購物網站架設教學 涵蓋的電商場景。
- 把聯絡入口推到訪客眼前，比等他主動找聯絡頁更有效。
開始前要先準備什麼：LINE 官方帳號與 Bot basic ID
WordPress 加 LINE 按鈕，前置作業其實只有一件正事：到 LINE Developers 申請一個 Messaging API 頻道、建立官方帳號，然後在頻道的 Messaging API 面板複製 Bot basic ID。這組 ID 是按鈕能正確導向你的 LINE 的關鍵，貼錯了按鈕會把訪客送到別人的帳號，或直接報錯。建立頻道的步驟以 LINE Developers 官方文件 為準，流程大致如下。
先用個人 LINE 帳號登入 LINE Developers，沒有帳號先註冊一個。進 Products 選 Messaging API，建立 Provider 與頻道，填入頻道名稱、說明、常用 Email。建立完成後到 Messaging API 面板找到 Bot basic ID 並複製。這組 ID 會組成按鈕連結 line.me/ti/p/你的 Bot basic ID，格式源自 LINE 官方，貼錯 ID 按鈕就導向錯誤帳號。
這裡要誠實講一句：很多人卡在「要不要先申請 LINE 官方帳號」。我的看法是，只要你想穩定收到網站來的訊息、之後還想接自動回覆，就值得花十分鐘把官方帳號開起來。若只是想導向個人 LINE，也可改用個人行動條碼連結，但官方帳號才能穩定收到訊息、留下聊天紀錄，也方便日後串 用 LINE 登入 WordPress 串接社群帳號 之類的進階功能。說到底，官方帳號是基礎建設，長期來看反而省事。
Bot basic ID 連結格式對照
| 項目 | 內容 | 來源 |
|---|---|---|
| 連結格式 | line.me/ti/p/你的 Bot basic ID | LINE 官方文件 |
| ID 位置 | Messaging API 面板 | LINE Developers 後台 |
| 導向目標 | 你的 LINE 官方帳號聊天室 | LINE 官方 |
| 替代方案 | 個人行動條碼連結（不建議長期用） | LINE 應用程式內建 |
官方帳號與個人行動條碼的取捨
把兩種連結來源攤開比較，會更清楚為什麼多數情況都建議走官方帳號。個人行動條碼的優點只有一個：開通零成本、馬上能用，貼上 Chaty 立刻有按鈕。但它有三個明顯短板。第一，訊息沒有結構化留存，所有對話都堆在你的私人聊天室，無法分類、無法交接給團隊。第二，無法接自動回覆與選單，訪客半夜發訊息只能等你早上手動回。第三，一旦你的私人帳號因任何原因被停用，整個網站的聯絡入口跟著斷掉，且沒有備援。官方帳號把這三件事一次解決：訊息進到獨立的聊天介面、可設定歡迎訊息與關鍵字自動回、帳號與個人 LINE 分離互不影響。
| 比較項目 | 官方帳號（Bot basic ID） | 個人行動條碼 |
|---|---|---|
| 開通成本 | 需申請 Messaging API 頻道 | 零，直接產生 |
| 訊息留存 | 獨立聊天介面，可分類 | 堆在私人聊天室 |
| 自動回覆 | 可設歡迎訊息與關鍵字 | 無 |
| 團隊協作 | 可多人管理 | 僅帳號本人 |
| 長期適合度 | 高 | 低，僅適合過渡 |
Chaty 外掛是什麼：為什麼選它來做 LINE 按鈕
Chaty 之所以適合拿來做 WordPress LINE 浮動按鈕，是因為它免費版就能做出一顆可自訂位置、顏色、圖示、觸發時機的浮動按鈕，而且能把 LINE、Messenger、WhatsApp 等多個管道整合在同一顆按鈕裡，設定介面還有中文可選。對不想碰程式碼的站長來說，這幾乎是最快的路徑，不用像 WordPress 嵌入 Facebook 粉專與社團 那樣自己處理嵌入碼。
依 Chaty 官方方案說明，它支援超過 20 個通訊管道，LINE、FB Messenger、WhatsApp、電話都能同時掛上，想再加 WordPress 嵌入 Facebook Messenger 即時客服 或 WordPress 嵌入 Instagram 貼文動態 的聯絡入口也不衝突。可調整按鈕位置、尺寸、顏色、圖示、游標暫留文字，並提供三種觸發條件：進站幾秒後出現、捲動多少後出現、偵測到離開意圖時彈出。
依 Chaty 官方方案說明，免費版每月約可接觸 500 位用戶，超過會提醒升級或等下月重算。對剛起步的形象網站通常夠用，一旦訊息量穩定上升再評估升級。付費版額外支援自訂圖片、Google Analytics 串接、指定頁面或日期顯示。選外掛時很多人會猶豫要不要直接挑 WordPress 必裝外掛推薦清單 裡的大牌，但做浮動聯絡按鈕這件事，輕量、專注、好設定的 Chaty 反而比一袋萬用外掛更合適。
| 功能 | 免費版 | 付費版 |
|---|---|---|
| 通訊管道數 | 超過 20 個（含 LINE） | 同，進階自訂 |
| 每月可接觸用戶 | 約 500 位 | 依方案提升 |
| 按鈕位置／顏色／圖示 | 可 | 可，含自訂圖片 |
| 觸發條件（秒數／捲動／離開意圖） | 可 | 可 |
| 指定頁面／日期顯示 | 否 | 是 |
| Google Analytics 串接 | 否（需自接 GTM） | 是 |
以上免費版與付費版的功能差異，皆以 Chaty 官方方案說明為依據，方案若有調整請以前台公告為準。
除了 Chaty，還有哪些浮動按鈕選擇
WordPress 生態裡能做浮動聯絡按鈕的外掛不只 Chaty，認識替代方案有助於在 Chaty 不符合需求時快速切換。常見的幾條路徑各有擅長的場景：有些主打多管道整合與中文介面，有些強調與頁面編輯器的深度整合，有些則走輕量路線只做一顆按鈕不附加其他功能。把幾個常見方向依「設定難易度、多管道整合、中文介面、效能負擔」四個維度做相對比較，分數僅代表同類需求下的相對適配度，實際選擇仍以你的站點情境為準。
| 方向 | 設定難易度 | 多管道整合 | 中文介面 | 效能負擔 |
|---|---|---|---|---|
| Chaty（通訊聚合型） | 低 | 高 | 有 | 中低 |
| 頁面編輯器內建浮動按鈕（如 Elementor） | 中 | 低 | 視編輯器 | 中 |
| 輕量自訂按鈕（手寫一段 HTML／CSS） | 高 | 無 | 無 | 低 |
| 表單外掛附帶的浮動入口 | 中 | 低 | 視外掛 | 中 |
從這張評分卡可以看出幾個決策方向。如果你的需求是「一顆按鈕同時掛 LINE、Messenger、WhatsApp」，通訊聚合型的 Chaty 幾乎是設定難易度最低的選擇。如果你已經重度依賴某個頁面編輯器，而且只想要一顆 LINE 按鈕，直接用編輯器內建的浮動元素會更省事，不必再多裝一個外掛。如果你對效能極度敏感、又只需要導向單一 LINE 帳號，手寫一顆固定位置的按鈕反而是最輕的方案，代價是要自己處理 RWD 與點擊事件。想深入了解 Elementor 這條路徑，可參考 Elementor Pro 彈跳視窗製作教學；想了解表單外掛附帶的聯絡入口，可參考 WordPress 表單外掛完整比較。
步驟一：安裝並啟用 Chaty 外掛
安裝 Chaty 的路徑很直覺：到 WordPress 後台的外掛 > 安裝外掛，搜尋 Chaty，找到後點安裝並啟用。第一次啟用會跳出歡迎視窗，可直接關閉進入設定。這個動作跟 WordPress 外掛安裝三種方法 裡介紹的後台搜尋法完全一樣，如果你連後台都還不熟，先回頭把 WordPress 後台操作上手指南 看一遍會更順。
外掛本身免費，付費功能在設定時才會標示。安裝後若沒看到 Chaty 選單，到已啟用外掛清單確認狀態，有時是主題或快取外掛干擾導致選單沒刷出來。確認啟用後，回到後台左側或設定區就能看到 Chaty 入口，準備進入下一步。安裝這關若卡住，多半出在權限或外掛衝突，可以對照 WordPress 區塊小工具與側邊欄 的除錯思路，先把快取清掉再試一次。
確認外掛正常啟用，有兩個快速檢查點。第一，到「已安裝外掛」清單看 Chaty 下方是否顯示「停用」字樣（顯示停用代表它正在運作中），如果顯示的是「啟用」，代表它其實沒被啟用，點一下就能補上。第二，回到前台重新整理頁面，若設定尚未完成，Chaty 預設不會顯示按鈕，但瀏覽器開發者工具的 Network 面板應該能看到 Chaty 相關的資源被載入，這代表外掛已掛上。這兩個檢查能在正式設定前先排除「裝了等於沒裝」的常見失誤。
- 路徑：WordPress 後台 > 外掛 > 安裝外掛，搜尋 Chaty。
- 找到正確外掛後點安裝，再點啟用。
- 第一次啟用的歡迎視窗可跳過，直接進設定介面。
- 外掛免費，付費功能在設定時才會標示。
- 安裝後若沒看到選單，到已啟用外掛清單確認狀態。
- 用「已安裝外掛清單顯示停用」與「前台 Network 面板」兩點確認外掛真的在跑。
步驟二：把 LINE 管道接上 Chaty
串接 LINE 的核心動作只有一個：在 Chaty 點建立小工具，為小工具命名後，從管道清單點選 LINE 圖示新增，把前面拿到的 Bot basic ID 組成 line.me/ti/p/你的 ID 貼進去，再決定要在電腦版或手機版顯示。後台找到 Chaty，點建立小工具，先給一個自己記得的名稱，方便之後回來調整時找得到。
從應用程式清單點 LINE 圖示新增管道，預設的 Phone 不需要可刪除。貼入格式 line.me/ti/p/你的 Bot basic ID 時，ID 要對應你申請的官方帳號，貼錯會把訪客導到錯帳號或直接失效。可設定僅桌面或僅行動顯示，建議至少開行動版，因為多數詢問來自行動裝置（背景觀察，不寫死比例）。也能自訂按鈕顏色、游標暫留文字，付費版可上傳自訂圖片。
行動版之所以是基本盤，有數字支撐。2026 年第一季，行動裝置（不含平板）佔全球網站流量的 52.27% [來源：〈Statista — Share of mobile web traffic worldwide quarterly 2015-2026〉〈https://www.statista.com/statistics/277125/share-of-website-traffic-coming-from-mobile-devices/〉〈2026-04-28〉]。在台灣這類 LINE 滲透率極高的市場，行動流量占比往往更高，訪客在手機上看到 LINE 按鈕、順手點開私訊的機率，遠高於在桌面版點按鈕再切到手機加好友。Google 也在 2023 年 10 月宣布行動優先索引（mobile-first indexing）已完成，所有能在行動裝置上運作的網站，現在都以行動爬蟲為主要檢索對象 [來源：〈Google Search Central Blog — Mobile-first indexing is here〉〈https://developers.google.com/search/blog/2023/10/mobile-first-is-here〉〈2023-10-31〉]。這代表行動版的聯絡體驗同時影響轉換與搜尋引擎對網站的理解，把 LINE 按鈕的行動版做扎實，等於一次照顧兩件事。
老實說，這一步最容易出包的地方在 ID 貼錯。我自己第一次設定的時候就把開頭的 http:// 留著，結果在某些瀏覽器上連結失效，訪客點了沒反應。正確格式只要 line.me/ti/p/ 開頭即可，不需要加通訊協定。如果你打算把 LINE 跟 WordPress 社群分享按鈕整合設定 放在同一區，記得兩者別擠在同一個角落，否則行動版會互相遮住。
貼完 ID 之後，務必做一次「模擬訪客」的實測。開一個無痕視窗或請親友用手機打開你的網站，點一下 LINE 按鈕，確認它真的把你帶到「你自己的」官方帳號聊天室，而不是 LINE 的錯誤頁或別人的帳號。這個動作看起來多餘，卻能擋下絕大多數「按鈕裝好了但沒人點得動」的悲劇。實測時要特別留意行動版的瀏覽器差異，某些舊版瀏覽器對帶有通訊協定的連結處理不一致，這也是前面強調不要加 http:// 的原因。
- 後台找到 Chaty，點建立小工具，先給一個自己記得的名稱。
- 從應用程式清單點 LINE 圖示新增管道，預設的 Phone 不需要可刪除。
- 貼入格式：line.me/ti/p/你的 Bot basic ID，ID 要對應你申請的官方帳號。
- 可設定僅桌面或僅行動顯示，建議至少開行動版。
- 可自訂按鈕顏色、游標暫留文字，付費版可上傳自訂圖片。
- 貼完 ID 用無痕視窗或手機實測一次，確認按鈕導向自己的官方帳號。
步驟三：自訂按鈕外觀、觸發時機與顯示對象
這一步決定按鈕會不會變成干擾。把按鈕放在右下角、尺寸適中，觸發策略建議設成偵測到離開意圖或捲動超過一段比例才出現，避免一進站就彈。離開意圖觸發比進站即彈更不被反感（背景觀察，這類按鈕的點擊品質通常更好），進站就彈反而會讓還沒讀內容的訪客直接關掉視窗。曝光重要，但被打擾的感覺會直接抵銷掉曝光的價值。
位置與尺寸方面，常見放右下角，尺寸用預設或自訂 px，避免擋到主要內容。行動呼籲文字（CTA）要明確，例如「LINE 私訊我們」「馬上詢問報價」，不要寫「點我」這種沒有資訊量的字。觸發時機有進站幾秒、捲動比例、離開意圖三種，建議優先用離開意圖，把按鈕精準推到「訪客要走但還有點興趣」的那一瞬間。如果想更講究，可參考 CTA 行動呼籲按鈕設計指南 與 CTA 按鈕與文案提升轉換率，把 CTA 文案打磨到能單獨成立。
可加待處理訊息提示（紅點），提高點擊意願，但紅點要小心用，沒訊息卻一直掛著紅點會被當成騙點擊。付費版可指定頁面、指定日期顯示，把按鈕精準放在轉換熱區，例如只在商品頁與聯絡頁出現。這對 品牌形象網站設計全攻略 涉及的多頁式站點特別有用，不必讓每個角落都掛同一顆按鈕。位置擋到內容時，可調整 z-index 或改放左下角，原理跟 WordPress 側邊欄固定小工具教學 裡處理固定元素的思路一樣。
| 觸發策略 | 適合情境 | 風險 |
|---|---|---|
| 進站幾秒後出現 | 品牌曝光優先 | 易被當廣告，跳出率上升 |
| 捲動比例觸發 | 內容型網站 | 短頁面可能永遠觸發不到 |
| 離開意圖觸發 | 詢問轉換優先 | 行動版較難偵測滑鼠離開 |
| 指定頁面顯示（付費） | 商品頁、聯絡頁熱區 | 需逐一設定 |
把這張表轉成可執行的判斷準則，可以這樣選：如果你的網站只有一頁式活動頁、平均停留時間短，用「進站三到五秒後出現」能搶到曝光，但風險是跳出率上升；如果是多頁式形象站或部落格，訪客會往下讀，用「捲動超過 50% 才出現」最不干擾；如果是報價導向的電商，把「離開意圖」設為主觸發、搭配只在商品頁顯示，詢問的精準度會比三種全開更高。實務上常見的失誤是把三種觸發全打開，結果按鈕在訪客剛進站就彈、捲動一半又彈、要離開再彈，被當成廣告疲勞轟炸而整個關掉，這種設定帶來的點擊雖然多，訊息進線量卻反而下降，因為點擊品質被稀釋了。
還有一個小細節：按鈕位置與網站的 WordPress 置頂通知列推播橫幅、WordPress 選單與導覽設定 不要疊在同一個邊緣，否則手機版會出現元素打架的慘況。置頂通知列掛上方、LINE 按鈕放右下，是最不容易衝突的組合。
按鈕文案的 A/B 測試思路
按鈕的外觀設定好之後，文案是下一個值得反覆調整的變數。同一顆按鈕，寫「點我聯絡」跟寫「LINE 私訊問報價」帶來的點擊品質往往差很多。要驗證哪一種文案適合你的站點，最直接的方法是做輪替測試：每隔一段時間（例如一到兩週）換一組文案，同時用 GTM 或 GA4 記錄點擊次數，再對照 LINE 後台同一時段的訊息進線量。點擊多但訊息少的文案，代表它吸引了好奇點擊，卻沒有把對的人引導到對的動作；點擊普通但訊息多的文案，反而是更值得長期採用的版本。
測試時有幾個原則能減少誤判。一次只改一個變數，不要同時換文案、顏色、位置，否則無法歸因。測試期要拉長到至少包含平日與週末，因為不同時段的訪客組成不同，短天期的數字容易被極端值拉偏。每次切換文案前後，把當時的流量來源也記下來，若某段時間剛好有廣告投放或社群分享帶來大量流量，那段數字要分開看，不能混進比較基準。把這些記錄累積下來，你會逐漸看出自己站點的訪客對哪一類 CTA 文案最有反應。
| 文案類型 | 範例 | 適合場景 |
|---|---|---|
| 直接行動型 | LINE 私訊問報價 | 電商、報價導向 |
| 降低門檻型 | 有問題？LINE 問最快 | 形象網站、客服 |
| 情境召喚型 | 看喜歡就 LINE 私訊 | 商品頁、作品集 |
| 模糊引導型（不建議） | 點我 | 資訊量低，難評估意圖 |
追蹤成效：怎麼知道 LINE 按鈕有沒有帶來詢問
按鈕裝了不等於有效，要衡量效果得有數字。用 Chaty 付費版的 GA 整合，或免費版搭配 GTM 監聽按鈕點擊事件、送到 GA4，把點擊次數、來源頁面、轉換路徑記下來，再對照 LINE 後台的訊息進線量，才能判斷按鈕值不值得繼續放。沒有數字，所謂「有效」就只是感覺。
依 Chaty 官方方案說明，付費版內建 Google Analytics 串接，可直接看點擊次數與流量來源。免費版可透過 GTM 設定點擊觸發條件，把事件送進 GA4，具體做法可參考 用 GTM 追蹤 LINE 按鈕點擊事件，再搭配 WordPress 安裝 Google Analytics 與 WordPress GTM 與 GA4 串接設定 把事件鏈補齊。若不想手動串 GTM，也能用 Site Kit by Google 串接 GA4 與 GSC 做基本觀測，Google Analytics 完整報表教學 裡有更細的報表解讀方式。
把按鈕點擊定義為微轉換，再觀察是否真的帶來 LINE 訊息。對照 LINE Official Account Manager 的聊天紀錄，驗證進線品質。若點擊高但訊息少，問題多半出在按鈕位置或 CTA 文案，外掛本身通常沒問題。退一步看，追蹤的重點在於用數字回答一個問題：這顆按鈕是幫你接單，還是只是掛著好看。對經營 行銷漏斗與 SEO 整合實戰 的人來說，這個答案會直接影響你願不願意把按鈕放進漏斗的哪一層。
從衡量成效的廣度來看，按鈕點擊只是詢問流程的起點，真正能拿來判斷「接單」與「掛好看」的指標，是後續的訊息轉換。把點擊當微轉換、把 LINE 訊息進線當主要轉換，再進一步把訊息進線後實際成交或預約的件數算出來，就形成一條「點擊、進線、成交」的三層漏斗。Google Analytics 目前覆蓋全球所有網站的 46.6%，在流量分析工具已知的網站中更高達 81.8% [來源：〈W3Techs — Usage Statistics and Market Share of Google Analytics〉〈https://w3techs.com/technologies/details/ta-googleanalytics〉〈2026-06-29〉]，這代表多數站長手上已經有 GA 可用，把它接上按鈕點擊事件的門檻不高。業界在衡量內容行銷成效時，超過 41% 的行銷人會透過「銷售」來判斷策略是否成功 [來源：〈HubSpot Marketing Statistics — HubSpot State of Marketing Report, 2024〉〈https://www.hubspot.com/marketing-statistics〉〈2024〉]，把同樣的邏輯套到 LINE 按鈕上，就是不要只看點擊，要看到底有沒有真的接到單。
- Chaty 付費版內建 GA 串接，可直接看點擊次數與流量來源。
- 免費版可透過 GTM 設定點擊觸發條件，把事件送進 GA4。
- 把按鈕點擊定義為微轉換，再觀察是否真的帶來 LINE 訊息。
- 對照 LINE Official Account Manager 的聊天紀錄，驗證進線品質。
- 點擊高但訊息少時，優先檢查按鈕位置與 CTA 文案。
- 建立「點擊、進線、成交」三層漏斗，用最終成交件數判斷按鈕價值。
常見問題：LINE 按鈕設定的大小疑難
設定 LINE 按鈕時，最常卡在三個地方：按鈕導不到人、按鈕在手機被擋住、免費版用戶數撞上限。對應解法是檢查 Bot basic ID 格式、調整 z-index 與位置、評估升級或改用替代外掛。這三個問題佔了實務上絕大多數的求助，處理起來都不複雜，但要先對症。
按鈕點了沒反應，第一個檢查 Bot basic ID 是否正確、連結格式是否完整，line.me/ti/p/ 這一段不能少也不能多加 http://。手機版看不到按鈕，確認有開行動顯示，且沒被頁尾或其他固定元素遮住，必要時調 z-index。依 Chaty 官方方案說明，免費版每月約可接觸 500 位用戶，超過會提醒升級或等下月重算，剛起步的站通常撞不到。想要同時掛 LINE 與 Messenger，Chaty 支援多管道整合，同一顆按鈕可展開多個入口，這也是它比起單功能 WordPress 表單外掛完整比較 裡那些方案的優勢。
不想用 Chaty 也有替代方案。市面上其他浮動按鈕或聯絡表單外掛都能做類似的事，差別在設定難易度與多管道整合能力，選之前可參考 WooCommerce 訂單 LINE 推播通知外掛 與 Line LAP 廣告投放與版位解析 看你的 LINE 佈局需求。若你要的是聊天機器人等級的自動回覆，那方向會偏到 Facebook Messenger 聊天機器人行銷、ManyChat IG 自動回覆聊天機器人、Chatfuel Messenger 機器人教學 那一側，跟單純放一顆浮動按鈕是兩件事，別混在一起選。
| 症狀 | 常見原因 | 解法 |
|---|---|---|
| 點按鈕沒反應 | Bot basic ID 貼錯或格式不全 | 核對 line.me/ti/p/ 格式 |
| 手機版看不到 | 未開行動顯示或被頁尾遮住 | 開啟行動顯示、調 z-index |
| 用戶數撞上限 | 免費版月接觸約 500 位 | 等下月重算或升級 |
| 按鈕拖慢網站 | 外掛載入過多資源 | 搭配快取與 WordPress 網站加速效能優化外掛 |
| 桌面看得到、手機看不到 | 僅開桌面顯示 | 在顯示裝置設定補勾行動版 |
| 按鈕擋住結帳按鈕 | 位置與電商結算區重疊 | 改放左下角或調 z-index 低於結帳區 |
關於「按鈕會不會拖慢網站」，我得承認這要視情況而定。Chaty 本身算輕量，但任何浮動按鈕都會多載一點 JavaScript 與圖示資源，對 網站速度優化核心技巧 要求高的站點，建議搭配快取外掛並留意 Core Web Vitals SEO 指標優化 的分數變化。行動版體驗則可對照 響應式網頁設計 RWD 手機版 的檢查清單，確認按鈕在不同螢幕寬度下都不擋內容。
網站速度對轉換的影響有明確案例可循。樂天 24（Rakuten 24）投入 Core Web Vitals 優化後，每位訪客的營收提升 53.37%、轉換率提升 33.13%；Vodafone 把 LCP 改善 31%，帶來銷售增加 8%；redBus 改善 INP 後銷售增加 7% [來源：〈web.dev (Google) - Why does speed matter?〉〈https://web.dev/articles/why-speed-matters〉〈2026〉]。這些案例說明，即使只是多載一顆浮動按鈕的資源，累積下來對效能敏感的電商站也可能影響轉換。實務上的折衷做法是：先用 Chaty 免費版上線觀察 Core Web Vitals 分數，若 LCP 或 INP 明顯下滑，再考慮啟用更積極的快取設定，或換成更輕量的替代方案。在多數情況下，搭配快取外掛與圖片延遲載入，浮動按鈕帶來的效能負擔可以被壓到可接受範圍。
誰不適合加 LINE 浮動按鈕
講了這麼多好處，也要講一下哪些情況不該裝。如果你的網站流量主要來自搜尋、訪客看一篇就走，網站跳出率與 SEO 關係解析 已經偏高，再多一顆會彈的按鈕只會加速他們離開。內容站、純資訊站若沒有客服或報價需求，硬掛 LINE 按鈕反而讓版面看起來像在推銷。形象網站則相反，訪客本來就想找你講話，按鈕幾乎是標配，這也是 品牌官網架設 與 WordPress 形象網站架站 時常被點到的細節。
判斷的標準很簡單：你的網站有沒有「需要即時回覆」的場景。有，就裝；沒有，就別為了看起來熱鬧而裝。CTR 點擊率計算與提升技巧 高的版位不代表轉換就高，按鈕也是一樣道理，點得多不等於問得多。如果你是走內容會員制，可能 OG 標籤設定與社群分享優化 或 Elementor Pro 彈跳視窗製作教學 這類入口會比 LINE 按鈕更貼合你的目標。
決策矩陣：什麼情況該不該裝 LINE 按鈕
把「網站類型」與「是否需要即時回覆」兩個維度交叉，可以得出一張快速判斷用的決策矩陣。縱軸是網站的主要目的，橫軸是訪客來站後是否常需要當下得到答案。落在「需要即時回覆」欄位的，幾乎都建議裝；落在「不需要即時回覆」欄位的，裝了反而稀釋版面焦點。
| 網站類型 | 需要即時回覆 | 不需要即時回覆 |
|---|---|---|
| 電商／購物站 | 裝，放商品頁熱區 | 視情況，先補商品資訊 |
| 形象／品牌官網 | 裝，詢問門檻最低 | 可裝，觸發從寬 |
| 預約／服務型網站 | 裝，替代電話預約 | 裝，離開意圖觸發 |
| 純內容／部落格 | 少見，建議改留言 | 不建議裝 |
| 登入制會員站 | 視客服需求 | 不建議裝 |
這張矩陣不是硬規則，而是一個起點。實際決定時還要加上兩個變數：你的回覆人力，以及訪客來站的時段分布。如果你根本沒有人力即時回 LINE，裝了按鈕反而讓訪客等不到回覆、累積負面觀感，這種情況下，先把自動回覆的歡迎訊息設好再上線按鈕，會比急著掛按鈕更穩當。若你的訪客集中在深夜時段，而你的 LINE 官方帳號又沒有非營業時間的自動回覆，按鈕帶來的詢問會堆到隔天早上，這也是要先想清楚的營運細節。
把按鈕放對位置，勝過把按鈕做漂亮
回顧一下整個流程：先在 LINE Developers 拿到 Bot basic ID，回 WordPress 裝 Chaty、貼上 line.me/ti/p/你的ID，再決定按鈕出現的時機與版位。三段設定，半小時內能上線。真正影響詢問量的，是 ID 設對了沒、出現時機選對了沒、行動版有沒有被擋住，按鈕的配色或圓角反而不是重點。ID 貼錯或進站就彈，這顆按鈕只會把訪客推走；設對了，它會在該出現的瞬間把人留住。
設定完成後，別忘了回去做追蹤。把按鈕點擊接進 GA4，對照 LINE 後台的訊息進線量，這顆按鈕值不值得繼續放、要不要升級付費版，數字會告訴你。如果你還想把整個網站的詢問流程串起來，可以從 WordPress 後台核心功能詳解、WordPress 頁面建立與編輯教學、WordPress 登入頁面美化教學 這幾個基礎回頭檢查，把聯絡入口、頁面結構、登入體驗一起調順。任何浮動元素都會吃一點效能，WordPress 備份外掛推薦評比 與 WordPress 資安防護外掛評比、Wordfence 防火牆與掃描設定 也順手補上，網站才會穩。
到頭來，加一顆 LINE 浮動按鈕這件事，技術門檻很低，判斷門檻不低。裝錯時機、放錯版位、追蹤沒接，按鈕就只是掛在角落、沒有人會點。裝對了，它會老實把那些原本會默默關掉視窗的訪客留下來，變成一通能談下去的訊息。
上線前最終檢查清單
按下「上線」之前，照著這份清單逐項打勾，能擋下九成的低級失誤。這份清單把前面各步驟的關鍵檢查點濃縮成一份可執行的核對表，建議在第一次上線、以及之後每次更動按鈕設定後都跑一遍。
- LINE Developers 的 Bot basic ID 已複製，對應到正確的官方帳號。
- Chaty 的 LINE 管道連結格式為 line.me/ti/p/你的ID，無多餘的 http:// 或空白。
- 行動版顯示已開啟，桌面版視網站類型決定。
- 用無痕視窗與手機實測過，按鈕能導向自己的官方帳號聊天室。
- 按鈕位置不擋住主要內容、結帳按鈕與置頂通知列。
- 觸發條件已設成離開意圖或捲動比例，避免進站即彈。
- CTA 文案明確（如「LINE 私訊問報價」），不是「點我」。
- 紅點提示只在有實際訊息時顯示。
- GTM 或 GA 串接已測試，點擊事件能送進 GA4。
- LINE 官方帳號的歡迎訊息與自動回覆已設好，避免訪客等不到回。
- 快取外掛已清快取，前台看到的是最新設定。
- Core Web Vitals 分數已記錄一組基準值，方便日後比對。
常見問答
WordPress 怎麼加 LINE 浮動按鈕？
最省事的做法是裝免費外掛 Chaty：到 LINE Developers 申請 Messaging API 頻道拿到 Bot basic ID，把 line.me/ti/p/你的ID 貼進 Chaty 的 LINE 管道欄位，再設定顯示裝置與觸發條件即可上線。
Chaty 外掛免費版夠用嗎？
對剛起步的形象網站通常夠用，依 Chaty 官方方案說明，免費版每月約可接觸 500 位用戶，支援超過 20 個通訊管道與基本觸發條件。等訊息量穩定上升、需要指定頁面顯示或 GA 串接時，再評估升級付費版。
怎麼取得 LINE 官方帳號的 Bot basic ID？
到 LINE Developers 用個人帳號登入，建立 Provider 與 Messaging API 頻道，完成後切換到該頻道的 Messaging API 面板，找到 Bot basic ID 並複製，步驟以 LINE 官方文件 為準。
LINE 按鈕要顯示在手機還是電腦版？
建議至少開啟行動版，因為多數詢問來自行動裝置。電腦版可依網站類型決定要不要同時開，形象網站建議兩者都開，純內容站則可只開行動版以免干擾桌面閱讀。
按鈕什麼時候出現轉換率最高？
設定成偵測到離開意圖才彈出，通常比進站即彈的點擊品質更好，因為這時訪客已瀏覽過內容、仍有興趣，較不會把按鈕當成干擾。捲動比例觸發是折衷方案，適合內容型網站。
LINE 按鈕會拖慢網站速度嗎？
Chaty 本身算輕量，但任何浮動按鈕都會多載 JavaScript 與圖示資源。建議搭配快取外掛，並留意 Core Web Vitals 分數變化，若分數明顯下滑再考慮調整按鈕設定或換裝更輕量的替代方案。
沒有 LINE 官方帳號可以加按鈕嗎？
可以，改用個人行動條碼連結也能把按鈕導到個人 LINE，但個人帳號無法穩定留存聊天紀錄、也難做自動回覆。若長期經營詢問流程，仍建議花十分鐘申請官方帳號。
Chaty 可以同時放 LINE 和 Messenger 嗎？
可以，Chaty 支援多管道整合，同一顆浮動按鈕可展開 LINE、Messenger、WhatsApp、電話等多個入口，按需增減即可，不必為每個管道各裝一個外掛。
怎麼追蹤 LINE 按鈕的點擊次數？
付費版可直接開啟 Chaty 內建的 GA 串接；免費版則透過 GTM 監聯按鈕點擊事件、送到 GA4，把點擊定義為微轉換，再對照 LINE 後台訊息進線量驗證實際轉換效果。
形象網站適合加 LINE 按鈕嗎？
適合，形象網站訪客本來就有主動聯絡的需求，一顆固定在角落的 LINE 按鈕能大幅降低詢問門檻。建議搭配離開意圖觸發，兼顧曝光與不打擾。
按鈕和置頂通知列打架怎麼辦？
把置頂通知列掛在頁面頂端，LINE 按鈕放右下角，是最不容易衝突的組合。若仍有重疊，可調整按鈕的 z-index 或改放左下角，確保兩者不會同時遮住彼此或主要內容。
免費版用戶數撞到上限會怎樣？
依 Chaty 官方方案說明，免費版每月約可接觸 500 位用戶，撞到上限時系統會提醒升級或等下月重算，按鈕本身不會直接失效。剛起步的站通常撞不到，等訊息量穩定上升再評估升級付費版即可。