LINE Social Plugins – 免費線上官方教學,幫助你添加 Line 官方分享、加入好友與按讚按鈕

LINE 在台灣目前是最大的社群媒體之一,現在大部分的網站在放置分享按鈕時,除了提供 Facebook 分享按鈕之外,漸漸的也可以看見 LINE 的分享或點讚按鈕,讓文章能夠更容易透過這些熱門的社群工具進行傳遞。

LINE 在台灣是目前最大的社群媒體之一,現在大部分的網站在放置分享按鈕時,除了提供 Facebook 分享按鈕之外,漸漸的也可以看見 LINE 的分享或點讚按鈕,讓文章能夠更容易透過這些熱門的社群工具進行傳遞。除了常見的使用第三方分享外掛所提供的 LINE 分享按紐之外,該如何在自己的網站當中,添加「Line 分享」、「Line 加入好友」與「Line 點讚」按鈕呢?

幸運的是,LINE 官方本身就有提供非常方便的設定頁面,在頁面中只需要添加你的網址或 LINE ID,就會可以自動產生「LINE 分享」按鍵、「加入好友」按鍵與「」按鍵。

Line it! ButtonPinPin
LINE 分享
Add FriendPinPin
LINE 加入好友
Like ButtonPinPin
LINE 讚

網站名稱:LINE Social Plugins
網站網址:https://social-plugins.line.me/zh_TW/

目錄

LINE 在台灣的社群影響力與網站整合價值

LINE 在台灣的即時通訊市場佔有率長年穩居第一,活躍用戶數超過 2100 萬,滲透率逼近九成。這意味著幾乎每一位台灣網路使用者每天都在使用 LINE,從傳訊息、看新聞到購物,LINE 已經成為日常不可或缺的工具。對於經營網站或部落格的人來說,善用 LINE 的社群功能來推廣內容,是在台灣市場做SEO站內優化之外,另一條值得投入的流量成長路徑。

當讀者在你的網站上看到一篇實用的文章,如果剛好旁邊就有 LINE 分享按鈕,一鍵就能把文章轉傳到群組或好友聊天室。比起複製網址再貼到 LINE 裡面,這個動作的摩擦力大幅降低。根據多項網站營運資料顯示,在網站上加入 LINE 分享按鈕之後,社群分享次數通常能提升 15% 到 30%,而且來自 LINE 的流量品質往往不錯,因為分享的行為本身就帶有好友之間的信任背書。

不少站長在安裝社群分享工具時,直覺會先想到 Facebook 或 X(原 Twitter),卻忽略了 LINE 在台灣的影響力。尤其如果你的網站受眾以台灣使用者為主,LINE 的分享轉換率在很多情境下甚至比 Facebook 來得更好。這也是為什麼學會在網站上嵌入 LINE 官方提供的社群按鈕,是每一位台灣站長都值得掌握的實用技能。

LINE Social Plugins 是什麼?三大功能總覽

LINE Social Plugins 是 LINE 官方提供的免費網頁元件產生器,讓網站管理者不需要任何程式基礎,就能在自己的網頁上嵌入 LINE 的社群互動按鈕。這套工具提供三種主要功能,分別是「分享按鈕」、「加入好友按鈕」和「按讚按鈕」,每一種都有獨立的設定區塊,可以單獨使用或搭配組合。

LINE 分享按鈕(Share Button)

分享按鈕讓網站訪客一鍵將當前頁面分享到 LINE 的聊天室或貼文串。使用者點擊後會跳轉到 LINE 的分享介面,可以選擇要傳送給哪位好友或哪個群組。這是目前最泛用的 LINE 社群按鈕,因為它不需要站長擁有 LINE 官方帳號就能使用。

Line it! ButtonPinPin
LINE 分享

LINE 加入好友按鈕(Add Friend Button)

加入好友按鈕讓訪客直接從你的網頁上加入你的 LINE 官方帳號好友。這對於經營品牌社群、客服管道或推播訊息的商家來說非常實用。不過這個功能有一個前提:你必須擁有 LINE 官方帳號(前身為 LINE@ 帳號),一般個人的 LINE ID 是無法使用的。

