FIRST LINE 企業級客服系統
🫱 官方網站🔥 最新消息
  • ❤️關於 FIRST LINE
    • 🥰客服中心
    • 📔更新日誌
      • 🐍2025
      • ☎️電話管理系統
      • 🍱Archive
        • 🐲2024
        • 🐰2023
        • 🐯2022
        • 🐮2021
        • 🐭2020
  • 指南與解答
    • 🚀指南
      • 🤖打造專屬聊天機器人
      • 🧠FIRST LINE AI
      • 🏗️管理者系統建置
      • 👋客服人員:訊息服務
      • 📥服務台:解決與紀錄客戶問題
      • 🔃交談分派的運作模式
      • 💬3 種 WhatsApp 帳號種類大解析!
    • 📔名詞解釋
    • ❓系統疑難
      • ⚠️提示或告警訊息
      • 📶網路離線提醒
      • 🌎支援的瀏覽器
      • 🪠清除瀏覽器快取
  • 功能教學
    • 💬管道
      • 💬即時聊天
        • 疑難雜症
        • 客戶身份驗證
        • 安裝範例
          • 嵌入至 LINE 內服務客戶
          • 安裝於 SHOPLINE 內
          • 安裝於 Shopify 內
      • 💬LINE 官方帳號
        • 如何啟用 Messaging API
        • LINE 訊息費用怎麼算
        • LINE Developer 相關
      • 💬Facebook Messenger
        • 疑難雜症
        • 錯誤代碼 #2022
      • 💬Instagram
      • 💬微信公眾號
      • 💬WhatsApp (Cloud API)
        • 疑難雜症
      • 💬WhatsApp (Twilio)
      • 💬Telegram
      • 💬Viber
      • 📮電子信箱
        • 電子郵件分隔文本
        • 電子郵件附件
        • Gmail 串接測試
      • 📱簡訊
        • Twilio
        • 三竹簡訊
      • ☎️電話
        • ❓疑難雜症
        • 👨‍💻調整或分配分機給專員
        • 📕通話時服務紀錄沒有建立
        • ⤴️轉接與三方通話
        • 😃座席狀態
        • ☎️電話 SIP 代碼
        • 📊通話資訊
      • 🏪線上下通路
    • 📈儀錶板
      • 📊服務水平
      • ☎️電話
      • ☎️專員電話即時狀態
      • 😃社群媒體好友數
      • 📈訊息統計
      • 💬交談佇列
    • 😀客戶關係管理
      • 😀客戶
        • 🔃客戶合併
      • 🏢公司
      • ⬇️匯入客戶
      • 匯入自訂表格
      • 🤝服務紀錄
        • 💬交談紀錄
      • 🔖服務結果
      • ✏️服務原因
      • 自訂欄位
      • 資料匯出
      • 電話紀錄
    • 🤖聊天機器人
      • 📒交談腳本
        • ❓疑難雜症
        • 🚀功能詳解
          • 🧠FIRST LINE AI
          • 📃模組腳本
          • 🔜分派權重
          • 📒事件紀錄
          • 📔草稿與發佈
          • 🗂️輪播訊息
          • 🔘按鈕行為
        • 🎬情境範例
          • 串接 ChatGPT
          • 搜尋與回覆知識庫文章
          • 緊急信件轉派
          • 封鎖名單
          • Webhook 整合指南
          • 如何透過 API 溝通
        • 📊統計數字
        • 從即時聊天 URL 添加數據
      • 😀滿意度調查
      • 🧠AI 訓練資源
      • 🕐營業時間
      • 🤖自動回應
        • 關鍵字回應
    • 💡知識庫
      • 幫助中心
        • 擴充自訂義 HTML
      • 聊天機器人
    • 🎟️工單
      • 工單範本
      • 關注工單
      • 透過電子信箱發送
      • 狀態細項
    • 🛍️行銷
      • 🛍️產品目錄
      • 📢分眾訊息
        • 自動化活動
      • 🎡LINE 圖文選單
      • 📃貼文自動回覆
      • 😁對話角色
      • 🎟️優惠卷
      • 🔗追蹤連結
    • 🔌整合
      • 🚗自動化
        • 範例:發送 LINE 訊息
        • 範例:會員同步
        • 範例:發送 Teams 通知
      • ⛓️Webhook 腳本
    • 📃報表
      • ☎️電話
        • 專員通話效率
        • 通話紀錄報表
        • ACD 號碼分析
      • 服務紀錄明細與樞紐
      • 專員服務效率
      • 訊息管道樞紐
    • ⚒️輔助工具
      • 管道整合
      • 信件範本
      • 對話腳本
      • 訊息範本
    • ⚙️系統設定
      • 🏢企業
        • 🏢系統設定
        • 🧑‍🤝‍🧑部門
        • 💰帳務總覽
        • 🔥IP 允許清單
        • 組別
        • 業主
        • 🗺️地址
          • 縣市
          • 行政區域
          • 國家
        • 🔐權限
      • 😀客戶
        • 客戶分派
      • 🤝服務紀錄
        • 服務原因
      • 🎙️員工
        • 服務狀態
        • 更改或忘記密碼
      • 🗄️檔案管理
      • 💪技能
      • 👜職位
      • 💬開場白與話術
    • 🚀其他資料
      • 🔵Fancy 點數
      • 👨‍💻模板語法
      • 💬交談狀態
      • 🔍全域搜尋
      • 👨‍💻交談腳本變數
      • 📄資料欄位類型
      • 🌐IP 與網域清單
      • 💬各管道訊息類型支援度
    • ✊合作夥伴
      • 📞電話疑難雜症
      • 🎛️其他相關設定
  • 開發文件
    • API 說明
      • 請求方式說明
      • 回應物件資料
      • 😀客戶
      • 🔖客戶標籤
      • 🏢公司
      • ⬇️客戶匯入排程
      • ⬇️客戶自訂表格匯入排程
      • 📄自訂欄位主分類
      • 📄自訂欄位
      • 📄自訂表格
      • ☎️電話號碼
      • 🌎國家、縣市及區域
      • 🏠地址
      • 📧電子信箱
      • 🎫工單
      • 💬服務紀錄
      • 😃滿意度調查
      • 🛍️產品
      • 📄訂單
      • 📦訂單品項
    • Advanced
      • 透過 Hash 值取得 Text-Call ID
      • 透過 Text-Call ID 發送訊息
      • 搜尋聯絡人資料(Partner Limit)
      • Push (Partner Limit)
    • 即時聊天 Javascript API
