我們可以如何幫助你?
你可以掃描此行動條碼,或點擊下方按鈕,加入 OakMega 的官方帳號,告訴我們你的需求。

加入好友
關閉按鈕
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
如何從 LINE Developers 開設 LIFF App?

LINE 經營教學進階篇|如何從 LINE Developers 開設 LIFF App?

為 LINE 官方帳號開設完 LINE Login後,這次要接續和大家分享 LINE Login 中一個重要的功能:LIFF App,同時也是 LINE 特有的功能哦!我們會介紹怎麼透過 LINE Developers 的 LINE Login Channel 新增一個 LIFF App,以及簡單說明關於 LIFF App 的一些使用情境。

Khan Lee
CTO
2021-09-24

為 LINE 官方帳號開設完 LINE Login後,這次要接續和大家分享 LINE Login 中一個重要的功能:LIFF App,我們會介紹新增一個 LIFF App 的方式,以及使用情境,在設定教學之前,好像有很多人還不知道什麼是 LIFF App,那麼就先簡單介紹一下 LIFF App 吧!

什麼是 LIFF App?

我們先來看看 LINE Developers 對於 LIFF App 的定義:LINE Front-end Framework (LIFF) is a platform for web apps provided by LINE. The web apps running on this platform are called LIFF apps.

直接翻譯成中文然後濃縮的意思就是:

LIFF App 為在平台上運作的 web apps,而這個平台叫做 LINE Front-end Framework (LIFF)。

再濃縮一次的話,可以把 LIFF App 想像成即時通訊軟體 LINE 的內建瀏覽器,當好友透過這個內建瀏覽器進行操作,LIFF App 可以幫助商家獲得用戶的 LINE 資訊,例如好友的 user ID(當然是在獲得好友允許搜集其資料的前提下)。

如何開設 LIFF App?

了解完什麼是 LIFF App 之後,我們該如何新增一個 LIFF App 呢?你可以透過 LINE Developers 進行 LIFF App 開設。要特別注意不是透過 LINE 官方帳號管理後台開設哦!很多人常常分不清這兩個管理平台(這裡提供個簡單的二分法:所有的技術設定找 LINE Developers;與好友互動、經營官方帳號找 LINE 官方帳號管理後台)。

由於 LIFF App 是隸屬在 LINE Login 下面,所以我們必須要先擁有一個 LINE Login,還沒有 LINE Login 的話可以先閱讀以下教學文章:

如何從 LINE Developers 開設 LINE Login?
正在經營 LINE 官方帳號的你也到了需要開設 LINE Login 的階段了嗎?開始進行 LINE Login 開設教學之前,還是先簡單介紹一下什麼是 LINE Login,以及 LINE Login 的使用情境吧!

那麼我們就來新增一個 LIFF App 吧!

步驟一:登入 LINE Login

  1. 首先,在 LINE Developers 頁面畫面右上角點選「Log in」,利用「LINE Business ID」登入 LINE Developers 後台。

  1. 進入 LINE Developers 後,在對應的 Provider 中找到並點選想要新增 LIFF App 的 LINE Login Channel

  1. 進入對應的 LINE Login Channel 後,在上排找到「LIFF 分頁」並點選。

  1. 進入 LIFF 分頁後,接續下滑頁面,點選 「Add」開始新增一個 LIFF App。