Add FriendPinPin
LINE 加入好友

LINE 按讚按鈕(Like Button)

按讚按鈕提供了一種更輕量的互動方式。訪客可以對你的頁面按讚,你可以選擇讓按讚動作同時分享到使用者的主頁,或只記錄按讚數。這個按鈕還可以追加「加入好友」的附加功能,讓使用者在按讚的同時也能一併加你為好友。

Like ButtonPinPin
LINE 讚

三種按鈕功能比較

功能需要官方帳號主要用途按鈕樣式數量
分享按鈕不需要讓訪客分享網頁到 LINE6 種
加入好友需要(官方帳號/LINE@)讓訪客加入你的 LINE 好友3 種
按讚按鈕不需要(追加好友功能需要)記錄按讚數與互動2 種模式

如何進入 LINE Social Plugins 官方設定頁面

LINE Social Plugins 官方網址與進入方式

LINE Social Plugins 的官方設定頁面網址是:https://social-plugins.line.me/zh_TW/。直接點擊這個連結就能進入繁體中文版的設定介面。進入之後你會看到頁面分為三個主要區塊,分別對應「分享」、「加入好友」和「按讚」三種按鈕的設定。每個區塊都是獨立運作的,你可以只設定其中一種按鈕,也可以三種全部設定。

設定頁面的整體架構說明

每一個按鈕區塊的設定流程都大同小異:先在欄位中輸入對應的資訊(網址或 LINE ID),然後選擇你想要的按鈕外觀樣式,頁面下方會即時顯示按鈕預覽,確認沒問題後就可以複製自動產生的 HTML 程式碼。產生分享按鈕的程式碼完全不需要登入 LINE 帳號,但如果要設定加入好友按鈕,你就必須先擁有 LINE 官方帳號並知道你的 LINE ID。

整個設定流程的設計非常直覺,對於完全不懂程式的使用者來說也沒有門檻。接下來筆者會分別針對三種按鈕,一步步帶你完成設定。

設定「LINE 分享」按鈕的完整教學

步驟 1:輸入網址

進入 LINE Social Plugins 設定頁面後,在「分享」區塊的第一個欄位,輸入你想要讓使用者分享的目標網址。這個網址可以是你的網站首頁、某一篇特定文章的網址,或者是任何你想推廣的頁面連結。如果你打算搭配縮網址工具來追蹤分享成效,也可以先產生短網址再填入。

步驟 2:選擇按鈕樣式

輸入網址之後,下一步是選擇按鈕的外觀。LINE 提供了 6 種不同的設計樣式,從簡潔的圖示按鈕到帶有文字說明的版本都有。你還可以設定兩個額外選項:是否要在按鈕旁邊顯示分享次數,以及按鈕的顯示大小(標準或小型)。如果你對圖標設計有特別偏好,可以在這裡挑選最符合你網站風格的樣式。

步驟 3:複製程式碼與預覽

在設定區塊的下方會有一個即時預覽區域,讓你馬上看到按鈕實際呈現的樣子。確認按鈕樣式是你想要的之後,點擊右側自動產生的程式碼區域就可以複製整段 HTML。把這段程式碼貼到你網頁中想要顯示按鈕的位置即可。如果你使用的是 WordPress,後面會詳細說明嵌入的具體方式

設定「LINE 分享」按鈕Pin
設定「LINE 分享」按鈕

設定「加入好友」按鈕的完整教學

LINE 官方帳號與 LINE@ 的差異

在開始設定「加入好友」按鈕之前,有一件重要的事情要先釐清:這個功能僅限於持有 LINE 官方帳號(前身為 LINE@ 帳號)的使用者。LINE 在 2019 年將原本的 LINE@ 服務整併到「LINE 官方帳號」體系之下,所以現在統一稱為 LINE 官方帳號。如果你目前只有一般的個人 LINE 帳號,是無法使用加入好友按鈕的,必須先到 LINE 官方帳號的管理後台申請一個官方帳號,取得專屬的 LINE ID 之後才能繼續。

步驟 1:輸入 LINE ID

