LINE 帳號快速註冊／登入商店會員｜顧客登入設定

Avatar
SHOPLINE TW Copywriters
追蹤

4. EC + SC.png

⚠️ 開始前請注意：

  • 透過 LINE 發送的訊息都將以付費訊息發送，會佔用 LINE 每月免費訊息的額度。
  • 為保障資料安全，當顧客登入後閒置逾 24 小時，系統將自動登出；閒置判斷基準為未執行需要網路連線的操作，如重新載入網頁、搜尋商品、提交資料等。

SHOPLINE 提供多元的會員註冊及登入方式讓店家做選擇，顧客除了可透過 Email 和 Facebook 帳號註冊/登入會員 外，現在店家也可以設定讓顧客使用 LINE 帳號成為商店會員，當商店有簡單方便的註冊/登入方法，可以提高顧客加入商店會員的意願，幫助店家累積會員數。

 

步驟一：確認商店計畫方案，開始使用 

進入商店後台右上角「你好，OOO」>「我的訂閱紀錄」查看商店的計畫方案和模組。

  1. 如果您看到的畫面如下圖，頁面內容中有「開店方案」及「功能模組」請先確認您的商店是否有「網路開店/社群購物」方案。有的話可以前往步驟二進行設定。
    CHT_Step1-1.png
  2. 如果您看到的畫面如下圖，頁面內容中的「計畫」為基本計畫、高階計畫、豪華計畫、O2O、企業旗艦計畫。請您先確認您的商店是否為「豪華、O2O、企業旗艦」計畫。
    CHT_Step1-2.png

    如果是「豪華計畫」的話請進入左側目錄選單中的「擴充功能」>「擴充功能商店」來安裝「LINE 快速註冊與登入」。
    ___2021-01-07___4.44.43.png

    如果是「O2O、企業旗艦」的話請進入左側目錄選單中的「擴充功能」>「擴充功能商店」來安裝「LINE 功能串接」。
    ___2021-01-07___4.44.52.png

 

步驟二：進入後台「LINE」介面

前往「商店後台 > 第三方服務整合 > LINE」。

Screen_Shot_2019-05-22_at_17.26.06.png

 

步驟三 ：開啟 LINE 註冊及登入

將「開啟 LINE 註冊及登入」的開關調整為開啟後會跳轉至設定頁面。

mceclip2.png

＊該頁面其餘功能與 LINE@ 相關，屬旗艦計畫 / O2O 計畫支援，如有興趣了解更多，可於右下角對話視窗留下聯絡方式。

 

步驟四：LINE developer

請先進入「LINE developer」，並於該頁面點擊「LINE Login > Start now」後用 LINE 帳號登入，若為公司戶，可使用公司的 LINE 帳號。

mceclip3.png

mceclip4.png

 

步驟五：輸入「Name」及「Email address」欄位

於「Name」及「Email address」欄位輸入欲在應用程式頁面使用的名稱及電子信箱，並勾選「我已閱讀且同意 LINE 應用程式協議」後點「Confirm」及下一步的「Register」，「Name」及「Email address」之後皆可再做修改。

 

步驟六：點按「Create New Provider」

點選「 Create 」並於「Provider name」欄位輸入「您的公司名稱」後，點選下方的「 Create 」。

mceclip6.png

 

步驟七：點 LINE Login 框裡的「Create a LINE Login channel」

mceclip7.png

 

並上傳一張圖店（可用商店 Logo 圖）、輸入「Channel name」及「Channel description」，這些內容在顧客透過 LINE 註冊時，會於頁面中看到，保存後亦可再做編輯，務必留意於「Channel name」欄位請勿輸入空格，避免在最後保存時出現錯誤提示。

mceclip10.png

 

接著在「App types (can select more than one) 」同時勾選「WEB app」和「Mobile app」，再於下方輸入 Email address 地址，勾選「我已閱讀且同意 LINE 應用程式協議」再點「Create」。

*Email address 欄位下方的「Privacy policy URL」和「Terms of use URL」為選填，留空即可。

mceclip9.png

mceclip11.png

 

步驟八：確認設定資訊

在 LINE Login channel 點選「Basic settings」分頁，請務必確認您有確實完成以下非常重要的三件事，以確保商店可以正常使用 LINE 註冊/登入功能。

1. 找到「Channel ID」及「Channel secret」，這是專屬的設定值，請複製後於後台相對應的欄位內貼上。

＊注意：務必留意貼上於後台的設定值正確，避免顧客在前台使用 LINE 帳號註冊/登入時看到「400」的錯誤提示。

mceclip14.png

mceclip15.png

複製貼到以下商店後台欄位。

mceclip0.png

 

2. 找到「App types」確認是否顯示「Mobile app」和「Web app」。

mceclip0.png

 

3. 找到「OpenID Connect > Email address permission」後會先看到預設顯示「Unapplied」，須點右邊的「Apply」，接著，勾選下圖中兩個選項，並上傳「商店公告隱私權政策（告知顧客會存取使用者之 Email 地址）」的內容截圖畫面，完成後點「Submit」。

mceclip0.png

 

完成後，原先的「Unapplied」會更新為「Applied」。

mceclip17.png

＊注意：若該欄位維持 unapplied，您的顧客在商店前台使用 LINE 帳號註冊/登入時，會看到以下錯誤提示，且無法完成商店會員註冊/登入。

Screen_Shot_2019-05-22_at_12.35.45.png

不過若顯示為 applied，但部分顧客嘗試使用 LINE 帳號註冊/登入時仍看到該錯誤提示，這表示顧客使用的 LINE 帳號未綁定 Email 地址，因此要請顧客使用手機上的 LINE 應用程式，進入「設定>我的帳號」的畫面後於「電子郵件帳號」欄位輸入 Email 綁定即可。

 

步驟九：複製貼上 Callback URL

複製 SHOPLINE 後台的 Callback URL，並進入LINE「LINE Login」分頁，找到「Web app > Callback URL」下方的「Edit」按鈕，將剛剛複製的 URL 貼於此欄位，再按下「Update」即可。

mceclip0.png

mceclip18.png

 

＊注意：若未完成此步驟，顧客在前台使用 LINE 帳號註冊/登入時會看到「400」的錯誤提示。

image__5_.png

 

步驟十：狀態更新為「Published」

加油～來到最後一哩路了！在該頁面右上角可以看到「Developing」的狀態，請點擊後選「Publish」，接著狀態會更新為「Published」。

mceclip19.png

mceclip20.png 

 

步驟十一 ：連接

於 SHOPLINE 後台「第三方服務整合 > LINE > 連接 LINE 註冊及登入」頁面右下角點擊「連接」，當看到「開啟 LINE 註冊及登入成功！」的提示表示設定成功。

 image12.png

 

完成以上設定步驟且後台「第三方服務整合 > LINE」的「開啟 LINE 註冊及登入」為開啟的狀態下，您商店前台的會員註冊/登入頁面即可看到「使用 LINE 登入」的按鈕。

Screen_Shot_2019-05-23_at_14.47.16.png

 

如上述步驟完成後，仍無法於商店前台使用 LINE 帳號註冊/登入會員，可於後台留言給線上顧問，並將 support@shopline.com 加入您的 LINE 應用程式管理員，我們會協助查看您於 LINE 應用程式的設定。

*加入 LINE 應用程式管理員步驟： 必須先完成步驟一至七後，可於 Channel 資訊頁面的「Roles」分頁按下「Add」，接著點「Register individual email addresses」並輸入 support@shopline.com 且 Role 須為 Admin，確認後我們會收到邀請信件。

 

 

 

 

 

還有其他問題？提交請求

評論