如何建立 Facebook Login、Google Login、LINE Login 應用程式並將登入介面切換成自家品牌 LOGO 和名稱？

*最後更新時間：2023/05/24

當會員與訪客透過 Akohub 的社群一鍵登入進行登入時，系統會跳出帳戶存取要求介面，並預設顯示為 Akohub 的標誌與名稱（如箭頭指向處）。您可以按照以下步驟將 Google、Facebook 與 LINE 的登入介面更改為您的品牌標誌與名稱，從而提供您的會員更加一致的登入體驗。

 

一、建立 Google Login App：

  1. 前往 Google Cloud Platform 建立專案：https://console.cloud.google.com
  2. 前往「憑證」頁面：https://console.cloud.google.com/apis/credentials
  3. 點擊「建立憑證」>「OAuth 用戶端 ID」
  4. 點擊「設定同意畫面」，將「User Type」勾選為「外部」並點擊「建立」。
  5. 前往「OAuth 同意畫面」自訂您的標誌與名稱：https://console.cloud.google.com/apis/credentials/consent
  6. 輸入您的應用程式名稱並上傳您的標誌。
  7. 輸入您的首頁、隱私政策和服務條款 URL。
  8. 在「已授權的域名」中輸入您的網站 URL。
  9. 提交表單並等待應用程式驗證。
  10. 給 OAuth 2.0 用戶端命名。
  11. 在「已授權的 JavaScript 來源」中輸入 https://app.akohub.com。
  12. 在「已授權的重新導向 URI」中輸入 https://app.akohub.com/social/google/oauth。
  13. 點擊「建立」。
  14. 建立成功後您會獲得一組「Client ID 」與「Client secret」，請將其複製貼上到 Ako Marketing Retargeting Ads App > Settings > Social Login > Google Custom。


 

二、建立 Facebook Login App：

  1. 建立 Facebook 應用程式：https://developers.facebook.com/apps
  2. 按照步驟完成設置：https://developers.facebook.com/docs/development/create-an-app
  3. 在「顯示名稱」中輸入您的品牌名稱。它將顯示在 Facebook 登入的彈出窗口中，讓您的客戶看到。
  4. 在「應用程式網域」中輸入「app.akohub.com」 和您的商店域名。
  5. 在「隱私政策 URL」和「用戶數據刪除」中輸入您的商店隱私權政策 URL。
  6. 在「服務條款 URL」中輸入您的商店服務條款 URL。
  7. 在「應用程式圖示」中上傳您的品牌標誌。
  8. 在「網站」>「網站 URL」中輸入您商店的 URL。
  9. 在左邊側欄「Facebook Login」>「Settings」請在「Valid OAuth Redirect URIs」的欄位將這串連結複製貼上：https://app.akohub.com/social/facebook/oauth
  10. 複製「App ID」和「App secret」並將其貼到 Ako Marketing Retargeting Ads > Settings > Social Login > Facebook Custom。

三、建立 LINE Login App ：

  1. 建立 LINE 開發者帳號：https://developers.line.biz/console
  2. 建立新的 Provider 和新的 Channel。
  3. 選擇「LINE Login」。
  4. 填寫「頻道名稱」、「頻道說明」、「電子郵件地址」、「隱私權政策 URL」和「使用條款 URL」，並選擇「Web app」作為應用程式類型。
  5. 在「LINE Login」頁籤，請開啟「Use LINE login in your web app」並在「Callback URL」將這串連結複製貼上：https://app.akohub.com/social/line/oauth
  6. 請在 OpenID Connect 中申請 Email 地址權限。您可以參考教學：https://developers.line.biz/en/docs/line-login/integrate-line-login/#applying-for-email-permission 並完成提交。
  7. 找到「Channel ID」和「Channel secret」並將其複製貼上到 Ako Marketing Retargeting Ads > Settings > Social Login > LINE Custom。
返回網誌