在「加入好友」的設定區塊中,第一個欄位要填入的是你的 LINE 官方帳號 ID。這個 ID 就是使用者在 LINE 搜尋列中輸入用來找到你帳號的那組名稱。如果你不確定自己的 LINE ID,可以到 LINE 官方帳號管理後台的「帳號設定」中查看。這個 ID 和你個人帳號的名稱是不同的,不要搞混了。

步驟 2:選擇按鈕樣式

加入好友按鈕目前提供 3 種不同的樣式選擇:

  1. 顯示好友人數以及前往首頁的按鈕
  2. 僅顯示好友人數
  3. 僅顯示「加入好友」按鈕

如果你的好友數量已經有一定規模,選擇第一種樣式可以產生社會認同效果,讓新訪客更願意加入。如果是剛起步的帳號,第三種簡潔樣式反而比較不會讓人注意到數字。這跟電子報訂閱數位名片的設計邏輯類似,都取決於你想呈現什麼樣的品牌形象。

步驟 3:複製程式碼

選好樣式後,下方同樣會即時預覽按鈕的外觀。確認沒問題就可以複製右側自動產生的程式碼,貼到你網頁的適當位置。如果你想在 WordPress 的側邊欄或頁尾放置加入好友按鈕,可以參考後面 WordPress 嵌入方法的段落。

設定「加入好友」按鈕Pin
設定「加入好友」按鈕

設定「按讚」按鈕的完整教學

按讚按鈕的兩種模式

「按讚」按鈕的設定頁面提供了兩種不同的操作模式:「按讚並分享」「按讚」。這兩種模式的差異在於使用者按下按鈕之後的行為。

如果你選擇「按讚並分享」,當使用者點擊按鈕時,除了記錄一次按讚之外,這個頁面還會被分享到使用者的 LINE 主頁,並且顯示在他的好友貼文串上。這等於是一次按鈕操作就完成了兩件事:互動記錄加上內容傳播,曝光效果加乘。

如果你選擇單純的「按讚」模式,那使用者的按讚動作就不會被發布到主頁上,只會增加頁面上的按讚計數。對於想要收集讀者回饋但又不希望強制分享的場景來說,這個模式比較合適。如果你也經營 WordPress 網站並關心留言功能管理,這個概念跟開放或關閉留言區的道理類似,都是站長對互動方式的選擇。

設定「讚」按鈕Pin
設定「讚」按鈕

在按讚中追加加入好友功能

「按讚」按鈕有一個實用的隱藏功能,就是在按讚按鈕中追加加入好友的選項。在設定的「加入好友」選項裡勾選「含追加選項」,然後輸入你的 LINE 官方帳號 ID,按讚按鈕的旁邊就會多出一個「+ 好友」的按鈕。當使用者點擊按讚時,就會看到加入好友的引導。

這個組合功能對於同時想要累積按讚數和拓展 LINE 好友基礎的站長來說非常方便,不用分開放置兩個按鈕,一個元件就搞定兩件事。

在按讚功能中同時啟用加入好友功能Pin
在按讚功能中同時啟用加入好友功能

在 WordPress 網站中嵌入 LINE 按鈕的方法

完成了 LINE 按鈕的設定和程式碼產生之後,接下來要面對的就是實際把程式碼放進網站的步驟。如果你使用的是 WordPress 架站,以下提供三種最常用的嵌入方式,從簡單到進階依序說明。

方法一:透過自訂 HTML 區塊貼上程式碼

這是最直接也最簡單的做法。在 WordPress 的 Gutenberg 區塊編輯器中,新增一個「自訂 HTML」區塊,把從 LINE Social Plugins 頁面複製的程式碼貼進去就行了。你可以把這個區塊放在文章標題下方、文章內容中間,或文章結尾處。

如果你還在習慣 Gutenberg 編輯器,或者剛從傳統編輯器轉過來,不用擔心,「自訂 HTML」區塊的使用方式跟貼上文字一樣直覺。這個方法的優點是彈性最高,你可以精準控制每一篇文章要顯示按鈕的位置;缺點則是需要手動在每篇文章中貼上程式碼。

方法二:使用佈景主題的 Widget 區域