Powered by GitBook
On this page
  • 1. 新增即時聊天
  • 2. 建立 LIFF 連結
  • 新增 LINE Logon
  • 填寫表單
  • 設定 LIFF
  • 完成 LIFF
  • 3. 🎉 開始服務客戶
  1. 功能教學
  2. 管道
  3. 即時聊天
  4. 安裝範例

嵌入至 LINE 內服務客戶

透過 LIFF 整合,將客戶導向即時聊天,替代 Message API 傳遞對話,且不需網頁跳轉,就能夠有效的減少推播花費。

Previous安裝範例Next安裝於 SHOPLINE 內

Last updated 1 year ago

1. 新增即時聊天

首先,我們需要先建立「即時聊天」管道,透過新增的「即時聊天」嵌入於 LINE 中服務客戶,你可以於設定頁面依據企業性質,輸入「描述」、「問候語」、配色 ...等設定,打造企業形象。

當資料設定完成,按下「儲存」新增後,點擊「嵌入代碼」頁籤,移動至下方的「啟用外部網址」設定。

進行以下操作 1. 開啟「啟用外部網址」。 2.複製下方連結網址,稍後將於第二步驟於 LINE 使用到。

2. 建立 LIFF 連結

LIFF 全名是「LINE Front-end Framework」,是由 LINE 官方所提供的 Web App 平台,可以透過此方式取得 LINE 使用者相關資訊,藉此可以呈現出各式各樣的應用。

新增 LINE Logon

Channel 共有 5 種形式供選擇,因我們需要使用 LIFF 的功能,所以選擇「LINE Login」方式。

填寫表單

接著依據必填項目填寫 Channel 表單,其中,在「App types」的那項選擇「Web app」,填寫完畢後按下「Create」新增。

設定 LIFF

當新增完畢後,就會看見「LIFF」的頁籤項目。點擊「Add」就可以進行新增 LIFF。

接著,將解說幾個設定項目

Size

Size 共有三個值,分別為 Full、Tall、Compact。表示當用戶打開 LIFF 時,顯示的彈出高度設定。依據官方文件說明,高度顯示如下:

Endpoint URL

Scopes

此項目代表我們需要拿取來自 LINE 的哪些資料,基本將全部項目勾選,已方便配合未來新增功能。

  • openid:取得用戶的 token。

  • profile:取得用戶個人資訊,名稱、狀態等。

  • chat_message.write:是否能使用主動幫使用者發訊息的sendMessages 功能。

Bot link feature

當用戶首次登入建立的 LIFF 時,是否顯示加入官方帳號為好友的頁面,並如何顯示,這邊依據你的企業性質選擇即可。

  • normal:是否同意頁面顯示加入好友選項

  • aggressive:另開頁面顯示加入好友分頁

  • off:不顯示加入好友選項

完成 LIFF

新增好 LIFF 後,即可從列表查看到新增完成的資訊,這邊我們需要將 LIFF ID 貼回至「即時聊天」中「LIFF ID」欄位儲存即完成。

而旁邊的 LIFF URL,就是分享給客戶使用的網址,當客戶 LINE 上點擊網址時,就會啟動即時聊天,客戶就能與專員展開對話。

3. 🎉 開始服務客戶

當取得 LIFF 連結後,可以透過一些方式告知客戶使用,您可以透過「分眾訊息」、「自動回應」、「Rich Menu」新增「聯絡客服」按鈕等方式分享。

往後,客戶只要點選 LIFF 連結,就可以隨時看到訊息內容,也能隨時與專人聯繫。

注意:透過 LIFF 所進線的交談對話,實際使用的社群媒體為「即時聊天」,因此交談對話的顧客名稱應為「訪客」,而不會是 LINE 使用者名稱。

首先,先登入 建立相關資訊,選擇指定的 Provider,並按下「Create a new channel」新增 Channel。

指當 LINE 用戶點擊了 LIFF 連結,開啟的特定網址。假如這邊填寫的是 網址,那當用戶打開 LIFF 網址後,顯示就是 FIRST LINE 的首頁。

而我們在這邊要輸入的就是第一章「」步驟「外部網址」 https://xxxxxx.01.firstline.cc/livechat/messenger/1

💬
💬
LINE Developers
https://firstline.cc
即時聊天
設定 LIFF 項目
複製 LIFF ID
貼上位於「即時聊天」設定
enjoy it.