步驟二:輸入資訊

  1. 新增一個 LIFF App 需要輸入一些基本資訊(Basic information),依照畫面指示依序填入:
  1. LIFF app name:僅會顯示在 LINE Developers 後台,LINE 好友點選 LIFF App 時並不會看到,填入品牌名稱。
  2. Size:LIFF App 在 LINE 被打開時版面呈現的大小,勾選「Fall」讓 LIFF App 全螢幕完整顯示(Tall 為 70% 顯示,Compact 為 50% 顯示)。

  1. 接續填寫基本資訊(Basic information):
  1. Endpoint URL:好友打開 LIFF App 時會前往的網址,填入品牌的官方網站,或是任何你想要設定的網址。
  2. Scopes:希望在 LIFF App 內搜集的資訊,將「profile」和「openid」都勾選起來。
  3. Bot link feature:當好友打開 LIFF App 時是否要將好友資料綁定到 LINE 官方帳號,勾選「On(Normal)」。

  1. 接續填寫 Options:
  1. Scan QR:不勾選。
  2. Module Mode:勾選開啟(只會在 Size 選項選擇「Tall」,或是「Compact」時出現)。

  1. 填寫完成後,點選「Add」我們就可以得到第一個 LIFF App 了!

  1. 將 LIFF URL 複製起來貼到 LINE 訊息框裡面,接著拿起手機點開連結看看 LIFF APP 的設定成果吧!

關於 LIFF App 的一些常見問題

我們整理了第一次開設完 LIFF App 可能會遇到的幾個常見問題:

問題一:完成 LIFF App 設定後,真的有在瀏覽器內成功搜集用戶資訊嗎?

這個部分與 LINE Login 一樣,會需要工程師協助進行網頁設計的更動,才有辦法將藉由 LIFF App 蒐集到的資訊整理到自家的伺服器哦!我們之後會有一篇詳細的教學文章,提供給工程師們參考,請持續鎖定「OakMega LINE 經營大補帖」!

問題二:為什麼其他 LINE 官方帳號 LIFF App 可以搜集 Email?

那是因為他們有針對 LINE Login 進行額外設定,所以在 LIFF App 的 Scopes 選項可以勾選 email,讓好友的電子郵件資料一併被搜集。

問題三:還是不太懂 Bot link feature 的功用?

針對 Bot link feature,我們之後會有一篇詳細的介紹文章,請持續鎖定「OakMega LINE 經營大補帖」!

想知道更多關於 LINE 經營的方法嗎?要怎麼讓 LIFF App 出現的版型縮小呢?快前往 OakMega LINE 官方帳號了解更多 LINE 經營內容,或是關注我們的「OakMega LINE 經營大補帖」,提供從零到ㄧ、完整建置品牌 LINE 官方帳號的教學。

立即加入 OakMega LINE 官方帳號,了解更多 LINE 經營內容!
OakMega 2023 免費資源
解析次世代生成式智能客服中心
icon check
AI 如何顛覆客服中心
icon check
AI 如何達成客人化客服
icon check
如何提昇 AI 對話品質

H1 H1 H1 大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題

H2 H2 H2 大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題

H3 H3 H3 大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題大標題

改掉的字喔!

註解
quote 引言的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份的部份
  1. 點點點
  2. 二案二二兒

連結

你可能會喜歡

LINE 從行銷工具
輕鬆轉型 Social CRM

你要的工具,我們都有
透過 OakMega 讓 LINE 完成個人化行銷

個人化行銷

透過獨創的時效 / 強度標籤精準洞悉會員 Persona,執行精準推播;並可設定行銷流程,完成全自動化導購。
透過 OakMega 讓 LINE 完成一對一客服

一對一客服

可設定上下班時間、訊息自動分流,適用於大型客服團隊;外加客服滿意度調查模組,輕鬆完成績效評估。
透過 OakMega 讓 LINE 完成高效率銷售

高效率銷售

LINE 官方帳號取代私人帳號,減少雜亂的聊天室,提昇品牌專業度;結合 CRM 系統,留住每一線人脈。
了解更多
即刻轉型
Social CRM
行銷、銷售、客服三位一體
15 分鐘立刻擁有 CRM 系統
企業客戶訂製客製開發功能
OakMega 大橡科技正在招募
專注於 Social CRM 技術,讓資訊有效地被傳遞,讓關係溫暖地被連結。
聯絡我們
OakMega 產品健康度監測
合作夥伴
合作夥伴
專注於 Social CRM 技術,讓資訊有效地被傳遞,讓關係溫暖地被連結。