大部分的 WordPress 佈景主題都提供了側邊欄、頁尾或其他區域的 Widget 位置。你可以到 WordPress 後台的「外觀 > Widget」頁面,找到一個「自訂 HTML」Widget,把 LINE 按鈕的程式碼貼進去,然後將這個 Widget 放到你想顯示的位置(例如側邊欄的固定區域)。

這個方式的好處是一次設定就能讓按鈕在全站的特定區域持續顯示,不需要每篇文章都重複操作。如果你的網站使用的是支援自訂捲動條或 Widget 客製化的佈景主題,整合 LINE 按鈕會更加方便。

方法三:透過 functions.php 全站自動嵌入

對於有一定技術基礎的站長,可以在子佈景主題的 functions.php 檔案中加入一段程式碼,讓 LINE 按鈕自動在每篇文章的特定位置(例如文章結尾)顯示。這個做法的優點是一次設定永遠生效,新增的文章也會自動帶上按鈕,不需要每次手動貼程式碼。

不過要提醒一點,修改 functions.php 屬於進階操作,建議先在測試環境中確認效果再套用到正式網站。如果你是使用 CloudAccessDemosWP 這類免費 WordPress 測試平台,可以先在那邊練習操作。如果你正在尋找適合的正式主機方案,可以參考這篇 EasyEngine 安裝 WordPress 教學或是直接選擇 Hostinger 等平價主機。

嵌入位置的建議

LINE 按鈕放在哪裡效果最好?根據實際營運經驗,以下幾個位置通常有較高的互動率:

  • 文章標題下方:讀者剛看到標題、對內容產生興趣時,很容易順手分享
  • 文章結尾處:讀完文章後如果覺得有收穫,分享意願最高
  • 側邊欄固定區域:全站可見,適合放置加入好友按鈕
  • 浮動按鈕:在頁面側邊固定顯示,不佔文章版面,不影響網站載入速度

在行動裝置上,LINE 按鈕的顯示效果尤其重要。因為 LINE 本身就是以行動端為主的應用,手機使用者點擊分享按鈕的轉換率通常高於桌面版。建議在測試嵌入效果時,務必同時檢查手機端的呈現。

LINE 按鈕 vs 其他社群分享按鈕的比較

在決定要放哪些社群分享按鈕時,站長經常會猶豫:LINE 值得放嗎?跟 Facebook 按鈕比起來誰的效果好?事實上,這不是非此即彼的選擇。了解每個平台的特性,才能做出最適合你網站的組合。

LINE vs Facebook 分享按鈕

Facebook 在全球社群媒體的覆蓋面無庸置疑,但在台灣的即時通訊場景中,LINE 的使用頻率和黏著度都更高。Facebook 分享的優點是公開傳播,一則貼文可以被很多人的朋友看到;LINE 分享的優點是私密傳播,分享到群組或好友聊天室的內容帶有更強的信任感。如果你的網站內容屬於實用教學型(例如食譜、旅遊攻略、購物指南),在台灣市場 LINE 分享帶來的回流率往往不輸 Facebook。你可以搭配 Facebook 分享偵錯工具來確保 Facebook 分享的預覽縮圖和描述正確,同時也別忘了設定好 LINE 分享的標題和描述。

LINE vs X(Twitter)分享按鈕

X(原 Twitter)在台灣的使用者基數相對較小,主要活躍族群集中在科技圈、媒體圈和政治圈。如果你的網站主題是國際新聞或科技趨勢,X 的分享按鈕可能有一定價值;但對於大多數以台灣一般大眾為目標的網站來說,LINE 分享按鈕的投資報酬率遠高於 X。

多平台社群按鈕的整合建議

社群平台台灣用戶基數分享特性適合的網站類型
LINE2100 萬+私密群組/好友分享,信任度高所有台灣市場網站
Facebook1800 萬+公開分享,觸及面廣品牌、媒體、社群型網站
X(Twitter)約 200 萬公開即時分享,話題性強科技、國際、媒體網站

實務上最推薦的做法是同時安裝 LINE 和 Facebook 的分享按鈕,讓讀者自行選擇偏好的分享管道。如果你有在使用 Site Kit by Google 來整合網站資料,也可以觀察不同社群平台帶來的流量差異。同時別忘了做好Meta Tag 設定,確保每個平台分享時的預覽資訊都是正確的。如果你想進一步分析競爭對手的社群策略,Detailed SEO Extension 是一個好用的 Chrome 擴充工具。

LINE 社群按鈕的進階應用與成效追蹤

追蹤 LINE 分享成效的方法

在網站上加了 LINE 分享按鈕之後,你會想知道到底有多少人使用了它、帶來了多少流量。最基本的做法是在分享按鈕的目標網址後面加上 UTM 追蹤參數,例如在網址後方加上 ?utm_source=line&utm_medium=share&utm_campaign=social_button。這樣一來,當使用者在 LINE 裡點擊這個連結回到你的網站時,Google Analytics 就能準確地辨識流量來源。

A/B 測試按鈕位置與樣式

按鈕放在哪裡、用什麼樣式,都會影響分享率。你可以嘗試把按鈕從文章結尾移到標題下方,觀察一兩週的分享資料變化。或者測試不同的按鈕樣式(帶計數器 vs 不帶計數器、大按鈕 vs 小按鈕),找出最有效的組合。這個測試邏輯跟做 On-page SEO 的 A/B 測試是一樣的,用資料來驅動優化決策。

搭配 Google Analytics 分析流量來源

如果你在 WordPress 中安裝了 Site Kit by Google 外掛,可以直接在 WordPress 後台查看來自 LINE 的流量資料,不需要額外登入 Google Analytics。觀察的重點指標包括:LINE 帶來的工作階段數、跳出率、平均停留時間和轉換率。一般來說,來自 LINE 分享的流量因為帶有好友推薦的性質,跳出率通常會比一般社群流量低 10% 到 20%。

在追蹤成效的同時,也別忘了留意網站的整體效能。社群按鈕的 JavaScript 載入可能對網站載入速度產生些微影響,建議使用 GiftofSpeedCloudflare 的速度測試工具定期檢查。如果你發現按鈕腳本拖慢了網站,可以考慮延遲載入(lazy load),讓按鈕在使用者捲動到對應位置時才開始載入。

LINE 官方帳號申請與 LINE@ 基礎認識

什麼是 LINE 官方帳號

LINE 官方帳號是 LINE 提供給企業、商家、組織和個人品牌使用的官方身份。跟一般個人的 LINE 帳號不同,官方帳號可以被任何人搜尋到並加入好友,而且支援一對多推播訊息、自動回應、圖文選單等行銷功能。在台灣,從連鎖餐飲、電商平台到地方小吃店,幾乎所有有在做數位行銷的商家都會申請一個 LINE 官方帳號。

LINE@ 與一般 LINE 帳號的差異

LINE@ 是 LINE 在早期提供給小型商家使用的官方帳號方案,但在 2019 年 LINE 已經將 LINE@ 整併到「LINE 官方帳號」體系中。所以現在如果你聽到有人提到「LINE@ 帳號」,指的其實就是 LINE 官方帳號。一般個人 LINE 帳號和官方帳號的差異在於:個人帳號的好友上限較低,也沒有推播訊息和自動回應等功能;官方帳號則支援大量好友管理、行銷推播、資料分析,以及本文所介紹的社群按鈕中的「加入好友」功能。

申請 LINE 官方帳號的基本步驟

申請 LINE 官方帳號的流程並不複雜,大致分為以下幾步:

  1. 前往 LINE 官方帳號的管理頁面(LINE Biz-Solution)並登入
  2. 選擇「建立官方帳號」
  3. 填寫帳號名稱、類別和基本資訊
  4. 選擇方案:免費方案或付費方案(主要差異在於推播訊息的次數和好友上限)
  5. 完成設定後,你就會拿到一組 LINE ID,這組 ID 就是用來設定「加入好友」按鈕的關鍵

取得 LINE ID 之後,回到 LINE Social Plugins 的「加入好友」設定區塊,把 ID 填入欄位就能產生按鈕了。如果你同時也想在網站上提供即時客服管道,可以考慮搭配 WordPress 的線上客服外掛,讓訪客在等待 LINE 回覆的期間也有其他聯繫管道可用。

LINE Social Plugins 常見問題 FAQ

LINE 分享按鈕需要付費嗎?

完全免費。LINE Social Plugins 是 LINE 官方提供的免費工具,任何人都可以使用「分享」按鈕的程式碼產生功能,不需要付費也不需要登入帳號。如果你是使用 HostingerDreamHostWordPress 主機來架站,這個工具同樣適用,不會因為主機不同而有差異。

一般個人 LINE 帳號可以使用加入好友按鈕嗎?

不行。加入好友按鈕僅限於 LINE 官方帳號(前身為 LINE@ 帳號)的使用者。如果你只有一般個人 LINE 帳號,必須先到 LINE 官方帳號管理頁面申請一個官方帳號,取得 LINE ID 後才能設定加入好友按鈕。不過「分享」按鈕和純「按讚」按鈕則不需要官方帳號。

LINE 按鈕在手機上能正常顯示嗎?

可以。LINE Social Plugins 產生的按鈕是響應式設計,在桌面瀏覽器和行動裝置上都能正常顯示和運作。事實上,因為 LINE 本身是以行動端為主的應用程式,手機使用者點擊分享按鈕的轉換率通常比桌機使用者更高。不論你的網站是放在 A2 Hosting 還是 SiteGround 上,按鈕的顯示效果都不受影響。

為什麼分享按鈕的分享次數沒有更新?

分享次數的統計不是即時更新的,通常會有一段延遲(幾分鐘到幾小時不等)。如果你有選擇在按鈕旁邊顯示分享次數,可以耐心等待一段時間讓資料更新。如果你的網站有使用 GZIP 壓縮快取外掛,也可能因為快取的關係讓前端顯示的數字不是最新的,清除快取後就能看到更新後的數值。

如何在 WordPress 全站自動加入 LINE 按鈕?

最推薦的做法是透過子佈景主題的 functions.php 檔案,使用 WordPress 的 hook(例如 the_content)來自動在每篇文章的特定位置插入 LINE 按鈕的程式碼。如果不熟悉程式碼,也可以使用 Widget 區域的方式,在側邊欄或頁尾放置一個自訂 HTML Widget 來顯示按鈕。如果你使用的是 FastCometKinsta 等支援暫存環境的主機,可以先在暫存站測試效果再上線。

LINE 按讚按鈕和 Facebook 按讚有什麼不同?

LINE 的按讚按鈕和 Facebook 按讚最大的不同在於「按讚並分享」的行為。LINE 的「按讚並分享」模式會將頁面內容發布到使用者的 LINE 主頁貼文串上,等同於一次按讚加上一次分享。而 Facebook 的按讚通常只是記錄互動,不會將內容發布到塗鴉牆上(分享才會)。LINE 按讚的觸及範圍集中在使用者的 LINE 好友圈,Facebook 按讚的影響力則在 Facebook 的社交圖譜中擴散。你可以使用 Algolia 等站內搜尋工具來追蹤哪些文章被按讚最多。

LINE Social Plugins 支援哪些網站平台?

LINE Social Plugins 產生的是標準 HTML 程式碼,理論上可以嵌入到任何支援自訂 HTML 的網站平台。包含但不限於 WordPress、Blogger、Blogspot、Shopify、Wix、Squarespace 等。不過最方便的平台還是 WordPress,因為它有完整的自訂 HTML 區塊和 Widget 功能。如果你還沒有網站,可以參考 Bluehost WordPress 安裝教學快速架站,或者看看這篇 WordPress vs Blogger 比較來選擇適合的平台。

LINE Social Plugins - 免費線上官方教學,幫助你添加 Line 官方分享、加入好友與按讚按鈕Pin

LINE Social Plugins 評價推薦優點

  • 官方提供的設定功能
  • 免費設定 LINE 社群按鈕
  • 不會程式也能產生按鈕功能
Sliven 褚崇名
Sliven 褚崇名

每日分享科技新知、免費資源以及 WordPress、虛擬主機相關主題,任何問題歡迎在科技月球下方留言,或是發送 Email 至 [email protected] 與我聯繫。

文章: 669

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *


目錄

目錄
Share to...